mirror of
https://github.com/Choices-js/Choices.git
synced 2024-06-15 20:25:18 +02:00
Use parentInstance + begin adding container tests
This commit is contained in:
parent
48e35a88da
commit
843d1f66bb
|
@ -1,6 +1,6 @@
|
||||||
export default class Container {
|
export default class Container {
|
||||||
constructor(instance, element, classNames) {
|
constructor(instance, element, classNames) {
|
||||||
this.instance = instance;
|
this.parentInstance = instance;
|
||||||
this.element = element;
|
this.element = element;
|
||||||
this.classNames = classNames;
|
this.classNames = classNames;
|
||||||
this.config = instance.config;
|
this.config = instance.config;
|
||||||
|
@ -82,8 +82,8 @@ export default class Container {
|
||||||
* Set active descendant attribute
|
* Set active descendant attribute
|
||||||
* @param {Number} activeDescendant ID of active descendant
|
* @param {Number} activeDescendant ID of active descendant
|
||||||
*/
|
*/
|
||||||
setActiveDescendant(activeDescendant) {
|
setActiveDescendant(activeDescendantID) {
|
||||||
this.element.setAttribute('aria-activedescendant', activeDescendant);
|
this.element.setAttribute('aria-activedescendant', activeDescendantID);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -137,7 +137,7 @@ export default class Container {
|
||||||
enable() {
|
enable() {
|
||||||
this.element.classList.remove(this.config.classNames.disabledState);
|
this.element.classList.remove(this.config.classNames.disabledState);
|
||||||
this.element.removeAttribute('aria-disabled');
|
this.element.removeAttribute('aria-disabled');
|
||||||
if (this.instance.isSelectOneElement) {
|
if (this.parentInstance.isSelectOneElement) {
|
||||||
this.element.setAttribute('tabindex', '0');
|
this.element.setAttribute('tabindex', '0');
|
||||||
}
|
}
|
||||||
this.isDisabled = false;
|
this.isDisabled = false;
|
||||||
|
@ -149,7 +149,7 @@ export default class Container {
|
||||||
disable() {
|
disable() {
|
||||||
this.element.classList.add(this.config.classNames.disabledState);
|
this.element.classList.add(this.config.classNames.disabledState);
|
||||||
this.element.setAttribute('aria-disabled', 'true');
|
this.element.setAttribute('aria-disabled', 'true');
|
||||||
if (this.instance.isSelectOneElement) {
|
if (this.parentInstance.isSelectOneElement) {
|
||||||
this.element.setAttribute('tabindex', '-1');
|
this.element.setAttribute('tabindex', '-1');
|
||||||
}
|
}
|
||||||
this.isDisabled = true;
|
this.isDisabled = true;
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import { expect } from 'chai';
|
import { expect } from 'chai';
|
||||||
|
import sinon from 'sinon';
|
||||||
import Container from './container';
|
import Container from './container';
|
||||||
import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
|
import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
|
||||||
|
|
||||||
|
@ -19,7 +20,7 @@ describe('Container', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
it('assigns choices instance to class', () => {
|
it('assigns choices instance to class', () => {
|
||||||
expect(instance.instance).to.eql(choicesInstance);
|
expect(instance.parentInstance).to.eql(choicesInstance);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('assigns choices element to class', () => {
|
it('assigns choices element to class', () => {
|
||||||
|
@ -29,4 +30,96 @@ describe('Container', () => {
|
||||||
it('assigns classnames to class', () => {
|
it('assigns classnames to class', () => {
|
||||||
expect(instance.classNames).to.eql(DEFAULT_CLASSNAMES);
|
expect(instance.classNames).to.eql(DEFAULT_CLASSNAMES);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
describe('addEventListeners', () => {
|
||||||
|
let addEventListenerStub;
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
addEventListenerStub = sinon.stub(instance.element, 'addEventListener');
|
||||||
|
});
|
||||||
|
|
||||||
|
afterEach(() => {
|
||||||
|
addEventListenerStub.restore();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('adds event listeners', () => {
|
||||||
|
instance.addEventListeners();
|
||||||
|
expect(addEventListenerStub.callCount).to.equal(2);
|
||||||
|
expect(addEventListenerStub.getCall(0).args[0]).to.equal('focus');
|
||||||
|
expect(addEventListenerStub.getCall(1).args[0]).to.equal('blur');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('removeEventListeners', () => {
|
||||||
|
let removeEventListenerStub;
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
removeEventListenerStub = sinon.stub(instance.element, 'removeEventListener');
|
||||||
|
});
|
||||||
|
|
||||||
|
afterEach(() => {
|
||||||
|
removeEventListenerStub.restore();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('removes event listeners', () => {
|
||||||
|
instance.removeEventListeners();
|
||||||
|
expect(removeEventListenerStub.callCount).to.equal(2);
|
||||||
|
expect(removeEventListenerStub.getCall(0).args[0]).to.equal('focus');
|
||||||
|
expect(removeEventListenerStub.getCall(1).args[0]).to.equal('blur');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('onFocus', () => {
|
||||||
|
it('sets isFocussed flag to true', () => {
|
||||||
|
expect(instance.isFocussed).to.equal(false);
|
||||||
|
instance.onFocus();
|
||||||
|
expect(instance.isFocussed).to.equal(true);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('onBlur', () => {
|
||||||
|
it('sets isFocussed flag to false', () => {
|
||||||
|
instance.isFocussed = true;
|
||||||
|
instance.onBlur();
|
||||||
|
expect(instance.isFocussed).to.equal(false);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('focus', () => {
|
||||||
|
let focusStub;
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
focusStub = sinon.stub(instance.element, 'focus');
|
||||||
|
});
|
||||||
|
|
||||||
|
afterEach(() => {
|
||||||
|
focusStub.restore();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('focuses element if isFocussed flag is set to false', () => {
|
||||||
|
instance.isFocussed = false;
|
||||||
|
instance.focus();
|
||||||
|
expect(focusStub.callCount).to.equal(1);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('setActiveDescendant', () => {
|
||||||
|
it('sets element\'s aria-activedescendant attribute with passed descendant ID', () => {
|
||||||
|
const activeDescendantID = '1234';
|
||||||
|
expect(instance.element.getAttribute('aria-activedescendant')).to.equal(null);
|
||||||
|
instance.setActiveDescendant(activeDescendantID);
|
||||||
|
expect(instance.element.getAttribute('aria-activedescendant')).to.equal(activeDescendantID);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('removeActiveDescendant', () => {
|
||||||
|
it('remove elememnt\'s aria-activedescendant attribute', () => {
|
||||||
|
const activeDescendantID = '1234';
|
||||||
|
instance.element.setAttribute('aria-activedescendant', activeDescendantID);
|
||||||
|
expect(instance.element.getAttribute('aria-activedescendant')).to.equal(activeDescendantID);
|
||||||
|
instance.removeActiveDescendant();
|
||||||
|
expect(instance.element.getAttribute('aria-activedescendant')).to.equal(null);
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
export default class List {
|
export default class List {
|
||||||
constructor(instance, element, classNames) {
|
constructor(instance, element, classNames) {
|
||||||
this.instance = instance;
|
this.parentInstance = instance;
|
||||||
this.element = element;
|
this.element = element;
|
||||||
this.classNames = classNames;
|
this.classNames = classNames;
|
||||||
this.scrollPos = this.element.scrollTop;
|
this.scrollPos = this.element.scrollTop;
|
||||||
|
|
|
@ -19,7 +19,7 @@ describe('List', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
it('assigns choices instance to class', () => {
|
it('assigns choices instance to class', () => {
|
||||||
expect(instance.instance).to.eql(choicesInstance);
|
expect(instance.parentInstance).to.eql(choicesInstance);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('assigns choices element to class', () => {
|
it('assigns choices element to class', () => {
|
||||||
|
|
Loading…
Reference in a new issue