@instructure/canvas-rce 5.14.0 → 5.14.2

package/es/rce/plugins/instructure_links/components/LinkSet.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 React, { Component, useRef } from 'react';
 import { bool, func, string } from 'prop-types';
 import { linkShape, linksShape, linkType } from './propTypes';
@@ -27,10 +28,10 @@ import { LoadMoreButton, LoadingIndicator, LoadingStatus, useIncrementalLoading
 import Link from './Link';
 import RCEGlobals from '../../../RCEGlobals';
 import { NoResults } from './NoResults';
+
 /*
  * This is needed only as long as `LinkSet` is a class component.
  */
-
 function IncrementalLoader(props) {
   const {
     children,
@@ -57,17 +58,14 @@ function IncrementalLoader(props) {
     },
     // not actually used in the query, but a required param
     searchString,
-
     onLoadInitial() {
       if (fetchInitialPage) {
         fetchInitialPage();
       }
     },
-
     onLoadMore() {
       fetchNextPage();
     },
-
     records: links
   });
   return children({
@@ -75,41 +73,35 @@ function IncrementalLoader(props) {
     lastItemRef
   });
 }
-
 class LinkSet extends Component {
   constructor(props) {
     super(props);
     this.describedByID = `rce-LinkSet-describedBy-${uid()}`;
     this.loadMoreButtonRef = null;
   }
-
   hasLinks(props) {
     return props.collection.links.length > 0;
   }
-
   isEmpty(props) {
     return !this.hasLinks(props) && !props.collection.hasMore && !props.collection.isLoading;
   }
-
   compareURLs() {
     let url1 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
     let url2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     if (url1 === '' || url2 === '') return false;
     return url1.split('?')[0] === url2.split('?')[0];
   }
-
   renderLinks(lastItemRef) {
     function refFor(index, array) {
       if (!lastItemRef || index !== array.length - 1) {
         return null;
-      } // Return a compatible callback ref for InstUI
-
+      }
 
+      // Return a compatible callback ref for InstUI
       return ref => {
         lastItemRef.current = ref;
       };
     }
-
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ScreenReaderContent, {
       id: this.describedByID
     }, formatMessage('Click to insert a link into the editor.')), /*#__PURE__*/React.createElement(List, {
@@ -118,7 +110,6 @@ class LinkSet extends Component {
       margin: "0"
     }, this.props.collection.links.map((link, index, array) => {
       var _this$props$selectedL;
-
       return /*#__PURE__*/React.createElement(List.Item, {
         key: link.href,
         spacing: "none",
@@ -135,10 +126,8 @@ class LinkSet extends Component {
       }));
     })));
   }
-
   renderEmptyIndicator() {
     var _this$props$searchStr;
-
     return /*#__PURE__*/React.createElement(NoResults, {
       contextType: this.props.contextType,
       contextId: this.props.contextId,
@@ -146,7 +135,6 @@ class LinkSet extends Component {
       isSearchResult: ((_this$props$searchStr = this.props.searchString) === null || _this$props$searchStr === void 0 ? void 0 : _this$props$searchStr.length) >= 3
     });
   }
-
   renderLoadingError() {
     if (this.props.collection.lastError) {
       return /*#__PURE__*/React.createElement("span", {
@@ -154,10 +142,8 @@ class LinkSet extends Component {
         role: "alert"
       }, formatMessage('Loading failed...'));
     }
-
     return null;
   }
-
   render() {
     return /*#__PURE__*/React.createElement(IncrementalLoader, this.props, _ref => {
       let {
@@ -175,9 +161,7 @@ class LinkSet extends Component {
       }));
     });
   }
-
 }
