diff --git a/src/autocomplete/popup.js b/src/autocomplete/popup.js index 2a164758ce8..98bdb3e1116 100644 --- a/src/autocomplete/popup.js +++ b/src/autocomplete/popup.js @@ -142,6 +142,7 @@ class AcePopup { dom.removeCssClass(popup.selectedNode, "ace_selected"); el.removeAttribute("aria-activedescendant"); popup.selectedNode.removeAttribute(ariaActiveState); + popup.selectedNode.removeAttribute("aria-posinset"); popup.selectedNode.removeAttribute("id"); } popup.selectedNode = selected; diff --git a/src/autocomplete_test.js b/src/autocomplete_test.js index c9a5f5e0f83..f0b99bde78d 100644 --- a/src/autocomplete_test.js +++ b/src/autocomplete_test.js @@ -217,6 +217,55 @@ module.exports = { done(); }); }, + "test: should set aria labels for currently selected item": function(done) { + var editor = initEditor(""); + var newLineCharacter = editor.session.doc.getNewLineCharacter(); + editor.completers = [ + { + getCompletions: function (editor, session, pos, prefix, callback) { + var completions = Array(10).fill(null).map(function (i, n) { return { caption: String(n), value: String(n)};}); + callback(null, completions); + }, + triggerCharacters: [".", newLineCharacter] + } + ]; + sendKey('Return'); + var popup = editor.completer.popup; + check(function () { + assert.equal(popup.data.length, 10); + assert.ok(checkAria('0 1 2 3 4 5 6 7 8 ')); + sendKey('Down'); + check(function () { + assert.ok(checkAria('0 1 2 3 4 5 6 7 8 ')); + sendKey('Down'); + check(function () { + assert.ok(checkAria('0 1 2 3 4 5 6 7 8 ')); + sendKey('Down'); + check(function () { + sendKey('Down'); + assert.ok(checkAria('0 1 2 3 4 5 6 7 8 ')); + check(function () { + assert.ok(checkAria('0 1 2 3 4 5 6 7 8 ')); + done(); + }); + }); + }); + }); + }); + function check(callback) { + popup = editor.completer.popup; + popup.renderer.on("afterRender", function wait() { + popup.renderer.off("afterRender", wait); + callback(); + }); + } + function checkAria(expected) { + var popup = editor.completer.popup; + var innerHTML = popup.renderer.$textLayer.element.innerHTML + .replace(/\s*style="[^"]+"|class="[^"]+"|(d)iv|(s)pan/g, "$1$2"); + return innerHTML === expected; + } + }, "test: different completers tooltips": function (done) { var editor = initEditor(""); var firstDoc = "First";