diff --git a/packages/main/src/Input.js b/packages/main/src/Input.js index 141dcc0f2671..962be45df78e 100644 --- a/packages/main/src/Input.js +++ b/packages/main/src/Input.js @@ -1080,14 +1080,10 @@ class Input extends UI5Element { return this.hasValueState ? `${this._id}-valueStateDesc` : ""; } - get suggestionsCount() { - return this.showSuggestions ? `${this._id}-suggestionsCount` : ""; - } - get accInfo() { const ariaHasPopupDefault = this.showSuggestions ? "true" : undefined; const ariaAutoCompleteDefault = this.showSuggestions ? "list" : undefined; - const ariaDescribedBy = this._inputAccInfo.ariaDescribedBy ? `${this.suggestionsTextId} ${this.valueStateTextId} ${this.suggestionsCount} ${this._inputAccInfo.ariaDescribedBy}`.trim() : `${this.suggestionsTextId} ${this.valueStateTextId} ${this.suggestionsCount}`.trim(); + const ariaDescribedBy = this._inputAccInfo.ariaDescribedBy ? `${this.suggestionsTextId} ${this.valueStateTextId} ${this._inputAccInfo.ariaDescribedBy}`.trim() : `${this.suggestionsTextId} ${this.valueStateTextId}`.trim(); return { "input": { @@ -1200,7 +1196,7 @@ class Input extends UI5Element { } get availableSuggestionsCount() { - if (this.showSuggestions) { + if (this.showSuggestions && (this.value || this.Suggestions.isOpened())) { switch (this.suggestionsTexts.length) { case 0: return this.i18nBundle.getText(INPUT_SUGGESTIONS_NO_HIT); diff --git a/packages/main/src/MultiInput.js b/packages/main/src/MultiInput.js index 384adb15114f..1da68c841bc5 100644 --- a/packages/main/src/MultiInput.js +++ b/packages/main/src/MultiInput.js @@ -280,7 +280,7 @@ class MultiInput extends Input { } get accInfo() { - const ariaDescribedBy = `${this._tokensCountTextId} ${this.suggestionsTextId} ${this.valueStateTextId} ${this.suggestionsCount}`.trim(); + const ariaDescribedBy = `${this._tokensCountTextId} ${this.suggestionsTextId} ${this.valueStateTextId}`.trim(); return { "input": { ...super.accInfo.input, diff --git a/packages/main/test/specs/Input.spec.js b/packages/main/test/specs/Input.spec.js index 563a13f62c10..cc59b922aacf 100644 --- a/packages/main/test/specs/Input.spec.js +++ b/packages/main/test/specs/Input.spec.js @@ -458,4 +458,32 @@ describe("Input general interaction", () => { assert.notOk(popover.isDisplayedInViewport(), "The popover is not visible"); assert.ok(dialog.isDisplayedInViewport(), "The dialog is opened."); }); + + it("Suggestions count should be read out when necessary", () => { + browser.url(`http://localhost:${PORT}/test-resources/pages/Input.html`); + + const inputDynamicSuggestions = $("#inputCompact"); + const inputSuggestions = $("#myInput2"); + const dynamicSuggestionsInnerInput = inputDynamicSuggestions.shadow$("input"); + const dynamicSuggestionsCount = inputDynamicSuggestions.shadow$(`#${inputDynamicSuggestions.getProperty("_id")}-suggestionsCount`); + const suggestionsCount = inputSuggestions.shadow$(`#${inputSuggestions.getProperty("_id")}-suggestionsCount`); + + //act + dynamicSuggestionsInnerInput.click(); + + //assert + assert.strictEqual(dynamicSuggestionsCount.getText(), "", "Suggestions count is not available"); + + //act + dynamicSuggestionsInnerInput.keys("c"); + + //assert + assert.strictEqual(dynamicSuggestionsCount.getText(), "4 results are available", "Suggestions count is available since value is entered"); + dynamicSuggestionsInnerInput.keys("Backspace"); + //act + inputSuggestions.click(); + + //assert + assert.strictEqual(suggestionsCount.getText(), "5 results are available", "Suggestions count is available since the suggestions popover is opened"); + }); }); diff --git a/packages/main/test/specs/MultiInput.spec.js b/packages/main/test/specs/MultiInput.spec.js index f899d7e22bf9..0053bbfc7fc3 100644 --- a/packages/main/test/specs/MultiInput.spec.js +++ b/packages/main/test/specs/MultiInput.spec.js @@ -175,8 +175,7 @@ describe("ARIA attributes", () => { const innerInput = mi.shadow$("input"); const tokensCountITextId = `${mi.getProperty("_id")}-hiddenText-nMore`; const suggestionsITextId = `${mi.getProperty("_id")}-suggestionsText`; - const suggestionsCountITextId = `${mi.getProperty("_id")}-suggestionsCount`; - const ariaDescribedBy = `${tokensCountITextId} ${suggestionsITextId} ${suggestionsCountITextId}`; + const ariaDescribedBy = `${tokensCountITextId} ${suggestionsITextId}`; $("#suggestion-token").scrollIntoView(); innerInput.click();