-
 LinkSet.propTypes = {
   type: linkType.isRequired,
   collection: linksShape.isRequired,

package/es/rce/plugins/instructure_links/components/LinksPanel.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 React from 'react';
 import { bool, func, string } from 'prop-types';
 import formatMessage from '../../../../format-message';
@@ -23,7 +24,6 @@ import NavigationPanel from './NavigationPanel';
 import CollectionPanel from './CollectionPanel';
 import { View } from '@instructure/ui-view';
 import { pickProps } from '@instructure/ui-react-utils';
-
 function LinksPanel(props) {
   const isCourse = props.contextType === 'course';
   const isGroup = props.contextType === 'group';
@@ -77,7 +77,6 @@ function LinksPanel(props) {
     onEditClick: props.onEditClick
   }));
 }
-
 LinksPanel.propTypes = {
   selectedAccordionIndex: string,
   onChangeAccordion: func,

package/es/rce/plugins/instructure_links/components/NavigationPanel.js

@@ -15,12 +15,12 @@
  * 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 { bool, func, string } from 'prop-types';
 import React from 'react';
 import LinkSet from './LinkSet';
 import formatMessage from '../../../../format-message';
 import AccordionSection from './AccordionSection';
-
 function typeCollection(contextId, contextType) {
   switch (contextType) {
     case 'course':
@@ -52,21 +52,23 @@ function typeCollection(contextId, contextType) {
         }, {
           href: `/courses/${contextId}/assignments/syllabus`,
           title: formatMessage('Syllabus')
-        }, // outcomes
+        },
+        // outcomes
         {
           href: `/courses/${contextId}/quizzes`,
           title: formatMessage('Quizzes')
         }, {
           href: `/courses/${contextId}/modules`,
           title: formatMessage('Modules')
-        }, // conferences
+        },
+        // conferences
         {
           href: `/courses/${contextId}/collaborations`,
           title: formatMessage('Collaborations')
-        } // settings
+        }
+        // settings
         ]
       };
-
     case 'group':
       return {
         links: [{
@@ -89,7 +91,6 @@ function typeCollection(contextId, contextType) {
           title: formatMessage('People')
         }]
       };
-
     default:
       // user, TODO
       return {
@@ -100,11 +101,9 @@ function typeCollection(contextId, contextType) {
       };
   }
 }
