diff --git a/src/scripts/src/components/container.js b/src/scripts/src/components/container.js index 649159c..18f5bcb 100644 --- a/src/scripts/src/components/container.js +++ b/src/scripts/src/components/container.js @@ -131,7 +131,7 @@ export default class Container { * Remove disabled state */ enable() { - this.element.classList.remove(this.config.classNames.disabledState); + this.element.classList.remove(this.classNames.disabledState); this.element.removeAttribute('aria-disabled'); if (this.parentInstance.isSelectOneElement) { this.element.setAttribute('tabindex', '0'); @@ -143,7 +143,7 @@ export default class Container { * Set disabled state */ disable() { - this.element.classList.add(this.config.classNames.disabledState); + this.element.classList.add(this.classNames.disabledState); this.element.setAttribute('aria-disabled', 'true'); if (this.parentInstance.isSelectOneElement) { this.element.setAttribute('tabindex', '-1'); diff --git a/src/scripts/src/components/container.test.js b/src/scripts/src/components/container.test.js index f3950a8..d0edd56 100644 --- a/src/scripts/src/components/container.test.js +++ b/src/scripts/src/components/container.test.js @@ -264,16 +264,76 @@ describe('components/container', () => { }); }); - // describe('enable', () => { - // it('removes disabled state class', () => {}); - // it('removes aria-disabled attribute', () => { }); - // it('sets isDisabled flag to true', () => {}); - // }); + describe('enable', () => { + beforeEach(() => { + instance.disable(); + }); + + it('removes disabled state class', () => { + expect(instance.element.classList.contains(DEFAULT_CLASSNAMES.disabledState)).to.equal(true); + instance.enable(); + expect(instance.element.classList.contains(DEFAULT_CLASSNAMES.disabledState)).to.equal(false); + }); + + it('removes aria-disabled attribute', () => { + expect(instance.element.getAttribute('aria-disabled')).to.equal('true'); + instance.enable(); + expect(instance.element.getAttribute('aria-disabled')).to.equal(null); + }); + + it('sets isDisabled flag to true', () => { + instance.enable(); + expect(instance.isDisabled).to.equal(false); + }); + + describe('select one element', () => { + beforeEach(() => { + instance.parentInstance.isSelectOneElement = true; + instance.enable(); + }); + + it('sets tabindex attribute', () => { + expect(instance.element.getAttribute('tabindex')).to.equal('0'); + }); + }); + }); + + describe('disable', () => { + beforeEach(() => { + instance.enable(); + }); + + it('removes disabled state class', () => { + expect(instance.element.classList.contains(DEFAULT_CLASSNAMES.disabledState)).to.equal(false); + instance.disable(); + expect(instance.element.classList.contains(DEFAULT_CLASSNAMES.disabledState)).to.equal(true); + }); + + it('removes aria-disabled attribute', () => { + expect(instance.element.getAttribute('aria-disabled')).to.equal(null); + instance.disable(); + expect(instance.element.getAttribute('aria-disabled')).to.equal('true'); + }); + + it('sets isDisabled flag to true', () => { + instance.disable(); + expect(instance.isDisabled).to.equal(true); + }); + + describe('select one element', () => { + beforeEach(() => { + instance.parentInstance.isSelectOneElement = true; + instance.disable(); + }); + + it('sets tabindex attribute', () => { + expect(instance.element.getAttribute('tabindex')).to.equal('-1'); + }); + }); + }); + + // describe('revert', () => { - // describe('disable', () => { - // it('adds disabled state class', () => {}); - // it('adds aria-disabled attribute', () => { }); - // it('sets isDisabled flag to false', () => { }); // }); describe('addLoadingState', () => {