HFP-3918 Replace title with aria-label

h5p · Apr 16, 2024 · 82bf251 · 82bf251
1 parent ce26c56
commit 82bf251
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 3 deletions.
diff --git a/src/scripts/go-to-slide.js b/src/scripts/go-to-slide.js
@@ -1,4 +1,4 @@
-import { addClickAndKeyboardListeners } from './utils';
+import { addClickAndKeyboardListeners, stripHTML, decodeHTML } from './utils';
 import { jQuery as $, EventDispatcher } from './globals';
 
 /**
@@ -70,7 +70,7 @@ export default class GoToSlide {
       href: '#',
       'class': classes,
       tabindex: tabindex,
-      title: title
+      'aria-label': stripHTML(decodeHTML(title))
     });
 
     addClickAndKeyboardListeners(this.$element, event => {

diff --git a/src/scripts/utils.js b/src/scripts/utils.js
@@ -105,4 +105,17 @@ const $STRIP_HTML_HELPER = $('<div>');
  * @param {string} str
  * @return {string}
  */
-export const stripHTML = str => $STRIP_HTML_HELPER.html(str).text().trim();
+export const stripHTML = str => $STRIP_HTML_HELPER.html(str).text().trim();
+
+/**
+ * Decode text with HTML entities to text.
+ *
+ * Beware that this does not strip HTML tags, it only decodes HTML entities.
+ * @param {string} html HTML with encoded entities.
+ * @returns {string} Decoded text.
+ */
+export const decodeHTML = (html) => {
+  const div = document.createElement('div');
+  div.innerHTML = html;
+  return div.textContent || div.innerText || '';
+};