-
 export default function NavigationPanel(props) {
   const collection = typeCollection(props.contextId, props.contextType);
   let navigationSummary = '';
-
   if (props.contextType === 'course') {
     navigationSummary = formatMessage('Course Navigation');
   } else if (props.contextType === 'group') {
@@ -112,7 +111,6 @@ export default function NavigationPanel(props) {
   } else {
     return null;
   }
-
   return /*#__PURE__*/React.createElement("div", {
     "data-testid": "instructure_links-NavigationPanel"
   }, /*#__PURE__*/React.createElement(AccordionSection, {

package/es/rce/plugins/instructure_links/components/NoResults.js

@@ -1,5 +1,4 @@
 import _pt from "prop-types";
-
 /*
  * Copyright (C) 2023 - present Instructure, Inc.
  *
@@ -17,6 +16,7 @@ import _pt from "prop-types";
  * 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 React from 'react';
 import { View } from '@instructure/ui-view';
 import { Flex } from '@instructure/ui-flex';
@@ -26,7 +26,6 @@ import formatMessage from '../../../../format-message';
 import { getIcon } from '../../shared/linkUtils';
 export function buildUrl(contextType, contextId, collectionType) {
   var _typeMap$collectionTy;
-
   const typeMap = {
     wikiPages: 'pages',
     discussions: 'discussion_topics'
@@ -37,19 +36,14 @@ export function getMessage(collectionType, isSearchResult) {
   switch (collectionType) {
     case 'wikiPages':
       return isSearchResult ? formatMessage('No pages found.') : formatMessage('No pages created yet.');
-
     case 'assignments':
       return isSearchResult ? formatMessage('No assignments found.') : formatMessage('No assignments created yet.');
-
     case 'quizzes':
       return isSearchResult ? formatMessage('No quizzes found.') : formatMessage('No quizzes created yet.');
-
     case 'announcements':
       return isSearchResult ? formatMessage('No announcements found.') : formatMessage('No announcements created yet.');
-
     case 'discussions':
       return isSearchResult ? formatMessage('No discussions found.') : formatMessage('No discussions created yet.');
-
     case 'modules':
       return isSearchResult ? formatMessage('No modules found.') : formatMessage('No modules created yet.');
   }

package/es/rce/plugins/instructure_links/plugin.js

@@ -1,5 +1,3 @@
-// @ts-nocheck
-
 /*
  * Copyright (C) 2019 - present Instructure, Inc.
  *
@@ -62,6 +60,7 @@
  *         href with the new URL.  if the link text is updated, replace the link's
  *         content with the new plain text (deleting the image)
  */
+
 import formatMessage from '../../../format-message';
 import clickCallback from './clickCallback';
 import bridge from '../../../bridge';
@@ -72,23 +71,18 @@ import tinymce from 'tinymce';
 const trayController = new LinkOptionsTrayController();
 const COURSE_PLUGIN_KEY = 'course_links';
 const GROUP_PLUGIN_KEY = 'group_links';
-
 function getCommandName(selectedNode) {
   const isCourseLink = selectedNode.getAttribute('data-course-type');
   return isCourseLink ? 'instructureTrayForCourseLinks' : 'instructureTrayToEditLink';
 }
-
 function selectedAnchorCount(ed) {
   return ed.selection.getRng().cloneContents().querySelectorAll('a').length;
 }
-
 function getMenuItems(ed) {
   var _ed$settings$canvas_r;
-
   const contextType = (_ed$settings$canvas_r = ed.settings.canvas_rce_containing_context) === null || _ed$settings$canvas_r === void 0 ? void 0 : _ed$settings$canvas_r.type;
   const sel_anchors = ed.selection.isCollapsed() ? 0 : selectedAnchorCount(ed);
   let items;
-
   if (getAnchorElement(ed, ed.selection.getNode())) {
     // cursor is on an anchor, edit or remove it
     items = [{
@@ -103,7 +97,6 @@ function getMenuItems(ed) {
       text: formatMessage('External Link'),
       value: 'instructureLinkCreate'
     }];
-
     if (contextType === 'course') {
       items.push({
         text: formatMessage('Course Link'),
@@ -115,7 +108,6 @@ function getMenuItems(ed) {
         value: 'instructure_group_links'
       });
     }
-
     if (sel_anchors > 0) {
       // selection contains anchor(s), so the user can remove them
       items.push({
@@ -127,10 +119,8 @@ function getMenuItems(ed) {
       });
     }
   }
-
   return items;
 }
-
 function removeAnchorFromSelectedElement(ed) {
   const selectedElem = ed.selection.getNode();
   const anchorElem = getAnchorElement(ed, selectedElem);
@@ -138,7 +128,6 @@ function removeAnchorFromSelectedElement(ed) {
   ed.undoManager.add();
   ed.execCommand('Unlink');
 }
-
 function doMenuItem(ed, actionName) {
   switch (actionName) {
     case 'instructureTrayToEditLink':
@@ -146,30 +135,23 @@ function doMenuItem(ed, actionName) {
     case 'instructureLinkCreate':
       ed.execCommand(actionName);
       break;
-
     case 'instructureUnlink':
       removeAnchorFromSelectedElement(ed);
       break;
-
     case 'instructureUnlinkAll':
       ed.undoManager.add();
       ed.execCommand('unlink');
       break;
-
     case 'instructure_course_links':
       ed.focus(true); // activate the editor without changing focus
-
       ed.execCommand('instructureTrayForLinks', false, COURSE_PLUGIN_KEY);
       break;
-
     case 'instructure_group_links':
       ed.focus(true); // activate the editor without changing focus
-
       ed.execCommand('instructureTrayForLinks', false, GROUP_PLUGIN_KEY);
       break;
   }
 }
-
 tinymce.PluginManager.add('instructure_links', function (ed) {
   // Register commands
   ed.addCommand('instructureLinkCreate', () => clickCallback(ed, CREATE_LINK));
@@ -183,10 +165,12 @@ tinymce.PluginManager.add('instructure_links', function (ed) {
   ed.addCommand('instructureTrayForCourseLinks', () => {
     ed.selection.select(ed.selection.getNode());
     return bridge.showTrayForPlugin('course_link_edit', ed.id);
-  }); // Register shortcuts
+  });
 
-  ed.addShortcut('Meta+K', '', 'instructureLinkCreate'); // Register menu item
+  // Register shortcuts
+  ed.addShortcut('Meta+K', '', 'instructureLinkCreate');
 
+  // Register menu item
   ed.ui.registry.addNestedMenuItem('instructure_links', {
     text: formatMessage('Link'),
     icon: 'link',
@@ -201,8 +185,9 @@ tinymce.PluginManager.add('instructure_links', function (ed) {
         }
       };
     })
-  }); // Register toolbar button
+  });
 
+  // Register toolbar button
   ed.ui.registry.addMenuButton('instructure_links', {
     tooltip: formatMessage('Links'),
     icon: 'link',
@@ -212,52 +197,45 @@ tinymce.PluginManager.add('instructure_links', function (ed) {
       value: item.value,
       onAction: () => doMenuItem(ed, item.value)
     }))),
-
     onSetup(api) {
+      // @ts-expect-error
       function handleNodeChange(e) {
         if (e !== null && e !== void 0 && e.element) {
           api.setActive(!!getAnchorElement(ed, e.element));
         }
+        if (ed.selection) {
+          api.setDisabled(!isOKToLink(ed.selection.getContent()));
+        }
+      }
 
-        api.setDisabled(!isOKToLink(ed.selection.getContent()));
-      } // if the user selects all the content w/in a link and deletes it via the keyboard
+      // if the user selects all the content w/in a link and deletes it via the keyboard
       // make sure the surrounding <a> gets deleted too.
-
-
       function deleteEmptyLink() {
         let node = null;
-
         if (ed.selection.getNode().tagName === 'A') {
           node = ed.selection.getNode();
         } else {
           var _rng$endContainer$nex, _rng$nextSibling;
-
           // Type checking is disabled here because the code below isn't type safe. The code below
           // should be updated, specifically rng.endContainer.nextSibling?.tagName
           const rng = ed.selection.getRng();
-
           if (rng.commonAncestorContainer === rng.endContainer && ((_rng$endContainer$nex = rng.endContainer.nextSibling) === null || _rng$endContainer$nex === void 0 ? void 0 : _rng$endContainer$nex.tagName) === 'A') {
             node = rng.endContainer.nextSibling;
           } else if (((_rng$nextSibling = rng.nextSibling) === null || _rng$nextSibling === void 0 ? void 0 : _rng$nextSibling.tagName) === 'A') {
             node = rng.nextSibling;
           }
         }
-
         if (node) {
           var _node$textContent;
-
           if (node.firstElementChild) {
             return;
           }
-
           const txt = (_node$textContent = node.textContent) === null || _node$textContent === void 0 ? void 0 : _node$textContent.trim();
-
           if ((txt === null || txt === void 0 ? void 0 : txt.length) === 0) {
             ed.execCommand('Unlink');
           }
         }
       }
-
       setTimeout(handleNodeChange, 0, null);
       ed.on('NodeChange', handleNodeChange);
       ed.on('Change', deleteEmptyLink);
@@ -266,14 +244,14 @@ tinymce.PluginManager.add('instructure_links', function (ed) {
         ed.off('Change', deleteEmptyLink);
       };
     }
+  });
 
-  }); // the context toolbar buttons
-
+  // the context toolbar buttons
   ed.ui.registry.addButton('instructure-link-options', {
-    onAction() {
+    onAction(/* buttonApi */
+    ) {
       ed.execCommand(getCommandName(ed.selection.getNode()), false, ed);
     },
-
     text: formatMessage('Link Options'),
     tooltip: formatMessage('Show link options')
   });
@@ -282,7 +260,6 @@ tinymce.PluginManager.add('instructure_links', function (ed) {
     onAction() {
       removeAnchorFromSelectedElement(ed);
     },
-
     text: remButtonLabel
   });
   ed.ui.registry.addContextToolbar('instructure-link-toolbar', {

package/es/rce/plugins/instructure_links/validateURL.js

@@ -15,56 +15,101 @@
  * 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 { parse } from 'url';
-import formatMessage from '../../../format-message'; // keep in sync with the protocols permitted for <a href>
-// as listed in gems/canvas_sanitize/lib/canvas_sanitize/canvas_sanitize.rb
 
-const allowed_protocols = ['ftp:', 'http:', 'https:', 'mailto:', 'tel:', 'skype:']; // weakly validate a url
-// return true if valid
-// return false if not valid yet, but incomplete
-// throw an Error if invalid
+import formatMessage from '../../../format-message';
 
+// Keep in sync with the protocols permitted for <a href>
+//   as listed in gems/canvas_sanitize/lib/canvas_sanitize/canvas_sanitize.rb
+const allowed_protocols = ['ftp:', 'http:', 'https:', 'mailto:', 'tel:', 'skype:'];
+
+/**
+ * Weakly validate a URL
+ * @param {string} url URL to validate
+ * @returns {boolean} true if valid, false if not valid yet, but incomplete, throws if invalid
+ */
 export default function validateURL(url) {
   const href = url.trim();
-  const parsed = parse(href, false, true);
-  const protocol = parsed.protocol;
 
-  if (!protocol) {
-    if (parsed.href[0] === ':') {
-      // ":anything" is invalid
-      // need this check as an artifact of parse(href)
+  // Handle special cases for partial URLs
+  if (href === '' || href === 'mailto:' || href === 'tel:' || href === 'skype:') {
+    return false;
+  }
+  if (/^\/\/$/.test(href)) {
+    return false;
+  }
+  try {
+    // Handle URLs starting with :// (invalid protocol)
+    if (href.startsWith('://')) {
       throw new Error(formatMessage('Protocol must be ftp, http, https, mailto, skype, tel or may be omitted'));
     }
 
-    if (/^\/\/$/.test(href)) {
-      // "//" by itself is not a URL yet
-      return false;
-    }
-  } else if (protocol) {
-    if (!allowed_protocols.includes(protocol)) {
-      throw new Error(formatMessage('{p} is not a valid protocol which must be ftp, http, https, mailto, skype, tel or may be omitted', {
-        p: protocol.replace(/:$/, '')
-      }));
-    } // ftp, http, https require ://anything
-
+    // For URLs with protocols, we can use the URL constructor directly
+    if (/^[a-zA-Z][a-zA-Z\d+.-]*:/.test(href)) {
+      const protocol = href.substring(0, href.indexOf(':') + 1);
+      if (!allowed_protocols.includes(protocol)) {
+        throw new Error(formatMessage('{p} is not a valid protocol.', {
+          p: protocol.slice(0, -1)
+        }));
+      }
 
-    if (/(?:ftp|http|https):\/\/.+/.test(href)) {
-      return true;
-    } // allow mailto:address, skype:participant, tel:911 or
-    // mailto://address, skype://participant, tel://911,
+      // For absolute URLs with protocols that require //, validate the format
+      if (['http:', 'https:', 'ftp:'].includes(protocol) && !href.startsWith(protocol + '//')) {
+        throw new Error(formatMessage('Invalid URL'));
+      }
 
+      // Special handling for mailto:, tel:, and skype: URLs
+      if (['mailto:', 'tel:', 'skype:'].includes(protocol)) {
+        // Consider protocol:// as incomplete for these protocols
+        if (href === protocol + '//' || href === protocol + '///') {
+          return false;
+        }
+        return href.length > protocol.length;
+      }
 
-    if (/(?:mailto|skype|tel):(\/\/)?[^/].*/.test(href)) {
-      return true;
-    } // http:/xyzzy is invalid
+      // Handle partial URLs
+      if (href === protocol || href === protocol + '/' || href === protocol + '//') {
+        return false;
+      }
 
+      // Try constructing the URL to validate the format
+      try {
+        if (href.includes('//')) {
+          new URL(href);
+        }
+        return true;
+      } catch {
+        // If URL construction fails but we have more than just protocol://, consider it valid
+        // This allows for test URLs like ftp://host:port/path
+        return href.length > protocol.length + 2;
+      }
+    }
 
-    if (/^(?:ftp|http|https):\/{0,1}[^/]/.test(href)) {
-      throw new Error(formatMessage('Invalid URL'));
+    // Handle protocol-relative URLs
+    if (href.startsWith('//')) {
+      if (href === '//' || href === '///') {
+        return false;
+      }
+      try {
+        new URL('http:' + href);
+        return true;
+      } catch {
+        // If URL construction fails but we have more than just //, consider it valid
+        return href.length > 2;
+      }
     }
 
-    return false;
+    // Handle relative paths
+    return true;
+  } catch (e) {
+    if (e instanceof Error) {
+      if (e.message.includes('Invalid URL')) {
+        if (href.match(/^(https?|ftp):\/?\/?$/)) {
+          return false;
+        }
+        throw new Error(formatMessage('Invalid URL'));
+      }
+      throw e;
+    }
+    throw e;
   }
-
-  return true;
 }

package/es/rce/plugins/instructure_media_embed/clickCallback.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 React from 'react';
 import ReactDOM from 'react-dom';
 import Bridge from '../../../bridge';
@@ -24,23 +25,19 @@ export default function (ed, document) {
       Embed
     } = _ref;
     let container = document.querySelector('.canvas-rce-embed-container');
-
     if (!container) {
       container = document.createElement('div');
       container.className = 'canvas-rce-embed-container';
       document.body.appendChild(container);
     }
-
     const handleDismiss = () => {
       ReactDOM.unmountComponentAtNode(container);
       ed.focus(false);
     };
-
     const handleEmbedCode = embedCode => {
       Bridge.insertEmbedCode(embedCode);
     };
-
-    ReactDOM.render( /*#__PURE__*/React.createElement(Embed, {
+    ReactDOM.render(/*#__PURE__*/React.createElement(Embed, {
       onSubmit: handleEmbedCode,
       onDismiss: handleDismiss
     }), container);

package/es/rce/plugins/instructure_media_embed/components/Embed.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 React, { useState } from 'react';
 import { Modal } from '@instructure/ui-modal';
 import formatMessage from '../../../../format-message';

package/es/rce/plugins/instructure_media_embed/plugin.js

@@ -15,19 +15,23 @@
  * 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 clickCallback from './clickCallback';
 import formatMessage from '../../../format-message';
-import tinymce from 'tinymce'; // Register plugin
+import tinymce from 'tinymce';
 
+// Register plugin
 tinymce.PluginManager.add('instructure_media_embed', function (ed) {
-  ed.addCommand('instructureMediaEmbed', () => clickCallback(ed, document)); // Register menu item
+  ed.addCommand('instructureMediaEmbed', () => clickCallback(ed, document));
 
+  // Register menu item
   ed.ui.registry.addMenuItem('instructure_media_embed', {
     text: formatMessage('Embed'),
     icon: 'embed',
     onAction: () => ed.execCommand('instructureMediaEmbed')
-  }); // Register toolbar button
+  });
 
+  // Register toolbar button
   ed.ui.registry.addButton('instructure_media_embed', {
     tooltip: formatMessage('Embed'),
     icon: 'embed',