@instructure/canvas-rce 5.15.7 → 7.0.0

package/CHANGELOG.md

@@ -5,6 +5,49 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## 7.0.0 - 2025-03-31
+
+### Fixed
+
+- Screen readers for RCE toolbar on mobile platform
+- Axios CSRF vulnerability
+- Mailto link insertion 
+
+### Changed
+
+- Upgraded Instui to v10
+- Refactored deprecated plugins to prepare for tinymce upgrade
+- Removed media_links_use_attachment_id feature flag
+
+## 6.0.0 - 2025-03-20
+
+### Changed
+
+- Upgraded to Node 20 LTS
+
+### Fixed
+
+- Redirect focus on invalid save in Image Options tray
+- Whitelist the aria-description attribute
+- Flag external links when they have multi-part TLDs
+- Save changes to alt text when it is the only thing that changes
+- Screenreader reads out content inside raw HTML editor
+- Validations in Upload Media modal
+- Increased Link header size
+
+## 5.15.8 - 2025-02-20
+
+### Fixed
+
+- Fixed invalid `querySelectorAll` selector (`:not(.not_external, .external)`)
+  that caused errors in older Chrome versions (87 and below). Updated to
+  `:not(.not_external):not(.external)` for improved browser compatibility
+- Improved external link handling logic in canvas-rce
+
+### Added
+
+- Jest test to ensure the fix does not introduce regressions
+
 ## 5.15.0 - 2025-02-12
 
 - Lazy load iframe and images by default

package/Dockerfile

@@ -1,4 +1,4 @@
-FROM instructure/node:18
+FROM instructure/node:20
 
 ARG NPM_PRIVATE_SCOPE
 ARG NPM_PRIVATE_REGISTRY

package/es/bridge/Bridge.d.ts

