mirror of
https://github.com/Choices-js/Choices.git
synced 2024-05-06 23:56:34 +02:00
0e44a916e3
* breaking test
* Remove ablity to pass multiple elements + tests
* Update readme
* Update README.md
* 🔖 Version 8.0.0
* Remove type definition hack
* Update coverage command
* Add some missing list tests
* Remove .only
* Update demo page to loop over elements
* Update constructor to set initialised flag if already active
* Make templates private
* Throw type error once if element is invalid
* Fix list children bug
* Re-add generic examples to index.html
* Housekeeping
* Use typeof instead of isType where applicable
* Remove isElement
* Add test for isIE11
242 lines
6.8 KiB
JavaScript
242 lines
6.8 KiB
JavaScript
import { expect } from 'chai';
|
|
import { stub } from 'sinon';
|
|
import {
|
|
getRandomNumber,
|
|
generateChars,
|
|
generateId,
|
|
getType,
|
|
isType,
|
|
sanitise,
|
|
sortByAlpha,
|
|
sortByScore,
|
|
isIE11,
|
|
existsInArray,
|
|
cloneObject,
|
|
dispatchEvent,
|
|
} from './utils';
|
|
|
|
describe('utils', () => {
|
|
describe('getRandomNumber', () => {
|
|
it('returns random number between range', () => {
|
|
for (let index = 0; index < 10; index++) {
|
|
const output = getRandomNumber(1, 10);
|
|
expect(output).to.be.a('number');
|
|
expect(output).to.be.within(1, 10);
|
|
}
|
|
});
|
|
});
|
|
|
|
describe('generateChars', () => {
|
|
it('generates a string of random chars with given length', () => {
|
|
const output = generateChars(10);
|
|
expect(output).to.be.a('string');
|
|
expect(output).to.have.length(10);
|
|
});
|
|
});
|
|
|
|
describe('generateId', () => {
|
|
describe('when given element has id value', () => {
|
|
it('generates a unique prefixed id based on given elements id', () => {
|
|
const element = document.createElement('div');
|
|
element.id = 'test-id';
|
|
const prefix = 'test-prefix';
|
|
|
|
const output = generateId(element, prefix);
|
|
|
|
expect(output).to.equal(`${prefix}-${element.id}`);
|
|
});
|
|
});
|
|
|
|
describe('when given element has no id value but name value', () => {
|
|
it('generates a unique prefixed id based on given elements name plus 2 random characters', () => {
|
|
const element = document.createElement('div');
|
|
element.name = 'test-name';
|
|
const prefix = 'test-prefix';
|
|
|
|
const output = generateId(element, prefix);
|
|
const expectedOutput = `${prefix}-${element.name}-`;
|
|
|
|
expect(output).to.contain(expectedOutput);
|
|
expect(output).to.have.length(expectedOutput.length + 2);
|
|
});
|
|
});
|
|
|
|
describe('when given element has no id value and no name value', () => {
|
|
it('generates a unique prefixed id based on 4 random characters', () => {
|
|
const element = document.createElement('div');
|
|
const prefix = 'test-prefix';
|
|
|
|
const output = generateId(element, prefix);
|
|
const expectedOutput = `${prefix}-`;
|
|
|
|
expect(output).to.contain(expectedOutput);
|
|
expect(output).to.have.length(expectedOutput.length + 4);
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('getType', () => {
|
|
it('returns type of given object', () => {
|
|
expect(getType({})).to.equal('Object');
|
|
expect(getType(1)).to.equal('Number');
|
|
expect(getType(true)).to.equal('Boolean');
|
|
expect(getType([])).to.equal('Array');
|
|
expect(getType(() => {})).to.equal('Function');
|
|
expect(getType(new Error())).to.equal('Error');
|
|
expect(getType(new RegExp())).to.equal('RegExp');
|
|
expect(getType(new String())).to.equal('String'); // eslint-disable-line
|
|
expect(getType('')).to.equal('String');
|
|
});
|
|
});
|
|
|
|
describe('isType', () => {
|
|
it('checks with given object type equals given type', () => {
|
|
expect(isType('Object', {})).to.equal(true);
|
|
expect(isType('String', {})).to.equal(false);
|
|
});
|
|
});
|
|
|
|
describe('sanitise', () => {
|
|
it('strips HTML from value', () => {
|
|
const value = '<script>somethingMalicious();</script>';
|
|
const output = sanitise(value);
|
|
expect(output).to.equal(
|
|
'<script&rt;somethingMalicious();</script&rt;',
|
|
);
|
|
});
|
|
});
|
|
|
|
describe('sortByAlpha', () => {
|
|
describe('sorting an array', () => {
|
|
it('sorts by value alphabetically', () => {
|
|
const values = [
|
|
{ value: 'The Strokes' },
|
|
{ value: 'Arctic Monkeys' },
|
|
{ value: 'Oasis' },
|
|
{ value: 'Tame Impala' },
|
|
];
|
|
|
|
const output = values.sort(sortByAlpha);
|
|
|
|
expect(output).to.eql([
|
|
{ value: 'Arctic Monkeys' },
|
|
{ value: 'Oasis' },
|
|
{ value: 'Tame Impala' },
|
|
{ value: 'The Strokes' },
|
|
]);
|
|
});
|
|
|
|
it('sorts by label alphabetically', () => {
|
|
const values = [
|
|
{ label: 'The Strokes' },
|
|
{ label: 'Arctic Monkeys' },
|
|
{ label: 'Oasis' },
|
|
{ label: 'Tame Impala' },
|
|
];
|
|
|
|
const output = values.sort(sortByAlpha);
|
|
|
|
expect(output).to.eql([
|
|
{ label: 'Arctic Monkeys' },
|
|
{ label: 'Oasis' },
|
|
{ label: 'Tame Impala' },
|
|
{ label: 'The Strokes' },
|
|
]);
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('sortByScore', () => {
|
|
describe('sorting an array', () => {
|
|
it('sorts by score ascending', () => {
|
|
const values = [
|
|
{ score: 10 },
|
|
{ score: 3001 },
|
|
{ score: 124 },
|
|
{ score: 400 },
|
|
];
|
|
|
|
const output = values.sort(sortByScore);
|
|
|
|
expect(output).to.eql([
|
|
{ score: 10 },
|
|
{ score: 124 },
|
|
{ score: 400 },
|
|
{ score: 3001 },
|
|
]);
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('dispatchEvent', () => {
|
|
it('dispatches custom event of given type on given element', () => {
|
|
const fakeElement = {
|
|
dispatchEvent: stub(),
|
|
};
|
|
const eventType = 'testEvent';
|
|
const customArgs = {
|
|
testing: true,
|
|
};
|
|
|
|
dispatchEvent(fakeElement, eventType, customArgs);
|
|
|
|
expect(fakeElement.dispatchEvent.called).to.equal(true);
|
|
const event = fakeElement.dispatchEvent.lastCall.args[0];
|
|
expect(event).to.be.instanceof(CustomEvent);
|
|
expect(event.bubbles).to.equal(true);
|
|
expect(event.cancelable).to.equal(true);
|
|
expect(event.detail).to.equal(customArgs);
|
|
});
|
|
});
|
|
|
|
describe('isIE11', () => {
|
|
it('returns whether the given user agent string matches an IE11 user agent string', () => {
|
|
const IE11UserAgent =
|
|
'Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko';
|
|
const firefoxUserAgent =
|
|
'Mozilla/5.0 (Android 4.4; Mobile; rv:41.0) Gecko/41.0 Firefox/41.0';
|
|
|
|
expect(isIE11(IE11UserAgent)).to.equal(true);
|
|
expect(isIE11(firefoxUserAgent)).to.equal(false);
|
|
});
|
|
});
|
|
|
|
describe('existsInArray', () => {
|
|
it('determines whether a value exists within given array', () => {
|
|
const values = [
|
|
{ value: 'The Strokes' },
|
|
{ value: 'Arctic Monkeys' },
|
|
{ value: 'Oasis' },
|
|
{ value: 'Tame Impala' },
|
|
];
|
|
|
|
expect(existsInArray(values, 'Oasis', 'value')).to.equal(true);
|
|
expect(existsInArray(values, 'The Beatles', 'value')).to.equal(false);
|
|
});
|
|
});
|
|
|
|
describe('cloneObject', () => {
|
|
it('deeply clones a given object', () => {
|
|
const object = {
|
|
levelOne: {
|
|
id: 1,
|
|
levelTwo: {
|
|
id: 2,
|
|
levelThree: {
|
|
id: 3,
|
|
levelFour: {
|
|
id: 4,
|
|
},
|
|
},
|
|
},
|
|
},
|
|
};
|
|
|
|
const output = cloneObject(object);
|
|
|
|
expect(output).to.not.equal(object);
|
|
expect(output).to.eql(object);
|
|
});
|
|
});
|
|
});
|