Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

DEV: Add `aria-label` option to the `d-icon` helper (#17741) 

Extracted from https://github.com/discourse/discourse/pull/17379.
This commit is contained in:
Osama Sayegh 2022-08-03 09:33:50 +03:00 committed by GitHub
parent ce9eec8606
commit 53dd9b0c66
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/discourse-common/addon/lib/icon-library.js
View File

@ -150,6 +150,10 @@ registerIconRenderer({
if (params.label) { if (params.label) {
html += " aria-hidden='true'"; html += " aria-hidden='true'";
} else if (params["aria-label"]) {
html += ` aria-hidden='false' aria-label='${escape(
params["aria-label"]
)}'`;
} }
html += ` xmlns="${SVG_NAMESPACE}"><use href="#${id}" /></svg>`; html += ` xmlns="${SVG_NAMESPACE}"><use href="#${id}" /></svg>`;
if (params.label) { if (params.label) {

10
app/assets/javascripts/discourse/tests/unit/lib/icon-library-test.js
View File

@ -25,15 +25,21 @@ module("Unit | Utility | icon-library", function () {
assert.ok(!iconHTML(iconC).includes(" "), "trims whitespace"); assert.ok(!iconHTML(iconC).includes(" "), "trims whitespace");
}); });
test("escape icon names, classes and titles", function (assert) { test("escape icon names, classes, titles and aria-label", function (assert) {
const html = iconHTML("'<img src='x'>", { let html = iconHTML("'<img src='x'>", {
translatedTitle: "'<script src='y'>", translatedTitle: "'<script src='y'>",
label: "<iframe src='z'>", label: "<iframe src='z'>",
class: "'<link href='w'>", class: "'<link href='w'>",
"aria-label": "<script>alert(1)",
}); });
assert.ok(html.includes("&#x27;&lt;img src=&#x27;x&#x27;&gt;")); assert.ok(html.includes("&#x27;&lt;img src=&#x27;x&#x27;&gt;"));
assert.ok(html.includes("&#x27;&lt;script src=&#x27;y&#x27;&gt;")); assert.ok(html.includes("&#x27;&lt;script src=&#x27;y&#x27;&gt;"));
assert.ok(html.includes("&lt;iframe src=&#x27;z&#x27;&gt;")); assert.ok(html.includes("&lt;iframe src=&#x27;z&#x27;&gt;"));
assert.ok(html.includes("&#x27;&lt;link href=&#x27;w&#x27;&gt;")); assert.ok(html.includes("&#x27;&lt;link href=&#x27;w&#x27;&gt;"));
html = iconHTML("'<img src='x'>", {
"aria-label": "<script>alert(1)",
});
assert.ok(html.includes("aria-label='&lt;script&gt;alert(1)'"));
}); });
}); });