@@ -31,6 +31,9 @@ export default class Bridge {
             ADDED_CAPTION: string;
             DELETED_CAPTION: string;
             PROGRESS_LABEL: string;
+            SELECT_SUPPORTED_FILE_TYPE: string;
+            CHOOSE_FILE_TO_UPLOAD: string;
+            ENTER_FILE_NAME: string;
         };
         SelectStrings: {
             USE_ARROWS: string;
@@ -113,6 +116,9 @@ export default class Bridge {
             ADDED_CAPTION: string;
             DELETED_CAPTION: string;
             PROGRESS_LABEL: string;
+            SELECT_SUPPORTED_FILE_TYPE: string;
+            CHOOSE_FILE_TO_UPLOAD: string;
+            ENTER_FILE_NAME: string;
         };
         SelectStrings: {
             USE_ARROWS: string;

package/es/common/browser.js

@@ -31,8 +31,8 @@ export function reset() {
   });
 }
 export function set(env) {
-  isIE = !!env.ie;
-  isEdge = isIE && !!(env.edge || env.ie == 12);
+  isIE = env.browser.isIE();
+  isEdge = env.browser.isEdge();
 }
 export function ie() {
   return isIE;

package/es/common/fileUrl.js

@@ -21,18 +21,28 @@
 // in mocha tests.
 
 import RCEGlobals from '../rce/RCEGlobals';
+const CONTACT_PROTOCOLS = ['mailto:', 'tel:', 'skype:'];
+function parseUrl(url, canvasOrigin = window.location.origin) {
+  try {
+    // If the URL is already absolute, use it as-is
+    return new URL(url);
+  } catch {
+    return new URL(`${canvasOrigin}${url.startsWith('/') ? '' : '/'}${url}`);
+  }
+}
 function parseCanvasUrl(url, canvasOrigin = window.location.origin) {
   if (!url) {
     return null;
   }
   try {
-    // For absolute URLs
-    const fullUrl = url.startsWith('http') ? url : `${canvasOrigin}${url.startsWith('/') ? '' : '/'}${url}`;
-    const parsed = new URL(fullUrl);
+    const parsed = parseUrl(url, canvasOrigin);
     const canvasUrl = new URL(canvasOrigin);
     if (parsed.host && canvasUrl.host !== parsed.host) {
       return null;
     }
+    if (CONTACT_PROTOCOLS.includes(parsed.protocol)) {
+      return null;
+    }
 
     // Convert URLSearchParams to query object
     const query = {};

package/es/defaultTinymceConfig.js

@@ -16,6 +16,23 @@
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
 
+function elemsToTinyStringConfig(list) {
+  return Object.entries(list).map(pair => {
+    const [tag, attrs] = pair;
+    if (attrs.length === 0) {
+      return tag;
+    } else {
+      const attrStr = attrs.map(attr => {
+        if (typeof attr === 'string') {
+          return attr;
+        } else if (typeof attr === 'object') {
+          return Object.entries(attr).map(([key, value]) => `${key}=${value}`);
+        }
+      }).join('|');
+      return `${tag}[${attrStr}]`;
+    }
+  }).join();
+}
 const defaultTinymceConfig = {
   // ============================================================================
   // Values in this section have acceptable defaults which you may want
@@ -73,10 +90,154 @@ const defaultTinymceConfig = {
   // then edited.
   //
   // this list needs to be kept in sync with the list in gems/canvas_sanitize/lib/canvas_sanitize/canvas_sanitize.rb
-  valid_elements: '@[id|class|style|title|dir<ltr?rtl|lang|xml::lang|role],a[rel|rev|charset|hreflang|tabindex|accesskey|type|name|href|target|title|class|data-old-link],strong/b,em/i,strike/s,u,#p,-ol[type|compact],-ul[type|compact],-li,br,img[longdesc|usemap|src|border|alt|title|hspace|vspace|width|height|align|role|data-old-link],-sub,-sup,-blockquote[cite],-table[border=0|cellspacing|cellpadding|width|frame|rules|height|align|summary|bgcolor|background|bordercolor],-tr[rowspan|width|height|align|valign|bgcolor|background|bordercolor],tbody,thead,tfoot,#td[colspan|rowspan|width|height|align|valign|bgcolor|background|bordercolor|scope],#th[colspan|rowspan|width|height|align|valign|scope],caption,-div,-span,-code,-pre,address,-h1,-h2,-h3,-h4,-h5,-h6,hr[size|noshade],-font[face|size|color],dd,dl,dt,cite,abbr,acronym,del[datetime|cite],ins[datetime|cite],object[classid|width|height|codebase|*],param[name|value|_value],embed[type|width|height|src|*],map[name],area[shape|coords|href|alt|target],bdo,col[align|char|charoff|span|valign|width],colgroup[align|char|charoff|span|valign|width],dfn,kbd,q[cite],samp,small,tt,var,big,figure,figcaption,source[media|width|height|sizes|src|srcset|type|data-old-link],track,mark,article,aside,details,footer,header,nav,section,summary,time',
-  extended_valid_elements: '@[id|accesskey|class|dir|lang|style|tabindex|title|contenteditable|contextmenu|draggable|dropzone|hidden|longdesc|spellcheck|translate|align|role|aria-labelledby|aria-atomic|aria-busy|aria-controls|aria-describedby|aria-disabled|aria-dropeffect|aria-flowto|aria-grabbed|aria-haspopup|aria-hidden|aria-invalid|aria-label|aria-labelledby|aria-live|aria-owns|aria-relevant|aria-autocomplete|aria-checked|aria-disabled|aria-expanded|aria-haspopup|aria-hidden|aria-invalid|aria-label|aria-level|aria-multiline|aria-multiselectable|aria-orientation|aria-pressed|aria-readonly|aria-required|aria-selected|aria-sort|aria-valuemax|aria-valuemin|aria-valuenow|aria-valuetext],iframe[id|data-media-type|title|src|width|height|name|align|style|class|sandbox|loading|allowfullscreen|webkitallowfullscreen|mozallowfullscreen|allow|data-old-link],i[iclass],a[hidden|href|target|rel|media|hreflang|type|charset|name|rev|shape|coords|download|alt],#p,li[value],-ol[reversed|start|type|compact],pre[width],table[border|summary|width|frame|rules|cellspacing|cellpadding|bgcolor],tbody[char|charoff|valign],td[colspan|rowspan|headers|abbr|axis|scope|align|char|charoff|valign|nowrap|bgcolor|width|height],tfoot[char|charoff|valign],th[colspan|rowspan|headers|scope|abbr|axis|align|char|charoff|valign|nowrap|bgcolor|width|height],thead[char|charoff|valign],tr[char|charoff|valign|bgcolor],-ul[compact],video[name|src|allowfullscreen|muted|poster|width|height|controls|playsinline],audio[name|src|muted|controls],annotation[href|xref|definitionURL|encoding|cd|name|src],annotation-xml[href|xref|definitionURL|encoding|cd|name|src],maction[href|xref|mathcolor|mathbackground|actiontype|selection],maligngroup[href|xref|mathcolor|mathbackground|groupalign],malignmark[href|xref|mathcolor|mathbackground|edge],math[xmlns|href|xref|display|maxwidth|overflow|altimg|altimg-width|altimg-height|altimg-valign|alttext|cdgroup|mathcolor|mathbackground|scriptlevel|displaystyle|scriptsizemultiplier|scriptminsize|infixlinebreakstyle|decimalpoint|mathvariant|mathsize|width|height|valign|form|fence|separator|lspace|rspace|stretchy|symmetric|maxsize|minsize|largeop|movablelimits|accent|linebreak|lineleading|linebreakstyle|linebreakmultchar|indentalign|indentshift|indenttarget|indentalignfirst|indentshiftfirst|indentalignlast|indentshiftlast|depth|lquote|rquote|linethickness|munalign|denomalign|bevelled|voffset|open|close|separators|notation|subscriptshift|superscriptshift|accentunder|align|rowalign|columnalign|groupalign|alignmentscope|columnwidth|rowspacing|columnspacing|rowlines|columnlines|frame|framespacing|equalrows|equalcolumns|side|minlabelspacing|rowspan|columnspan|edge|stackalign|charalign|charspacing|longdivstyle|position|shift|location|crossout|length|leftoverhang|rightoverhang|mslinethickness|selection],menclose[href|xref|mathcolor|mathbackground|notation],merror[href|xref|mathcolor|mathbackground],mfenced[href|xref|mathcolor|mathbackground|open|close|separators],mfrac[href|xref|mathcolor|mathbackground|linethickness|munalign|denomalign|bevelled],mglyph[href|xref|mathcolor|mathbackground|src|alt|width|height|valign],mi[href|xref|mathcolor|mathbackground|mathvariant|mathsize],mlabeledtr[href|xref|mathcolor|mathbackground],mlongdiv[href|xref|mathcolor|mathbackground|longdivstyle|align|stackalign|charalign|charspacing],mmultiscripts[href|xref|mathcolor|mathbackground|subscriptshift|superscriptshift],mn[href|xref|mathcolor|mathbackground|mathvariant|mathsize],mo[href|xref|mathcolor|mathbackground|mathvariant|mathsize|form|fence|separator|lspace|rspace|stretchy|symmetric|maxsize|minsize|largeop|movablelimits|accent|linebreak|lineleading|linebreakstyle|linebreakmultchar|indentalign|indentshift|indenttarget|indentalignfirst|indentshiftfirst|indentalignlast|indentshiftlast],mover[href|xref|mathcolor|mathbackground|accent|align],mpadded[href|xref|mathcolor|mathbackground|height|depth|width|lspace|voffset],mphantom[href|xref|mathcolor|mathbackground],mprescripts[href|xref|mathcolor|mathbackground],mroot[href|xref|mathcolor|mathbackground],mrow[href|xref|mathcolor|mathbackground],ms[href|xref|mathcolor|mathbackground|mathvariant|mathsize|lquote|rquote],mscarries[href|xref|mathcolor|mathbackground|position|location|crossout|scriptsizemultiplier],mscarry[href|xref|mathcolor|mathbackground|location|crossout],msgroup[href|xref|mathcolor|mathbackground|position|shift],msline[href|xref|mathcolor|mathbackground|position|length|leftoverhang|rightoverhang|mslinethickness],mspace[href|xref|mathcolor|mathbackground|mathvariant|mathsize],msqrt[href|xref|mathcolor|mathbackground],msrow[href|xref|mathcolor|mathbackground|position],mstack[href|xref|mathcolor|mathbackground|align|stackalign|charalign|charspacing],mstyle[href|xref|mathcolor|mathbackground|scriptlevel|displaystyle|scriptsizemultiplier|scriptminsize|infixlinebreakstyle|decimalpoint|mathvariant|mathsize|width|height|valign|form|fence|separator|lspace|rspace|stretchy|symmetric|maxsize|minsize|largeop|movablelimits|accent|linebreak|lineleading|linebreakstyle|linebreakmultchar|indentalign|indentshift|indenttarget|indentalignfirst|indentshiftfirst|indentalignlast|indentshiftlast|depth|lquote|rquote|linethickness|munalign|denomalign|bevelled|voffset|open|close|separators|notation|subscriptshift|superscriptshift|accentunder|align|rowalign|columnalign|groupalign|alignmentscope|columnwidth|rowspacing|columnspacing|rowlines|columnlines|frame|framespacing|equalrows|equalcolumns|side|minlabelspacing|rowspan|columnspan|edge|stackalign|charalign|charspacing|longdivstyle|position|shift|location|crossout|length|leftoverhang|rightoverhang|mslinethickness|selection],msub[href|xref|mathcolor|mathbackground|subscriptshift],msubsup[href|xref|mathcolor|mathbackground|subscriptshift|superscriptshift],msup[href|xref|mathcolor|mathbackground|superscriptshift],mtable[href|xref|mathcolor|mathbackground|align|rowalign|columnalign|groupalign|alignmentscope|columnwidth|width|rowspacing|columnspacing|rowlines|columnlines|frame|framespacing|equalrows|equalcolumns|displaystyle|side|minlabelspacing],mtd[href|xref|mathcolor|mathbackground|rowspan|columnspan|rowalign|columnalign|groupalign],mtext[href|xref|mathcolor|mathbackground|mathvariant|mathsize|width|height|depth|linebreak],mtr[href|xref|mathcolor|mathbackground|rowalign|columnalign|groupalign],munder[href|xref|mathcolor|mathbackground|accentunder|align],munderover[href|xref|mathcolor|mathbackground|accent|accentunder|align],none[href|xref|mathcolor|mathbackground],semantics[href|xref|definitionURL|encoding],picture,ruby,rp,rt,wbr' +
-  // the svg necessary for the uploading placeholder's spinner
-  'svg[*],g[*],circle[*]',
+  valid_elements: elemsToTinyStringConfig({
+    '@': ['id', 'class', 'style', 'title', 'dir<ltr?rtl', 'lang', 'xml::lang', 'role'],
+    'a': ['rel', 'rev', 'charset', 'hreflang', 'tabindex', 'accesskey', 'type', 'name', 'href', 'target', 'title', 'class', 'data-old-link'],
+    'strong/b': [],
+    'em/i': [],
+    'strike/s': [],
+    'u': [],
+    '#p': [],
+    '-ol': ['type', 'compact'],
+    '-ul': ['type', 'compact'],
+    '-li': [],
+    'br': [],
+    'img': ['longdesc', 'usemap', 'src', 'border', 'alt', 'title', 'hspace', 'vspace', 'width', 'height', 'align', 'role', 'data-old-link'],
+    '-sub': [],
+    '-sup': [],
+    '-blockquote': ['cite'],
+    '-table': [{
+      'border': '0'
+    }, 'cellspacing', 'cellpadding', 'width', 'frame', 'rules', 'height', 'align', 'summary', 'bgcolor', 'background', 'bordercolor'],
+    '-tr': ['rowspan', 'width', 'height', 'align', 'valign', 'bgcolor', 'background', 'bordercolor'],
+    'tbody': [],
+    'thead': [],
+    'tfoot': [],
+    '#td': ['colspan', 'rowspan', 'width', 'height', 'align', 'valign', 'bgcolor', 'background', 'bordercolor', 'scope'],
+    '#th': ['colspan', 'rowspan', 'width', 'height', 'align', 'valign', 'scope'],
+    'caption': [],
+    '-div': [],
+    '-span': [],
+    '-code': [],
+    '-pre': [],
+    'address': [],
+    '-h1': [],
+    '-h2': [],
+    '-h3': [],
+    '-h4': [],
+    '-h5': [],
+    '-h6': [],
+    'hr': ['size', 'noshade'],
+    '-font': ['face', 'size', 'color'],
+    'dd': [],
+    'dl': [],
+    'dt': [],
+    'cite': [],
+    'abbr': [],
+    'acronym': [],
+    'del': ['datetime', 'cite'],
+    'ins': ['datetime', 'cite'],
+    'object': ['classid', 'width', 'height', 'codebase', '*'],
+    'param': ['name', 'value', '_value'],
+    'embed': ['type', 'width', 'height', 'src', '*'],
+    'map': ['name'],
+    'area': ['shape', 'coords', 'href', 'alt', 'target'],
+    'bdo': [],
+    'col': ['align', 'char', 'charoff', 'span', 'valign', 'width'],
+    'colgroup': ['align', 'char', 'charoff', 'span', 'valign', 'width'],
+    'dfn': [],
+    'kbd': [],
+    'q': ['cite'],
+    'samp': [],
+    'small': [],
+    'tt': [],
+    'var': [],
+    'big': [],
+    'figure': [],
+    'figcaption': [],
+    'source': ['media', 'width', 'height', 'sizes', 'src', 'srcset', 'type', 'data-old-link'],
+    'track': [],
+    'mark': [],
+    'article': [],
+    'aside': [],
+    'details': [],
+    'footer': [],
+    'header': [],
+    'nav': [],
+    'section': [],
+    'summary': [],
+    'time': []
+  }),
+  extended_valid_elements: elemsToTinyStringConfig({
+    '@': ['id', 'accesskey', 'class', 'dir', 'lang', 'style', 'tabindex', 'title', 'contenteditable', 'contextmenu', 'draggable', 'dropzone', 'hidden', 'longdesc', 'spellcheck', 'translate', 'align', 'role', 'aria-labelledby', 'aria-atomic', 'aria-busy', 'aria-controls', 'aria-describedby', 'aria-description', 'aria-disabled', 'aria-dropeffect', 'aria-flowto', 'aria-grabbed', 'aria-haspopup', 'aria-hidden', 'aria-invalid', 'aria-label', 'aria-labelledby', 'aria-live', 'aria-owns', 'aria-relevant', 'aria-autocomplete', 'aria-checked', 'aria-disabled', 'aria-expanded', 'aria-haspopup', 'aria-hidden', 'aria-invalid', 'aria-label', 'aria-level', 'aria-multiline', 'aria-multiselectable', 'aria-orientation', 'aria-pressed', 'aria-readonly', 'aria-required', 'aria-selected', 'aria-sort', 'aria-valuemax', 'aria-valuemin', 'aria-valuenow', 'aria-valuetext'],
+    'iframe': ['id', 'data-media-type', 'title', 'src', 'width', 'height', 'name', 'align', 'style', 'class', 'sandbox', 'loading', 'allowfullscreen', 'webkitallowfullscreen', 'mozallowfullscreen', 'allow', 'data-old-link'],
+    'i': ['iclass'],
+    'a': ['hidden', 'href', 'target', 'rel', 'media', 'hreflang', 'type', 'charset', 'name', 'rev', 'shape', 'coords', 'download', 'alt'],
+    '#p': [],
+    'li': ['value'],
+    '-ol': ['reversed', 'start', 'type', 'compact'],
+    'pre': ['width'],
+    'table': ['border', 'summary', 'width', 'frame', 'rules', 'cellspacing', 'cellpadding', 'bgcolor'],
+    'tbody': ['char', 'charoff', 'valign'],
+    'td': ['colspan', 'rowspan', 'headers', 'abbr', 'axis', 'scope', 'align', 'char', 'charoff', 'valign', 'nowrap', 'bgcolor', 'width', 'height'],
+    'tfoot': ['char', 'charoff', 'valign'],
+    'th': ['colspan', 'rowspan', 'headers', 'scope', 'abbr', 'axis', 'align', 'char', 'charoff', 'valign', 'nowrap', 'bgcolor', 'width', 'height'],
+    'thead': ['char', 'charoff', 'valign'],
+    'tr': ['char', 'charoff', 'valign', 'bgcolor'],
+    '-ul': ['compact'],
+    'video': ['name', 'src', 'allowfullscreen', 'muted', 'poster', 'width', 'height', 'controls', 'playsinline'],
+    'audio': ['name', 'src', 'muted', 'controls'],
+    'annotation': ['href', 'xref', 'definitionURL', 'encoding', 'cd', 'name', 'src'],
+    'annotation-xml': ['href', 'xref', 'definitionURL', 'encoding', 'cd', 'name', 'src'],
+    'maction': ['href', 'xref', 'mathcolor', 'mathbackground', 'actiontype', 'selection'],
+    'maligngroup': ['href', 'xref', 'mathcolor', 'mathbackground', 'groupalign'],
+    'malignmark': ['href', 'xref', 'mathcolor', 'mathbackground', 'edge'],
+    'math': ['xmlns', 'href', 'xref', 'display', 'maxwidth', 'overflow', 'altimg', 'altimg-width', 'altimg-height', 'altimg-valign', 'alttext', 'cdgroup', 'mathcolor', 'mathbackground', 'scriptlevel', 'displaystyle', 'scriptsizemultiplier', 'scriptminsize', 'infixlinebreakstyle', 'decimalpoint', 'mathvariant', 'mathsize', 'width', 'height', 'valign', 'form', 'fence', 'separator', 'lspace', 'rspace', 'stretchy', 'symmetric', 'maxsize', 'minsize', 'largeop', 'movablelimits', 'accent', 'linebreak', 'lineleading', 'linebreakstyle', 'linebreakmultchar', 'indentalign', 'indentshift', 'indenttarget', 'indentalignfirst', 'indentshiftfirst', 'indentalignlast', 'indentshiftlast', 'depth', 'lquote', 'rquote', 'linethickness', 'munalign', 'denomalign', 'bevelled', 'voffset', 'open', 'close', 'separators', 'notation', 'subscriptshift', 'superscriptshift', 'accentunder', 'align', 'rowalign', 'columnalign', 'groupalign', 'alignmentscope', 'columnwidth', 'rowspacing', 'columnspacing', 'rowlines', 'columnlines', 'frame', 'framespacing', 'equalrows', 'equalcolumns', 'side', 'minlabelspacing', 'rowspan', 'columnspan', 'edge', 'stackalign', 'charalign', 'charspacing', 'longdivstyle', 'position', 'shift', 'location', 'crossout', 'length', 'leftoverhang', 'rightoverhang', 'mslinethickness', 'selection'],
+    'menclose': ['href', 'xref', 'mathcolor', 'mathbackground', 'notation'],
+    'merror': ['href', 'xref', 'mathcolor', 'mathbackground'],
+    'mfenced': ['href', 'xref', 'mathcolor', 'mathbackground', 'open', 'close', 'separators'],
+    'mfrac': ['href', 'xref', 'mathcolor', 'mathbackground', 'linethickness', 'munalign', 'denomalign', 'bevelled'],
+    'mglyph': ['href', 'xref', 'mathcolor', 'mathbackground', 'src', 'alt', 'width', 'height', 'valign'],
+    'mi': ['href', 'xref', 'mathcolor', 'mathbackground', 'mathvariant', 'mathsize'],
+    'mlabeledtr': ['href', 'xref', 'mathcolor', 'mathbackground'],
+    'mlongdiv': ['href', 'xref', 'mathcolor', 'mathbackground', 'longdivstyle', 'align', 'stackalign', 'charalign', 'charspacing'],
+    'mmultiscripts': ['href', 'xref', 'mathcolor', 'mathbackground', 'subscriptshift', 'superscriptshift'],
+    'mn': ['href', 'xref', 'mathcolor', 'mathbackground', 'mathvariant', 'mathsize'],
+    'mo': ['href', 'xref', 'mathcolor', 'mathbackground', 'mathvariant', 'mathsize', 'form', 'fence', 'separator', 'lspace', 'rspace', 'stretchy', 'symmetric', 'maxsize', 'minsize', 'largeop', 'movablelimits', 'accent', 'linebreak', 'lineleading', 'linebreakstyle', 'linebreakmultchar', 'indentalign', 'indentshift', 'indenttarget', 'indentalignfirst', 'indentshiftfirst', 'indentalignlast', 'indentshiftlast'],
+    'mover': ['href', 'xref', 'mathcolor', 'mathbackground', 'accent', 'align'],
+    'mpadded': ['href', 'xref', 'mathcolor', 'mathbackground', 'height', 'depth', 'width', 'lspace', 'voffset'],
+    'mphantom': ['href', 'xref', 'mathcolor', 'mathbackground'],
+    'mprescripts': ['href', 'xref', 'mathcolor', 'mathbackground'],
+    'mroot': ['href', 'xref', 'mathcolor', 'mathbackground'],
+    'mrow': ['href', 'xref', 'mathcolor', 'mathbackground'],
+    'ms': ['href', 'xref', 'mathcolor', 'mathbackground', 'mathvariant', 'mathsize', 'lquote', 'rquote'],
+    'mscarries': ['href', 'xref', 'mathcolor', 'mathbackground', 'position', 'location', 'crossout', 'scriptsizemultiplier'],
+    'mscarry': ['href', 'xref', 'mathcolor', 'mathbackground', 'location', 'crossout'],
+    'msgroup': ['href', 'xref', 'mathcolor', 'mathbackground', 'position', 'shift'],
+    'msline': ['href', 'xref', 'mathcolor', 'mathbackground', 'position', 'length', 'leftoverhang', 'rightoverhang', 'mslinethickness'],
+    'mspace': ['href', 'xref', 'mathcolor', 'mathbackground', 'mathvariant', 'mathsize'],
+    'msqrt': ['href', 'xref', 'mathcolor', 'mathbackground'],
+    'msrow': ['href', 'xref', 'mathcolor', 'mathbackground', 'position'],
+    'mstack': ['href', 'xref', 'mathcolor', 'mathbackground', 'align', 'stackalign', 'charalign', 'charspacing'],
+    'mstyle': ['href', 'xref', 'mathcolor', 'mathbackground', 'scriptlevel', 'displaystyle', 'scriptsizemultiplier', 'scriptminsize', 'infixlinebreakstyle', 'decimalpoint', 'mathvariant', 'mathsize', 'width', 'height', 'valign', 'form', 'fence', 'separator', 'lspace', 'rspace', 'stretchy', 'symmetric', 'maxsize', 'minsize', 'largeop', 'movablelimits', 'accent', 'linebreak', 'lineleading', 'linebreakstyle', 'linebreakmultchar', 'indentalign', 'indentshift', 'indenttarget', 'indentalignfirst', 'indentshiftfirst', 'indentalignlast', 'indentshiftlast', 'depth', 'lquote', 'rquote', 'linethickness', 'munalign', 'denomalign', 'bevelled', 'voffset', 'open', 'close', 'separators', 'notation', 'subscriptshift', 'superscriptshift', 'accentunder', 'align', 'rowalign', 'columnalign', 'groupalign', 'alignmentscope', 'columnwidth', 'rowspacing', 'columnspacing', 'rowlines', 'columnlines', 'frame', 'framespacing', 'equalrows', 'equalcolumns', 'side', 'minlabelspacing', 'rowspan', 'columnspan', 'edge', 'stackalign', 'charalign', 'charspacing', 'longdivstyle', 'position', 'shift', 'location', 'crossout', 'length', 'leftoverhang', 'rightoverhang', 'mslinethickness', 'selection'],
+    'msub': ['href', 'xref', 'mathcolor', 'mathbackground', 'subscriptshift'],
+    'msubsup': ['href', 'xref', 'mathcolor', 'mathbackground', 'subscriptshift', 'superscriptshift'],
+    'msup': ['href', 'xref', 'mathcolor', 'mathbackground', 'superscriptshift'],
+    'mtable': ['href', 'xref', 'mathcolor', 'mathbackground', 'align', 'rowalign', 'columnalign', 'groupalign', 'alignmentscope', 'columnwidth', 'width', 'rowspacing', 'columnspacing', 'rowlines', 'columnlines', 'frame', 'framespacing', 'equalrows', 'equalcolumns', 'displaystyle', 'side', 'minlabelspacing'],
+    'mtd': ['href', 'xref', 'mathcolor', 'mathbackground', 'rowspan', 'columnspan', 'rowalign', 'columnalign', 'groupalign'],
+    'mtext': ['href', 'xref', 'mathcolor', 'mathbackground', 'mathvariant', 'mathsize', 'width', 'height', 'depth', 'linebreak'],
+    'mtr': ['href', 'xref', 'mathcolor', 'mathbackground', 'rowalign', 'columnalign', 'groupalign'],
+    'munder': ['href', 'xref', 'mathcolor', 'mathbackground', 'accentunder', 'align'],
+    'munderover': ['href', 'xref', 'mathcolor', 'mathbackground', 'accent', 'accentunder', 'align'],
+    'none': ['href', 'xref', 'mathcolor', 'mathbackground'],
+    'semantics': ['href', 'xref', 'definitionURL', 'encoding'],
+    'picture': [],
+    'ruby': [],
+    'rp': [],
+    'rt': [],
+    'g': ['*'],
+    'circle': ['*']
+  }),
   non_empty_elements: 'td th iframe video audio object script a i area base basefont br col frame hr img input isindex link meta param embed source wbr track ruby',
   // tiny's external link create/edit dialog config
   target_list: false,

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

@@ -242,7 +242,7 @@ export function enhanceUserContent(container = document, opts = {}) {
         iframeElem.setAttribute('src', src.replace('display=in_rce', 'display=borderless'));
       }
     });
-    unenhanced_elem.querySelectorAll('a:not(.not_external, .external)').forEach(childLink => {
+    unenhanced_elem.querySelectorAll('a:not(.not_external):not(.external)').forEach(childLink => {
       if (!isExternalLink(childLink, canvasOrigin)) return;
       if (childLink.tagName === 'IMG' || childLink.querySelectorAll('img').length > 0) return;
       childLink.classList.add('external');

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

@@ -21,6 +21,7 @@ import { showFlashAlert } from '../common/FlashAlert';
 import { isPreviewable, loadDocPreview, removeLoadingImage, showLoadingImage } from './doc_previews';
 import { show } from './jqueryish_funcs';
 import { parseUrlOrNull } from '../util/url-util';
+import psl from 'psl';
 const youTubeRegEx = /^https?:\/\/(www\.youtube\.com\/watch.*v(=|\/)|youtu\.be\/)([^&#]*)/;
 export function youTubeID(path) {
   const match = path.match(youTubeRegEx);
@@ -31,9 +32,12 @@ export function youTubeID(path) {
 }
 export function getTld(hostname) {
   hostname = (hostname || '').split(':')[0];
-  const parts = hostname.split('.'),
-    length = parts.length;
-  return (length > 1 ? [parts[length - 2], parts[length - 1]] : parts).join('.');
+  if (hostname.includes('inseng.test')) {
+    const parts = hostname.split('.');
+    return parts.slice(-3).join('.');
+  }
+  const parsed = psl.parse(hostname);
+  return parsed.domain || hostname;
 }
 export function isExternalLink(element, canvasOrigin = window.location.origin) {
   let canvasHost;

package/es/rce/RCEGlobals.d.ts

@@ -1,12 +1,10 @@
 export default instance;
 export type Features = {
-    media_links_use_attachment_id: boolean;
     file_verifiers_for_quiz_links: boolean;
 };
 declare const instance: RCEGlobals;
 /**
  * @typedef {Object} Features
- * @property {boolean} media_links_use_attachment_id
  * @property {boolean} file_verifiers_for_quiz_links
  */
 declare class RCEGlobals {

package/es/rce/RCEGlobals.js

@@ -20,7 +20,6 @@ const isEmpty = obj => Object.keys(obj).length === 0;
 
 /**
  * @typedef {Object} Features
- * @property {boolean} media_links_use_attachment_id
  * @property {boolean} file_verifiers_for_quiz_links
  */
 

package/es/rce/RCEVariants.d.ts

@@ -13,5 +13,5 @@ export type RCEVariant = (typeof RCEVariantValues)[number];
 export declare function getMenubarForVariant(variant: RCEVariant): MenuBarSpec;
 export declare function getMenuForVariant(variant: RCEVariant): MenusSpec;
 export declare function getToolbarForVariant(variant: RCEVariant, ltiToolFavorites?: string[]): ToolbarGroupSetting[];
-export declare function getStatusBarFeaturesForVariant(variant: RCEVariant, ai_text_tools?: boolean): StatusBarFeature[];
+export declare function getStatusBarFeaturesForVariant(variant: RCEVariant, aiTextTools?: boolean, isDesktop?: boolean): StatusBarFeature[];
 export {};

package/es/rce/RCEVariants.js

@@ -121,16 +121,16 @@ export function getToolbarForVariant(variant, ltiToolFavorites = []) {
     items: ['removeformat', 'table', 'instructure_equation', 'instructure_media_embed']
   }];
 }
-export function getStatusBarFeaturesForVariant(variant, ai_text_tools = false) {
-  if (variant === 'lite' || variant === 'text-only') {
-    return ['keyboard_shortcuts', 'a11y_checker', 'word_count'];
-  }
+const DESKTOP_FEATURES = ['keyboard_shortcuts', 'a11y_checker', 'word_count'];
+const MOBILE_FEATURES = ['a11y_checker', 'word_count'];
+const EXTENDED_FEATURES = ['html_view', 'fullscreen', 'resize_handle'];
+export function getStatusBarFeaturesForVariant(variant, aiTextTools = false, isDesktop = true) {
   if (variant === 'text-block') {
     return [];
   }
-  const full_features = ['keyboard_shortcuts', 'a11y_checker', 'word_count', 'html_view', 'fullscreen', 'resize_handle'];
-  if (ai_text_tools) {
-    full_features.push('ai_tools');
+  const platformFeatures = isDesktop ? DESKTOP_FEATURES : MOBILE_FEATURES;
+  if (variant === 'lite' || variant === 'text-only') {
+    return platformFeatures;
   }
-  return full_features;
+  return [...platformFeatures, ...EXTENDED_FEATURES, ...(aiTextTools ? ['ai_tools'] : [])];
 }

package/es/rce/RCEWrapper.d.ts

@@ -214,7 +214,6 @@ declare class RCEWrapper extends React.Component<RCEWrapperProps, RCEWrapperStat
         new_math_equation_handling: unknown;
         explicit_latex_typesetting: unknown;
         rce_transform_loaded_content: unknown;
-        media_links_use_attachment_id: unknown;
         file_verifiers_for_quiz_links: unknown;
         rce_find_replace: unknown;
         consolidated_media_player: unknown;
@@ -348,7 +347,6 @@ declare class RCEWrapper extends React.Component<RCEWrapperProps, RCEWrapperStat
         type: string;
         content: string;
     };
-    setFocusAbilityForHeader: (focusable: boolean) => void;
     componentWillUnmount(): void;
     wrapOptions(options?: {}): {
         readonly: boolean | undefined;

package/es/rce/RCEWrapper.js

@@ -19,6 +19,7 @@ import _pt from "prop-types";
 
 import React, { Suspense } from 'react';
 import { Editor } from '@tinymce/tinymce-react';
+import tinymce from 'tinymce';
 import _ from 'lodash';
 import { StoreProvider } from './plugins/shared/StoreContext';
 import { IconKeyboardShortcutsLine } from '@instructure/ui-icons';
@@ -63,6 +64,7 @@ import buildStyle from './style';
 import { getMenubarForVariant, getMenuForVariant, getToolbarForVariant, getStatusBarFeaturesForVariant } from './RCEVariants';
 import { focusFirstMenuButton, focusToolbar, isElementWithinTable, mergeMenu, mergeMenuItems, mergePlugins, mergeToolbar, parsePluginsToExclude, patchAutosavedContent } from './RCEWrapper.utils';
 import { externalToolsForToolbar } from './plugins/instructure_rce_external_tools/util/externalToolsForToolbar';
+import { initScreenreaderOnFormat } from './screenreaderOnFormat';
 const RestoreAutoSaveModal = /*#__PURE__*/React.lazy(() => import('./RestoreAutoSaveModal'));
 const RceHtmlEditor = /*#__PURE__*/React.lazy(() => import('./RceHtmlEditor'));
 const ASYNC_FOCUS_TIMEOUT = 250;
@@ -267,13 +269,11 @@ class RCEWrapper extends React.Component {
       if (event.code === 'F9' && event.altKey) {
         event.preventDefault();
         event.stopPropagation();
-        this.setFocusAbilityForHeader(true);
         // @ts-expect-error
         focusFirstMenuButton(this._elementRef.current);
       } else if (event.code === 'F10' && event.altKey) {
         event.preventDefault();
         event.stopPropagation();
-        this.setFocusAbilityForHeader(true);
         // @ts-expect-error
         focusToolbar(this._elementRef.current);
       } else if (event.code === 'F8' && event.altKey) {
@@ -311,6 +311,7 @@ class RCEWrapper extends React.Component {
       // @ts-expect-error
       textarea.value = this.getCode();
       textarea.style.height = this.state.height;
+      textarea.removeAttribute('aria-hidden');
       if (document.body.classList.contains('Underline-All-Links__enabled')) {
         if (this.iframe?.contentDocument) {
           this.iframe.contentDocument.body.classList.add('Underline-All-Links__enabled');
@@ -327,20 +328,6 @@ class RCEWrapper extends React.Component {
         tinyapp.setAttribute('tabIndex', '-1');
       }
 
-      // Adds a focusout event listener for handling screen reader navigation focus
-      const header = this._elementRef.current?.querySelector('.tox-editor-header');
-      if (header) {
-        // @ts-expect-error
-        header.addEventListener('focusout', e => {
-          // @ts-expect-error
-          const leavingHeader = !header.contains(e.relatedTarget);
-          if (leavingHeader) {
-            this.setFocusAbilityForHeader(false);
-          }
-        });
-      }
-      this.setFocusAbilityForHeader(false);
-
       // Probably should do this in tinymce.scss, but we only want it in new rce
       textarea.style.resize = 'none';
       editor.on('keydown', this.handleKey);
@@ -350,6 +337,7 @@ class RCEWrapper extends React.Component {
       // focus-trapping components, so they properly ignore trapping focus on click.
       editor.on('click', () => window.document.body.click(), true);
       editor.on('Cut Change input Undo Redo', debounce(this.handleInputChange, 1000));
+      initScreenreaderOnFormat(editor);
       this.announceContextToolbars(editor);
       if (this.isAutoSaving) {
         this.initAutoSave(editor);
@@ -702,13 +690,6 @@ class RCEWrapper extends React.Component {
         content: this.mceInstance().getContent()
       };
     };
-    this.setFocusAbilityForHeader = focusable => {
-      // Sets aria-hidden to prevent screen readers focus in RCE menus and toolbar
-      const header = this._elementRef.current?.querySelector('.tox-editor-header');
-      if (header) {
-        header.setAttribute('aria-hidden', focusable ? 'false' : 'true');
-      }
-    };
     this.handleTextareaChange = () => {
       if (this.isHidden()) {
         this.setCode(this.textareaValue());
@@ -850,7 +831,6 @@ class RCEWrapper extends React.Component {
       new_math_equation_handling = false,
       explicit_latex_typesetting = false,
       rce_transform_loaded_content = false,
-      media_links_use_attachment_id = false,
       rce_find_replace = false,
       file_verifiers_for_quiz_links = false,
       consolidated_media_player = false
@@ -859,7 +839,6 @@ class RCEWrapper extends React.Component {
       new_math_equation_handling,
       explicit_latex_typesetting,
       rce_transform_loaded_content,
-      media_links_use_attachment_id,
       file_verifiers_for_quiz_links,
       rce_find_replace,
       consolidated_media_player
@@ -1729,7 +1708,7 @@ class RCEWrapper extends React.Component {
         }
       });
     }
-    const statusBarFeatures = getStatusBarFeaturesForVariant(this.variant, this.props.ai_text_tools);
+    const statusBarFeatures = getStatusBarFeaturesForVariant(this.variant, this.props.ai_text_tools, tinymce.Env.deviceType.isDesktop());
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("style", null, this.style.css), /*#__PURE__*/React.createElement(StoreProvider, {
       jwt: this.props.trayProps?.jwt,
       refreshToken: this.props.trayProps?.refreshToken,
@@ -1751,7 +1730,7 @@ class RCEWrapper extends React.Component {
         } : undefined,
         onFocus: this.handleFocusRCE,
         onBlur: this.handleBlurRCE
-      }, this.state.shouldShowOnFocusButton && /*#__PURE__*/React.createElement(ShowOnFocusButton, {
+      }, this.state.shouldShowOnFocusButton && tinymce.Env.deviceType.isDesktop() && /*#__PURE__*/React.createElement(ShowOnFocusButton, {
         id: `show-on-focus-btn-${this.id}`,
         onClick: this.openKBShortcutModal,
         margin: "xx-small",

package/es/rce/contentRendering.js

@@ -20,7 +20,7 @@ import React from 'react';
 import { renderToStaticMarkup } from 'react-dom/server';
 import { cleanUrl } from './contentInsertionUtils';
 import formatMessage from '../format-message';
-import { VIDEO_SIZE_DEFAULT, AUDIO_PLAYER_SIZE } from './plugins/instructure_record/VideoOptionsTray/TrayController';
+import { videoDefaultSize, AUDIO_PLAYER_SIZE } from './plugins/instructure_record/VideoOptionsTray/TrayController';
 import { mediaPlayerURLFromFile } from './plugins/shared/fileTypeUtils';
 import { prepEmbedSrc, prepLinkedSrc, absoluteToRelativeUrl } from '../common/fileUrl';
 export function renderLink(data, contents, canvasOrigin) {
@@ -97,6 +97,7 @@ export function renderImage(image, canvasOrigin, opts) {
 }
 export function renderVideo(video, canvasOrigin) {
   const src = mediaPlayerURLFromFile(video, canvasOrigin);
+  const videoSize = videoDefaultSize();
   return `
   <iframe
       allow="fullscreen"
@@ -105,7 +106,7 @@ export function renderVideo(video, canvasOrigin) {
       data-media-type="video"
       loading="lazy"
       src="${src}"
-      style="width:${VIDEO_SIZE_DEFAULT.width};height:${VIDEO_SIZE_DEFAULT.height};display:inline-block;"
+      style="width:${videoSize.width};height:${videoSize.height};display:inline-block;"
       title="${formatMessage('Video player for {title}', {
     title: video.title || video.name || video.text
   })}"></iframe>

package/es/rce/plugins/instructure_equation/EquationEditorModal/index.d.ts

@@ -13,7 +13,7 @@ declare class EquationEditorModal extends React.Component<any, any, any> {
     executeCommand: (cmd: any, advancedCmd: any) => void;
     handleModalCancel: () => void;
     handleModalDone: () => void;
-    renderMathInAdvancedPreview: import("@instructure/debounce").Debounced;
+    renderMathInAdvancedPreview: import("@instructure/debounce").Debounced<() => void>;
     setPreviewElementContent(): void;
     toggleAdvanced: () => void;
     toggleAndUpdatePreference: () => void;

package/es/rce/plugins/instructure_image/ImageEmbedOptions.js

@@ -18,7 +18,6 @@
 
 import formatMessage from '../../../format-message';
 import { scaleForHeight, scaleForWidth } from '../shared/DimensionUtils';
-import RCEGlobals from '../../RCEGlobals';
 export const MIN_HEIGHT = 10;
 export const MIN_WIDTH = 10;
 export const MIN_WIDTH_VIDEO = 320;
@@ -117,12 +116,10 @@ export function fromVideoEmbed($element) {
     // bad json?
   }
   videoOptions.videoSize = imageSizeFromKnownOptions(videoOptions);
-  if (RCEGlobals.getFeatures().media_links_use_attachment_id) {
-    const source = $videoIframe.getAttribute('src');
-    const matches = source?.match(/\/media_attachments_iframe\/(\d+)/);
-    if (matches) {
-      videoOptions.attachmentId = matches[1];
-    }
+  const source = $videoIframe.getAttribute('src');
+  const matches = source?.match(/\/media_attachments_iframe\/(\d+)/);
+  if (matches) {
+    videoOptions.attachmentId = matches[1];
   }
   return videoOptions;
 }