mirror of
https://github.com/Choices-js/Choices.git
synced 2024-06-01 21:42:30 +02:00
select-one input is now not focusable in disabled state (fixes #137)
This commit is contained in:
parent
9bb84df8d0
commit
6d894d4352
|
@ -881,6 +881,9 @@ class Choices {
|
||||||
this.input.removeAttribute('disabled');
|
this.input.removeAttribute('disabled');
|
||||||
this.containerOuter.classList.remove(this.config.classNames.disabledState);
|
this.containerOuter.classList.remove(this.config.classNames.disabledState);
|
||||||
this.containerOuter.removeAttribute('aria-disabled');
|
this.containerOuter.removeAttribute('aria-disabled');
|
||||||
|
if (this.passedElement.type === 'select-one') {
|
||||||
|
this.containerOuter.setAttribute('tabindex', '0');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
|
@ -899,6 +902,9 @@ class Choices {
|
||||||
this.input.setAttribute('disabled', '');
|
this.input.setAttribute('disabled', '');
|
||||||
this.containerOuter.classList.add(this.config.classNames.disabledState);
|
this.containerOuter.classList.add(this.config.classNames.disabledState);
|
||||||
this.containerOuter.setAttribute('aria-disabled', 'true');
|
this.containerOuter.setAttribute('aria-disabled', 'true');
|
||||||
|
if (this.passedElement.type === 'select-one') {
|
||||||
|
this.containerOuter.setAttribute('tabindex', '-1');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
|
|
|
@ -781,6 +781,42 @@ it('should trigger hideDropdown on dropdown closing', function() {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('should handle public methods on select-one input types', function() {
|
||||||
|
beforeEach(function() {
|
||||||
|
this.input = document.createElement('select');
|
||||||
|
this.input.className = 'js-choices';
|
||||||
|
this.input.placeholder = 'Placeholder text';
|
||||||
|
|
||||||
|
for (let i = 1; i < 10; i++) {
|
||||||
|
const option = document.createElement('option');
|
||||||
|
|
||||||
|
option.value = `Value ${i}`;
|
||||||
|
option.innerHTML = `Value ${i}`;
|
||||||
|
|
||||||
|
if (i % 2) {
|
||||||
|
option.selected = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.input.appendChild(option);
|
||||||
|
}
|
||||||
|
|
||||||
|
document.body.appendChild(this.input);
|
||||||
|
this.choices = new Choices(this.input);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should handle disable()', function() {
|
||||||
|
this.choices.disable();
|
||||||
|
|
||||||
|
expect(this.choices.containerOuter.getAttribute('tabindex')).toBe('-1');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should handle enable()', function() {
|
||||||
|
this.choices.enable();
|
||||||
|
|
||||||
|
expect(this.choices.containerOuter.getAttribute('tabindex')).toBe('0');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
describe('should handle public methods on text input types', function() {
|
describe('should handle public methods on text input types', function() {
|
||||||
beforeEach(function() {
|
beforeEach(function() {
|
||||||
this.input = document.createElement('input');
|
this.input = document.createElement('input');
|
||||||
|
|
Loading…
Reference in a new issue