FIX: aria label for popup-input-tip (#15724)

popup-input-tip is used for composer validation.
Aria label is essential to for accessibility.
Also, HTML tags have to be removed
This commit is contained in:
Krzysztof Kotlarek 2022-02-02 16:23:56 +11:00 committed by GitHub
parent bb01563682
commit a1adc13125
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -5,7 +5,7 @@ import { getOwner } from "discourse-common/lib/get-owner";
export default Component.extend({ export default Component.extend({
classNameBindings: [":popup-tip", "good", "bad", "lastShownAt::hide"], classNameBindings: [":popup-tip", "good", "bad", "lastShownAt::hide"],
attributeBindings: ["role"], attributeBindings: ["role", "ariaLabel"],
rerenderTriggers: ["validation.reason"], rerenderTriggers: ["validation.reason"],
tipReason: null, tipReason: null,
lastShownAt: or("shownAt", "validation.lastShownAt"), lastShownAt: or("shownAt", "validation.lastShownAt"),
@ -19,6 +19,11 @@ export default Component.extend({
} }
}, },
@discourseComputed("validation.reason")
ariaLabel(reason) {
return reason?.replace(/(<([^>]+)>)/gi, "");
},
click() { click() {
this.set("shownAt", null); this.set("shownAt", null);
const composer = getOwner(this).lookup("controller:composer"); const composer = getOwner(this).lookup("controller:composer");