deblan-mirror/Choices
deblan-mirror/Choices
1
0
Fork 0
mirror of https://github.com/Choices-js/Choices.git synced 2024-04-26 11:20:33 +02:00
Code Issues Projects Releases Wiki Activity

ADA accessibility label fixes (#642)

Browse source 
* Update incorrect 'label-for' in demo index.html file.

* Use placeholder value for search input aria label.

* Updated input template test.

* Adding the compiled, uglified JS.
This commit is contained in:
bradwade 2019-10-10 01:49:00 -07:00 committed by Josh Johnson
parent 37db45e651
commit 5cf226f166
6 changed files with 10 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
public/assets/scripts/choices.js
View file

@ -767,9 +767,9 @@ var TEMPLATES = {
var localClasses = (0, _classnames.default)(globalClasses.item, globalClasses.itemChoice, (_classNames5 = {}, _defineProperty(_classNames5, globalClasses.itemDisabled, data.disabled), _defineProperty(_classNames5, globalClasses.itemSelectable, !data.disabled), _defineProperty(_classNames5, globalClasses.placeholder, data.placeholder), _classNames5));
return (0, _utils.strToEl)("\n <div\n class=\"".concat(localClasses, "\"\n data-select-text=\"").concat(itemSelectText, "\"\n data-choice\n data-id=\"").concat(data.id, "\"\n data-value=\"").concat(data.value, "\"\n ").concat(data.disabled ? 'data-choice-disabled aria-disabled="true"' : 'data-choice-selectable', "\n id=\"").concat(data.elementId, "\"\n ").concat(role, "\n >\n ").concat(data.label, "\n </div>\n "));
},
input: function input(globalClasses) {
input: function input(globalClasses, placeholderValue) {
var localClasses = (0, _classnames.default)(globalClasses.input, globalClasses.inputCloned);
return (0, _utils.strToEl)("\n <input\n type=\"text\"\n class=\"".concat(localClasses, "\"\n autocomplete=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n role=\"textbox\"\n aria-autocomplete=\"list\"\n >\n "));
return (0, _utils.strToEl)("\n <input\n type=\"text\"\n class=\"".concat(localClasses, "\"\n autocomplete=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n role=\"textbox\"\n aria-autocomplete=\"list\"\n aria-label=\"").concat(placeholderValue, "\"\n >\n "));
},
dropdown: function dropdown(globalClasses) {
var localClasses = (0, _classnames.default)(globalClasses.list, globalClasses.listDropdown);
@ -3538,7 +3538,7 @@ function () {
position: this.config.position
});
this.input = new _components.Input({
element: this._getTemplate('input'),
element: this._getTemplate('input', this._placeholderValue),
classNames: this.config.classNames,
type: this.passedElement.element.type
});

2
public/assets/scripts/choices.min.js vendored
View file

File diff suppressed because one or more lines are too long

2
public/index.html
View file

@ -149,7 +149,7 @@
<option value="Choice 4" disabled>Choice 4</option>
</select>
<label for="label-event">Use label in event (add/remove)</label>
<label for="choices-multiple-labels">Use label in event (add/remove)</label>
<p id="message"></p>
<select id="choices-multiple-labels" multiple></select>
<hr>

2
src/scripts/choices.js
View file

@ -1811,7 +1811,7 @@ class Choices {
});
this.input = new Input({
element: this._getTemplate('input'),
element: this._getTemplate('input', this._placeholderValue),
classNames: this.config.classNames,
type: this.passedElement.element.type,
});

3
src/scripts/templates.js
View file

@ -174,7 +174,7 @@ export const TEMPLATES = {
</div>
`);
},
input(globalClasses) {
input(globalClasses, placeholderValue) {
const localClasses = classNames(
globalClasses.input,
globalClasses.inputCloned,
@ -189,6 +189,7 @@ export const TEMPLATES = {
spellcheck="false"
role="textbox"
aria-autocomplete="list"
aria-label="${placeholderValue}"
>
`);
},

3
src/scripts/templates.test.js
View file

@ -508,9 +508,10 @@ describe('templates', () => {
spellcheck="false"
role="textbox"
aria-autocomplete="list"
aria-label="test placeholder"
>
`);
const actualOutput = templates.input(classes);
const actualOutput = templates.input(classes, 'test placeholder');
expect(getType(actualOutput)).to.equal('HTMLInputElement');
expect(stripElement(actualOutput)).to.equal(stripElement(expectedOutput));