HFP-3918 Fix small bugs with GoToSlide

src/scripts/cp.js

@@ -908,6 +908,10 @@ CoursePresentation.prototype.attachElements = function ($slide, index) {
     return; // Already attached
   }
 
+  if (index < 0 || index > this.slides.length - 1) {
+    return; // Slide does not exist
+  }
+
   var slide = this.slides[index];
   var instances = this.elementInstances[index];
   if (slide.elements !== undefined) {
@@ -1910,6 +1914,10 @@ CoursePresentation.prototype.attachAllElements = function () {
  * @returns {Boolean} Always true.
  */
 CoursePresentation.prototype.processJumpToSlide = function (slideNumber, noScroll, handleFocus) {
+  if (slideNumber < 0 || slideNumber > this.slides.length - 1) {
+    return;
+  }
+
   var that = this;
   if (this.editor === undefined && this.contentId) { // Content ID avoids crash when previewing in editor before saving
     var progressedEvent = this.createXAPIEventTemplate('progressed');
@@ -2101,7 +2109,11 @@ CoursePresentation.prototype.setOverflowTabIndex = function () {
 CoursePresentation.prototype.setSlideNumberAnnouncer = function (slideNumber, handleFocus = false) {
   let slideTitle = '';
 
-  if (!this.navigationLine) {
+  if (
+    !this.navigationLine ||
+    slideNumber < 0 ||
+    slideNumber >= this.slides.length - 1
+  ) {
     return slideTitle;
   }
 

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) => {

src/scripts/navigation-line.js

@@ -421,6 +421,10 @@ const NavigationLine = (function ($) {
   NavigationLine.prototype.updateProgressBar = function (slideNumber, prevSlideNumber, solutionMode) {
     var that = this;
 
+    if (slideNumber < 0 || slideNumber > this.cp.progressbarParts.length - 1) {
+      return; // Slide number is out of bounds
+    }
+
     // Updates progress bar progress (blue line)
     var i;
     for (i = 0; i < that.cp.progressbarParts.length; i += 1) {

src/scripts/utils.js

@@ -106,3 +106,16 @@ const $STRIP_HTML_HELPER = $('<div>');
  * @return {string}
  */
 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 || '';
+};