@instructure/canvas-rce 5.14.1 → 5.15.0

package/es/enhance-user-content/instructure_helper.js

@@ -15,6 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 import formatMessage from '../format-message';
 import { showFlashAlert } from '../common/FlashAlert';
 import { isPreviewable, loadDocPreview, removeLoadingImage, showLoadingImage } from './doc_previews';
@@ -23,57 +24,47 @@ import { parseUrlOrNull } from '../util/url-util';
 const youTubeRegEx = /^https?:\/\/(www\.youtube\.com\/watch.*v(=|\/)|youtu\.be\/)([^&#]*)/;
 export function youTubeID(path) {
   const match = path.match(youTubeRegEx);
-
   if (match && match[match.length - 1]) {
     return match[match.length - 1];
   }
-
   return null;
 }
 export function getTld(hostname) {
   hostname = (hostname || '').split(':')[0];
   const parts = hostname.split('.'),
-        length = parts.length;
+    length = parts.length;
   return (length > 1 ? [parts[length - 2], parts[length - 1]] : parts).join('.');
 }
-export function isExternalLink(element) {
-  let canvasOrigin = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : window.location.origin;
+export function isExternalLink(element, canvasOrigin = window.location.origin) {
   let canvasHost;
-
   try {
     canvasHost = new URL(canvasOrigin).hostname;
   } catch (_ex) {
     canvasHost = window.location.hostname;
   }
-
-  const href = element.getAttribute('href'); // if a browser doesnt support <a>.hostname then just dont mark anything as external, better to not get false positives.
-
+  const href = element.getAttribute('href');
+  // if a browser doesnt support <a>.hostname then just dont mark anything as external, better to not get false positives.
   return !!(href && href.length && !href.match(/^(mailto\:|javascript\:)/) && element.hostname && getTld(element.hostname) !== getTld(canvasHost));
 }
-export function showFilePreview(event) {
-  var _event$target, _event$currentTarget;
-
-  let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+export function showFilePreview(event, opts = {}) {
   event.stopPropagation();
   const {
     canvasOrigin,
     disableGooglePreviews
-  } = { ...opts
+  } = {
+    ...opts
   };
   let target = null;
-
-  if ((_event$target = event.target) !== null && _event$target !== void 0 && _event$target.href) {
+  if (event.target?.href) {
     target = event.target;
-  } else if ((_event$currentTarget = event.currentTarget) !== null && _event$currentTarget !== void 0 && _event$currentTarget.href) {
+  } else if (event.currentTarget?.href) {
     target = event.currentTarget;
   } else {
     return;
   }
-
   if (target.classList.contains('no_preview')) {
     return;
   }
-
   if (target.classList.contains('inline_disabled') || target.classList.contains('preview_in_overlay')) {
     showFilePreviewInOverlay(event, canvasOrigin);
   } else {
@@ -81,45 +72,37 @@ export function showFilePreview(event) {
   }
 }
 export function showFilePreviewInOverlay(event, canvasOrigin) {
-  var _event$target2, _event$currentTarget2, _target;
-
   let target = null;
-
-  if ((_event$target2 = event.target) !== null && _event$target2 !== void 0 && _event$target2.href) {
+  if (event.target?.href) {
     target = event.target;
-  } else if ((_event$currentTarget2 = event.currentTarget) !== null && _event$currentTarget2 !== void 0 && _event$currentTarget2.href) {
+  } else if (event.currentTarget?.href) {
     target = event.currentTarget;
   }
-
-  const matches = (_target = target) === null || _target === void 0 ? void 0 : _target.href.match(/\/files\/(\d+~\d+|\d+)/);
-
+  const matches = target?.href.match(/\/files\/(\d+~\d+|\d+)/);
   if (matches) {
     if (event.ctrlKey || event.altKey || event.metaKey || event.shiftKey) {
       // if any modifier keys are pressed, do the browser default thing
       return;
     }
-
     event.preventDefault();
     const url = new URL(target.href);
-    const verifier = url === null || url === void 0 ? void 0 : url.searchParams.get('verifier');
-    const access_token = url === null || url === void 0 ? void 0 : url.searchParams.get('access_token');
-    const instfs_id = url === null || url === void 0 ? void 0 : url.searchParams.get('instfs_id');
+    const verifier = url?.searchParams.get('verifier');
+    const access_token = url?.searchParams.get('access_token');
+    const instfs_id = url?.searchParams.get('instfs_id');
     const file_id = matches[1];
     const params = {
       subject: 'preview_file',
       file_id
     };
     if (verifier) params.verifier = verifier;
-
     if (access_token && instfs_id) {
       params.access_token = access_token;
       params.instfs_id = instfs_id;
-    } // TODO:
+    }
+    // TODO:
     // 1. what window should we be using
     // 2. is that the right origin?
     // 3. this is temporary until we can decouple the file previewer from canvas
-
-
     window.top.postMessage(params, canvasOrigin);
   }
 }
@@ -128,21 +111,19 @@ export function showFilePreviewInline(event, canvasOrigin, disableGooglePreviews
     // if any modifier keys are pressed, do the browser default thing
     return;
   }
-
   event.preventDefault();
   const $link = event.currentTarget || event.target;
-
   if ($link.getAttribute('aria-expanded') === 'true') {
     // close the preview by clicking the "Minimize File Preview" link
     const $preview = document.getElementById($link.getAttribute('aria-controls'));
     $preview.querySelector('.hide_file_preview_link').click();
     return;
   }
-
   showLoadingImage($link);
   fetch($link.getAttribute('href').replace(/\/(download|preview)/, '') // download as part of the path
   .replace(/wrap=1&?/, '') // wrap=1 as part of the query_string
-  .replace(/[?&]$/, ''), // any trailing chars if wrap=1 was at the end
+  .replace(/[?&]$/, ''),
+  // any trailing chars if wrap=1 was at the end
   {
     method: 'GET',
     headers: {
@@ -156,16 +137,11 @@ export function showFilePreviewInline(event, canvasOrigin, disableGooglePreviews
     const attachment = data && data.attachment;
     removeLoadingImage($link);
     let canvadoc_session_url = attachment.canvadoc_session_url;
-
     if (attachment && (!disableGooglePreviews && isPreviewable(attachment.content_type) || canvadoc_session_url)) {
       $link.setAttribute('aria-expanded', 'true');
-
       if (canvasOrigin && canvadoc_session_url !== null) {
-        var _parseUrlOrNull;
-
-        canvadoc_session_url = (_parseUrlOrNull = parseUrlOrNull(canvadoc_session_url, canvasOrigin)) === null || _parseUrlOrNull === void 0 ? void 0 : _parseUrlOrNull.toString();
+        canvadoc_session_url = parseUrlOrNull(canvadoc_session_url, canvasOrigin)?.toString();
       }
-
       const $div = document.querySelector(`[id="${$link.getAttribute('aria-controls')}"]`);
       $div.style.display = 'block';
       loadDocPreview($div, {
@@ -185,7 +161,6 @@ export function showFilePreviewInline(event, canvasOrigin, disableGooglePreviews
         resetInlinePreview($link, $div);
       });
       $div.prepend($minimizeLink);
-
       if (Object.prototype.hasOwnProperty.call(event, 'originalEvent')) {
         // Only focus this link if the open preview link was initiated by a real browser event
         // If it was triggered by our auto_open stuff it shouldn't focus here.
@@ -196,19 +171,16 @@ export function showFilePreviewInline(event, canvasOrigin, disableGooglePreviews
     showFlashAlert({
       message: formatMessage('Failed getting file contents'),
       type: 'error'
-    }); // eslint-disable-next-line no-console
-
+    });
     console.error(ex);
     resetInlinePreview($link);
     removeLoadingImage($link);
   });
 }
-
 function resetInlinePreview($link, $previewContainer) {
   $link.setAttribute('aria-expanded', 'false');
   show($link);
   $link.focus();
-
   if ($previewContainer) {
     $previewContainer.innerHTML = '';
     $previewContainer.style.display = 'none';

package/es/enhance-user-content/jqueryish_funcs.js

@@ -15,30 +15,29 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 export function hidden(elem) {
   const width = elem.offsetWidth,
-        height = elem.offsetHeight;
+    height = elem.offsetHeight;
   return width === 0 && height === 0;
 }
 export function visible(elem) {
   return !hidden(elem);
-} // start: the element where we start
+}
+
+// start: the element where we start
 // selector: find an ancestor to elem that matches this
 // context: optional DOM element within which the matching element may be found
-
 export function closest(start, selector, context) {
   const upperbound = context || document.body;
   let elem = start;
-
   while (elem) {
     if (elem.matches(selector)) {
       return elem;
     }
-
     if (elem === upperbound) {
       return null;
     }
-
     elem = elem.parentElement;
   }
 }
@@ -51,7 +50,9 @@ export function show(elem) {
 }
 export function capitalize(word) {
   return word.replace(/^./, letter => letter.toUpperCase());
-} // this implementation of get|setData does not
+}
+
+// this implementation of get|setData does not
 // deal with elements being recreated in the dom
 // but that seems to be OK
 //
@@ -59,9 +60,7 @@ export function capitalize(word) {
 // from canvas, there is other code that expects to use
 // jquery data saved in enhanceUserContent, but if not
 // so something useful anyway.
-
 /* eslint-disable no-undef */
-
 export function setData(elem, key, value) {
   if (typeof $ !== 'undefined') {
     $(elem).data(key, value);
@@ -74,11 +73,9 @@ export function getData(elem, key) {
   if (typeof $ !== 'undefined') {
     return $(elem).data(key);
   }
-
   if (elem.data && key in elem.data) {
     return elem.data[key];
   }
-
   return elem.getAttribute(`data-${key}`);
 }
 /* eslint-enable no-undef */

package/es/enhance-user-content/mathml.js

@@ -15,11 +15,13 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 const MathJaxDirective = Object.freeze({
   Ignore: 'mathjax_ignore',
   Process: 'mathjax_process'
-}); // configure MathJax to use 'color' extension fo LaTeX coding
+});
 
+// configure MathJax to use 'color' extension fo LaTeX coding
 const localConfig = {
   TeX: {
     extensions: ['autoload-all.js']
@@ -47,34 +49,23 @@ const localConfig = {
   showMathMenu: true,
   messageStyle: 'none'
 };
-
 class Mathml {
-  constructor() {
-    let features = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    let config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  constructor(features = {}, config = {}) {
     this._features = features;
     this._config = config;
   }
-
-  loadMathJax() {
-    let configFile = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'TeX-MML-AM_SVG';
-    let cb = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-
+  loadMathJax(configFile = 'TeX-MML-AM_SVG', cb = null) {
     if (this.preventMathJax()) {
       return;
     }
-
     if (!this.isMathJaxLoaded()) {
-      var _this$_features, _this$_config;
-
       // Statically declare this in the localConfig above as part of MAT-1219
-      if ((_this$_features = this._features) !== null && _this$_features !== void 0 && _this$_features.explicit_latex_typesetting) {
+      if (this._features?.explicit_latex_typesetting) {
         localConfig.elements = document.getElementsByClassName(MathJaxDirective.Process);
         localConfig.tex2jax.processClass = MathJaxDirective.Process;
       }
-
-      const locale = ((_this$_config = this._config) === null || _this$_config === void 0 ? void 0 : _this$_config.locale) || 'en'; // signal local config to mathjax as it loads
-
+      const locale = this._config?.locale || 'en';
+      // signal local config to mathjax as it loads
       window.MathJax = localConfig;
       if (window.MathJaxIsLoading) return;
       window.MathJaxIsLoading = true;
@@ -85,40 +76,31 @@ class Mathml {
         script.onerror = reject;
         script.async = true;
         script.src = `//cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=${configFile}&locale=${locale}`;
-      }); // eslint-disable-next-line promise/catch-or-return
-
+      });
       scriptPromise.then(() => {
-        var _this$_features2;
-
         window.MathJax.Hub.Register.StartupHook('MathMenu Ready', function () {
           // get the mathjax context menu above the rce's equation editor
           window.MathJax.Menu.BGSTYLE['z-index'] = 2000;
         });
         window.MathJax.Hub.Register.StartupHook('End Config', function () {
           // wait until MathJAx is configured before calling the callback
-          cb === null || cb === void 0 ? void 0 : cb();
+          cb?.();
         });
-
-        if ((_this$_features2 = this._features) !== null && _this$_features2 !== void 0 && _this$_features2.new_math_equation_handling) {
+        if (this._features?.new_math_equation_handling) {
           window.MathJax.Hub.Register.MessageHook('Begin PreProcess', function (message) {
             mathImageHelper.catchEquationImages(message[1]);
           });
           window.MathJax.Hub.Register.MessageHook('Math Processing Error', function (message) {
-            var _elem$parentElement;
-
-            const elem = Array.isArray(message[1]) ? message[1][0] : message[1]; // ".math_equation_latex" is the elem we added for MathJax to typeset the image equation
-
-            if ((_elem$parentElement = elem.parentElement) !== null && _elem$parentElement !== void 0 && _elem$parentElement.classList.contains('math_equation_latex')) {
-              var _elem$parentElement$p;
-
+            const elem = Array.isArray(message[1]) ? message[1][0] : message[1];
+            // ".math_equation_latex" is the elem we added for MathJax to typeset the image equation
+            if (elem.parentElement?.classList.contains('math_equation_latex')) {
               // The equation we image we were trying to replace and failed is up 1 and back 1.
               // If we remove its "mathjaxified" attribute, the "End Math" handler
               // won't remove it from the DOM.
-              if ((_elem$parentElement$p = elem.parentElement.previousElementSibling) !== null && _elem$parentElement$p !== void 0 && _elem$parentElement$p.hasAttribute('mathjaxified')) {
+              if (elem.parentElement.previousElementSibling?.hasAttribute('mathjaxified')) {
                 elem.parentElement.previousElementSibling.removeAttribute('mathjaxified');
-              } // remove the "math processing error" mathjax output.
-
-
+              }
+              // remove the "math processing error" mathjax output.
               elem.parentElement.remove();
             }
           });
@@ -144,15 +126,15 @@ class Mathml {
               element.remove();
             });
           });
-        } // leaving this here so I don't have to keep looking up how to see all messages
+        }
+
+        // leaving this here so I don't have to keep looking up how to see all messages
         // window.MathJax.Hub.Startup.signal.Interest(function (message) {
         //   console.log('>>> MathJax startup:', message)
         // })
         // window.MathJax.Hub.signal.Interest(function(message) {
         //   console.log('>>> MathJax signal', message)
         // })
-
-
         delete window.MathJaxIsLoading;
       });
     } else {
@@ -161,116 +143,95 @@ class Mathml {
       // something has changed on the page and needs to get pulled into the MathJax ecosystem
       // window.MathJax.Hub.Reprocess([document.body])
       window.MathJax.Hub.Queue(['Typeset', window.MathJax.Hub]);
-      cb === null || cb === void 0 ? void 0 : cb();
+      cb?.();
     }
   }
-
   preventMathJax() {
     return /(?:rubrics|\/files)/.test(window.location.pathname);
   }
-
   isMathOnPage() {
     return this.isMathInElement(document.body);
   }
-
   isMathInElement(elem) {
-    var _this$_features3;
-
-    if ((elem === null || elem === void 0 ? void 0 : elem.getAttribute('data-testid')) === 'mathml-preview-element') {
+    if (elem?.getAttribute('data-testid') === 'mathml-preview-element') {
       return true;
     }
-
-    if ((_this$_features3 = this._features) !== null && _this$_features3 !== void 0 && _this$_features3.new_math_equation_handling) {
+    if (this._features?.new_math_equation_handling) {
       // handle the change from image + hidden mathml to mathjax formatted latex
       if (elem.querySelector('.math_equation_latex,.math_equation_mml')) {
         return true;
       }
-
       if (elem.querySelector('img.equation_image')) {
         return true;
-      } // look for latex the user may have entered w/o the equation editor by
-      // looking for mathjax's opening delimiters
-
+      }
 
+      // look for latex the user may have entered w/o the equation editor by
+      // looking for mathjax's opening delimiters
       if (/(?:\$\$|\\\()/.test(elem.textContent)) {
         return true;
       }
     }
-
     const mathElements = elem.getElementsByTagName('math');
-
     for (let i = 0; i < mathElements.length; i++) {
       const el = mathElements[i];
-
       if (el.offsetParent !== null && !el.closest('.hidden-readable') && !el.closest('.MJX_Assistive_MathML') // already mathjax'd
       ) {
         return true;
       }
     }
-
     return false;
   }
-
   get mathJaxGenerated() {
     return /^MathJax|MJX/;
-  } // elements to ignore selector
-
+  }
 
+  // elements to ignore selector
   get ignore_list() {
     return '#header,#mobile-header,#left-side,#quiz-elapsed-time,.ui-menu-carat';
   }
-
   isMathJaxIgnored(elem) {
-    var _this$_features4, _elem$parentElement2;
-
     if (!elem) return true;
-
-    if ((_this$_features4 = this._features) !== null && _this$_features4 !== void 0 && _this$_features4.explicit_latex_typesetting && !elem.classList.contains(MathJaxDirective.Process)) {
+    if (this._features?.explicit_latex_typesetting && !elem.classList.contains(MathJaxDirective.Process)) {
       return true;
-    } // ignore disconnected elements
-
+    }
 
-    if (!document.body.contains(elem)) return true; // check if elem is in the ignore list
+    // ignore disconnected elements
+    if (!document.body.contains(elem)) return true;
 
-    if (((_elem$parentElement2 = elem.parentElement) === null || _elem$parentElement2 === void 0 ? void 0 : _elem$parentElement2.querySelector(this.ignore_list)) === elem) {
+    // check if elem is in the ignore list
+    if (elem.parentElement?.querySelector(this.ignore_list) === elem) {
       return true;
-    } // check if elem is a child of something we're ignoring
-
+    }
 
+    // check if elem is a child of something we're ignoring
     while (elem !== document.body) {
       // child of ignored element?
       if (elem.classList.contains(MathJaxDirective.Ignore)) {
         return true;
-      } // // child of MathJax generated element?
+      }
+
+      // // child of MathJax generated element?
       // if (
       //   this.mathJaxGenerated.test(elem.id) ||
       //   this.mathJaxGenerated.test(elem.getAttribute('class'))
       // ) {
       //   return true
       // }
-
-
       elem = elem.parentElement;
     }
-
     return false;
-  } // legacy api
-
+  }
 
+  // legacy api
   isMathMLOnPage() {
     return this.isMathOnPage();
   }
-
   isMathJaxLoaded() {
-    var _window$MathJax;
-
-    return !!((_window$MathJax = window.MathJax) !== null && _window$MathJax !== void 0 && _window$MathJax.Hub);
+    return !!window.MathJax?.Hub;
   }
-
   shouldProcess(elem) {
     return this.isMathInElement(elem) && !this.isMathJaxIgnored(elem);
   }
-
   processNewMathInElem(elem) {
     if (this.shouldProcess(elem)) {
       if (this.isMathJaxLoaded()) {
@@ -280,53 +241,43 @@ class Mathml {
       }
     }
   }
+
   /*
    * elem: string with elementId or en elem object
    */
-
-
   reloadElement(elem) {
     if (this.isMathJaxLoaded()) {
       window.MathJax.Hub.Queue(['Typeset', window.MathJax.Hub, elem]);
     }
   }
-
   static get processNewMathEventName() {
     return 'process-new-math';
   }
-
 }
-
 const mathImageHelper = {
   getImageEquationText(img) {
     let equation_text;
     const src = img.getAttribute('src');
-
     if (src) {
       try {
         const url = new URL(src, 'http://localhost'); // we don't care about the host
-
         const srceq = url.pathname.split('/equation_images/')[1];
-
         if (srceq) {
           equation_text = decodeURIComponent(decodeURIComponent(srceq));
         }
-      } catch (_ex) {// If we failed to parse the src URL, something is wrong.
+      } catch (_ex) {
+        // If we failed to parse the src URL, something is wrong.
       }
     }
-
     return equation_text;
   },
-
   catchEquationImages(refnode) {
-    refnode = Array.isArray(refnode) ? refnode[0] : refnode; // find equation images and replace with inline LaTeX
-
+    refnode = Array.isArray(refnode) ? refnode[0] : refnode;
+    // find equation images and replace with inline LaTeX
     const eqimgs = refnode.querySelectorAll('img.equation_image');
-
     if (eqimgs.length > 0) {
       eqimgs.forEach(img => {
         const equation_text = this.getImageEquationText(img);
-
         if (equation_text) {
           img.setAttribute('mathjaxified', '');
           const mathtex = document.createElement('span');
@@ -334,7 +285,6 @@ const mathImageHelper = {
           mathtex.setAttribute('style', img.getAttribute('style'));
           mathtex.textContent = `\\(${equation_text}\\)`;
           mathtex.style.maxWidth = '';
-
           if (img.nextSibling) {
             img.parentElement.insertBefore(mathtex, img.nextSibling);
           } else {
@@ -345,7 +295,6 @@ const mathImageHelper = {
       return true;
     }
   },
-
   removeStrayEquationImages(refnode) {
     const eqimgs = refnode.querySelectorAll('img.equation_image');
     eqimgs.forEach(img => {
@@ -354,37 +303,30 @@ const mathImageHelper = {
       }
     });
   },
-
   nearlyInfiniteStyleFix(elem) {
     elem.querySelectorAll('[style*=clip], [style*=vertical-align]').forEach(e => {
       let changed = false;
       let s = e.getAttribute('style');
       const r = e.style.clip;
-
       if (/[\d.]+e\+?\d/.test(r)) {
         // e.g. "rect(1e+07em, -9.999e+06em, -1e+07em, -999.997em)"
         s = s.replace(/clip: rect[^;]+;/, '');
         changed = true;
       }
-
       const v = e.style.verticalAlign;
-
       if (Math.abs(parseFloat(v)) > 10000) {
         // 10000 is a ridiculously large number
         s = s.replace(/vertical-align[^;]+;/, '');
         changed = true;
       }
-
       if (changed) {
         e.setAttribute('style', s);
       }
     });
   }
-
 };
-
 function handleNewMath(event) {
-  if (event !== null && event !== void 0 && event.detail) {
+  if (event?.detail) {
     const {
       features,
       config,
@@ -394,6 +336,5 @@ function handleNewMath(event) {
     mathml.processNewMathInElem(target);
   }
 }
-
 window.addEventListener(Mathml.processNewMathEventName, handleNewMath);
 export { Mathml, mathImageHelper, MathJaxDirective };