@instructure/canvas-rce 7.0.0 → 7.2.0

package/es/translations/locales/zh_HK.js

@@ -400,6 +400,9 @@ const locale = {
   "content_type_2cf90d95": {
     "message": "內容類型"
   },
+  "continue_to_youtube_content_a34f0f85": {
+    "message": "繼續觀看 YouTube 內容"
+  },
   "coproduct_e7838082": {
     "message": "副產品"
   },
@@ -499,6 +502,9 @@ const locale = {
   "decrease_indent_d9cf469d": {
     "message": "減少縮排"
   },
+  "decrease_rich_content_area_82068f64": {
+    "message": "減少多種格式的內容區域"
+  },
   "deep_purple_bb3e2907": {
     "message": "深紫色"
   },
@@ -1081,6 +1087,9 @@ const locale = {
   "increase_indent_6af90f7c": {
     "message": "增加縮進"
   },
+  "increase_rich_content_area_340b775": {
+    "message": "增加多種格式的內容區域"
+  },
   "indefinite_integral_6623307e": {
     "message": "無限積分"
   },
@@ -1123,6 +1132,9 @@ const locale = {
   "intersection_cd4590e4": {
     "message": "交集"
   },
+  "invalid_description_991e23bb": {
+    "message": "無效的描述"
+  },
   "invalid_entry_f7d2a0f5": {
     "message": "無效的輸入項目。"
   },
@@ -1690,9 +1702,18 @@ const locale = {
   "please_allow_canvas_to_access_your_microphone_and__dc2c3079": {
     "message": "請允許 Canvas 存取您的麥克風和網路攝影機。"
   },
+  "please_choose_a_file_c2449cc": {
+    "message": "請選擇一個檔案"
+  },
   "please_decribe_what_you_would_like_to_compose_27a51be5": {
     "message": "請描述您想創作什麼。"
   },
+  "please_enter_a_file_name_f159edc1": {
+    "message": "請輸入一個檔案名稱"
+  },
+  "please_select_a_file_of_a_supported_type_1fc578f2": {
+    "message": "請選取支援類型的檔案"
+  },
   "plus_d43cd4ec": {
     "message": "+"
   },
@@ -2242,8 +2263,11 @@ const locale = {
   "the_first_heading_on_a_page_should_be_an_h2_859089f2": {
     "message": "頁面的第一個標題應該是 H2。"
   },
-  "the_following_content_is_partner_provided_ed1da756": {
-    "message": "以下內容由合作夥伴提供"
+  "the_height_of_rich_content_area_is_decreased_36920e0": {
+    "message": "多種格式的內容區域的高度已減少。"
+  },
+  "the_height_of_rich_content_area_is_increased_74c2358d": {
+    "message": "多種格式的內容區域的高度已增加。"
   },
   "the_material_is_in_the_public_domain_279c39a3": {
     "message": "該材料位於公用網域中。"
@@ -2254,9 +2278,6 @@ const locale = {
   "the_material_is_subject_to_an_exception_e_g_fair_u_a39c8ca2": {
     "message": "可能有適用於此資料的例外情況 - 如：合理使用、引用權，或適用版權法下的其他情況"
   },
-  "the_preceding_content_is_partner_provided_d753928c": {
-    "message": "上述內容由合作夥伴提供"
-  },
   "the_pretty_html_editor_is_not_keyboard_accessible__d6d5d2b": {
     "message": "美觀 HTML 編輯器無法用鍵盤存取。按 ShiftO 開啟原始 HTML 編輯器。"
   },
@@ -2296,6 +2317,9 @@ const locale = {
   "this_image_is_currently_unavailable_25c68857": {
     "message": "此圖像目前不可用"
   },
+  "this_video_may_display_youtube_ads_4d19d590": {
+    "message": "此影片可能會顯示 YouTube 廣告。"
+  },
   "though_your_video_will_have_the_correct_title_in_t_90e427f3": {
     "message": "雖然您的影片在瀏覽器中有正確的標題，但我們無法在資料庫中將其更新。"
   },

package/es/util/contextHelper.d.ts

@@ -0,0 +1,7 @@
+type ContainingContext = {
+    contextType: string;
+    contextId: string;
+    userId: string;
+};
+export declare const normalizeContainingContext: (context?: ContainingContext) => ContainingContext | undefined;
+export {};

package/{testcafe/axe.test.js → es/util/contextHelper.js}

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2019 - present Instructure, Inc.
+ * Copyright (C) 2025 - present Instructure, Inc.
  *
  * This file is part of Canvas.
  *
@@ -15,25 +15,14 @@
  * 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 {axeCheck, createReport} from 'axe-testcafe'
-fixture`aXe a11y checking`.page`./testcafe.html`
 
-async function runAxeCheck(t, context, options) {
-  const {violations} = await axeCheck(t, context, options)
-  if (violations) {
-    await t.expect(violations.length === 0).ok(createReport(violations))
+export const normalizeContainingContext = context => {
+  if (context && !['user', 'course', 'group'].includes(context.contextType)) {
+    return {
+      ...context,
+      contextType: 'user',
+      contextId: context.userId
+    };
   }
-}
-
-test('automated a11y testing', async t => {
-  const axeContext = {
-    include: 'body',
-  }
-  const axeOptions = {
-    runOnly: {
-      type: 'tag',
-      values: ['wcag21a', 'wcag21aa', 'best-practice', 'section508'],
-    },
-  }
-  await runAxeCheck(t, axeContext, axeOptions)
-})
+  return context;
+};

package/es/util/loadingPlaceholder.js

@@ -33,11 +33,11 @@ export async function placeholderInfoFor(fileMetaProps) {
   const ariaLabel = formatMessage('Loading placeholder for {fileName}', {
     fileName: fileName !== null && fileName !== void 0 ? fileName : 'unknown filename'
   });
-  if (typeof fileMetaProps.contentType !== 'string') {
-    throw new Error('Invalid fileMetaProps.contentType');
-  }
   const type = fileMetaProps.contentType || fileMetaProps.type;
-  if (isImage(fileMetaProps.contentType) && fileMetaProps.displayAs !== 'link') {
+  if (typeof type !== 'string') {
+    throw new Error('Invalid type: ' + type);
+  }
+  if (isImage(type) && fileMetaProps.displayAs !== 'link') {
     var _trimmedOrNull2;
     const imageUrl = (_trimmedOrNull2 = trimmedOrNull(fileMetaProps.domObject.preview)) !== null && _trimmedOrNull2 !== void 0 ? _trimmedOrNull2 : URL.createObjectURL(fileMetaProps.domObject);
     return new Promise((resolve, reject) => {
@@ -54,7 +54,7 @@ export async function placeholderInfoFor(fileMetaProps) {
       image.onerror = () => reject(new Error('Failed to load image: ' + imageUrl));
       image.src = imageUrl;
     });
-  } else if (typeof type === 'string' && isVideo(type)) {
+  } else if (isVideo(type)) {
     const videoSize = videoDefaultSize();
     return {
       type: 'block',
@@ -64,7 +64,7 @@ export async function placeholderInfoFor(fileMetaProps) {
       height: videoSize.height,
       vAlign: 'bottom'
     };
-  } else if (typeof type === 'string' && isAudio(type)) {
+  } else if (isAudio(type)) {
     return {
       type: 'block',
       visibleLabel,
@@ -159,7 +159,7 @@ export async function insertPlaceholder(editor, unencodedName, placeholderInfoPr
     const labelElem = editor.dom.doc.createElement('div');
     placeholderElem.appendChild(labelElem);
     Object.assign(labelElem.style, {
-      color: '#2D3B45',
+      color: '#273540',
       zIndex: '1000',
       /* Restrict text to one line */
       display: 'inline-block',
@@ -179,7 +179,7 @@ export async function insertPlaceholder(editor, unencodedName, placeholderInfoPr
           padding: '5px',
           verticalAlign: 'baseline',
           gap: '8px',
-          backgroundColor: '#F5F5F5'
+          backgroundColor: '#F2F4F4'
         });
         break;
       case 'block':
@@ -299,8 +299,8 @@ function spinnerSvg(size, labelId) {
 					position: relative;
 					box-sizing: border-box;
 					overflow: hidden;
-					--Spinner-trackColor: #F5F5F5;
-					--Spinner-color: #0374B5;
+					--Spinner-trackColor: #F2F4F4;
+					--Spinner-color: #2B7ABC;
 					--Spinner-xSmallSize: 1.5em;
 					--Spinner-xSmallBorderWidth: 0.25em;
 					--Spinner-smallSize: 3em;
@@ -309,7 +309,7 @@ function spinnerSvg(size, labelId) {
 					--Spinner-mediumBorderWidth: 0.5em;
 					--Spinner-largeSize: 7em;
 					--Spinner-largeBorderWidth: 0.75em;
-					--Spinner-inverseColor: #0374B5;
+					--Spinner-inverseColor: #2B7ABC;
 				}
 
 				.Spinner-circleTrack {

package/eslint.config.js

@@ -14,17 +14,10 @@ const pluginJest = require('eslint-plugin-jest')
 module.exports = tseslint.config(
   // General
   {
-    files: ['src/**/*.ts', 'testcafe/**/*.{js,mjs,ts,jsx,tsx}'],
+    files: ['src/**/*.ts'],
   },
   {
-    ignores: [
-      'es/**/*',
-      './src/translations/*/*',
-      'scripts',
-      'packages/canvas-rce/webpack.testcafe.config.js',
-      'testcafe/',
-      'webpack.*.config.js',
-    ],
+    ignores: ['es/**/*', './src/translations/*/*', 'scripts', 'webpack.*.config.js'],
   },
 
   // Globals
@@ -165,11 +158,7 @@ module.exports = tseslint.config(
   // Imports
   importPlugin.flatConfigs.recommended,
   {
-    files: [
-      '__tests__/**/*.{js,mjs,ts,jsx,tsx}',
-      'src/**/*.{js,mjs,ts,jsx,tsx}',
-      'testcafe/**/*.{js,mjs,ts,jsx,tsx}',
-    ],
+    files: ['__tests__/**/*.{js,mjs,ts,jsx,tsx}', 'src/**/*.{js,mjs,ts,jsx,tsx}'],
     ignores: ['src/translations/**'],
     languageOptions: {
       ecmaVersion: 'latest',
@@ -212,17 +201,6 @@ module.exports = tseslint.config(
     },
   },
 
-  // Testcafe
-  {
-    files: ['testcafe/**/*.{js,mjs,ts,jsx,tsx}'],
-    languageOptions: {
-      globals: {
-        test: true,
-        fixture: true,
-      },
-    },
-  },
-
   // Jest
   {
     files: [

package/jest/jest-setup.js

@@ -25,6 +25,30 @@ import {TextDecoder, TextEncoder} from 'util'
 global.TextEncoder = TextEncoder
 global.TextDecoder = TextDecoder
 
+// Add fetch polyfills for msw
+require('isomorphic-fetch')
+
+// Add BroadcastChannel polyfill for msw
+if (!globalThis.BroadcastChannel) {
+  globalThis.BroadcastChannel = class BroadcastChannel {
+    constructor() {}
+    postMessage() {}
+    close() {}
+    addEventListener() {}
+    removeEventListener() {}
+  }
+}
+
+// Add TransformStream polyfill for msw
+if (!globalThis.TransformStream) {
+  globalThis.TransformStream = class TransformStream {
+    constructor() {
+      this.readable = {}
+      this.writable = {}
+    }
+  }
+}
+
 /**
  * We want to ensure errors and warnings get appropriate eyes. If
  * you are seeing an exception from here, it probably means you
@@ -59,6 +83,7 @@ const ignoredErrors = [
   /Warning: findDOMNode is deprecated and will be removed in the next major release. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https:\/\/reactjs.org\/link\/strict-mode-find-node/,
   /Warning: %s uses the legacy childContextTypes API which is no longer supported and will be removed in the next major release. Use React.createContext\(\) instead/,
   /Warning: %s uses the legacy contextTypes API which is no longer supported and will be removed in the next major release. Use React.createContext\(\) with static contextType instead./,
+  /Warning: Unknown event handler property `%s`. It will be ignored.%s/,
 ]
 const globalWarn = global.console.warn
 const ignoredWarnings = [
@@ -78,7 +103,7 @@ global.console = {
     }
     globalError(error)
     throw new Error(
-      `Looks like you have an unhandled error. Keep our test logs clean by handling or filtering it. ${error}`
+      `Looks like you have an unhandled error. Keep our test logs clean by handling or filtering it. ${error}`,
     )
   },
   warn: warning => {
@@ -87,7 +112,7 @@ global.console = {
     }
     globalWarn(warning)
     throw new Error(
-      `Looks like you have an unhandled warning. Keep our test logs clean by handling or filtering it. ${warning}`
+      `Looks like you have an unhandled warning. Keep our test logs clean by handling or filtering it. ${warning}`,
     )
   },
   info: console.info,

package/jest.config.js

@@ -18,7 +18,7 @@
 
 // Used to enable babel transformations for node_modules that use ecmascript module syntax directly
 // From https://github.com/nrwl/nx/issues/812
-const esModules = ['text-field-edit', '@instructure\\/ui-icons'].join('|')
+const esModules = ['text-field-edit', '@instructure\\/ui-icons', 'msw'].join('|')
 
 module.exports = {
   setupFiles: ['jest-canvas-mock', '<rootDir>/jest/jest-setup.js'],
@@ -43,6 +43,10 @@ module.exports = {
   modulePathIgnorePatterns: ['<rootDir>/es', '<rootDir>/canvas'],
   transformIgnorePatterns: [`/node_modules/(?!${esModules})`],
   testEnvironment: 'jsdom',
+  testEnvironmentOptions: {
+    // https://github.com/mswjs/examples/blob/main/examples/with-jest/jest.config.ts#L20
+    customExportConditions: [''],
+  },
   moduleNameMapper: {
     // jest can't import css
     '\\.(css|less)$': '<rootDir>/src/rce/__mocks__/styleMock.js',

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@instructure/canvas-rce",
-  "version": "7.0.0",
+  "version": "7.2.0",
   "description": "A component wrapping Canvas's usage of Tinymce",
   "main": "es/index.js",
   "types": "es/index.d.ts",
-  "owner": "LF",
+  "owner": "RCX",
   "scripts": {
     "i18n:extract": "format-message extract \"es/**/*.js\" -g underscored_crc32 -o locales/en.json",
     "integration-test": "nightwatch --env integration",
@@ -14,14 +14,6 @@
     "test:parallel": "yarn test:jest",
     "test:serial": "yarn test:jest",
     "test:jest": "jest --color",
-    "test:cafe": "yarn build:cafe && yarn test:cafe:only",
-    "test:cafe:ui": "yarn build:cafe && yarn test:cafe:only:ui",
-    "test:cafe:only": "testcafe ${TESTCAFE_PROVIDER:-chrome:headless} testcafe/**/*.test.js",
-    "test:cafe:only:ui": "testcafe chrome testcafe/**/*.test.js  -s takeOnFails=true",
-    "test:cafe:only:debug": "testcafe chrome testcafe/**/*.test.js --debug-mode  -s takeOnFails=true",
-    "test:cafe:one": "testcafe chrome testcafe/**/*.test.js --test ",
-    "test:cafe:all": "yarn build:cafe && testcafe chrome,firefox,safari testcafe/**/*.test.js",
-    "test:cafe:debug": "yarn build:cafe && yarn test:cafe:only:debug",
     "test:jest:debug": "node --inspect-brk node_modules/.bin/jest --runInBand",
     "test:jest:watch": "node node_modules/.bin/jest --watch",
     "demo": "scripts/demo.sh",
@@ -35,7 +27,6 @@
     "build:types": "tsc",
     "build:canvas": "yarn run build",
     "build:watch": "yarn clean:es && yarn build:es --watch",
-    "build:cafe": "wp --config webpack.testcafe.config.js",
     "prepublishOnly": "yarn build && yarn test",
     "fmt:check": "biome check",
     "fmt:fix": "biome format --write",
@@ -54,92 +45,83 @@
   ],
   "author": "Instructure, Inc",
   "license": "AGPL-3.0",
-  "browserslist": [
-    "extends @instructure/browserslist-config-canvas-lms"
-  ],
+  "browserslist": ["extends @instructure/browserslist-config-canvas-lms"],
   "nyc": {
-    "include": [
-      "shared/**/*.js",
-      "src/**/*.js"
-    ],
+    "include": ["shared/**/*.js", "src/**/*.js"],
     "exclude": [],
-    "require": [
-      "@babel/register",
-      "@instructure/canvas-theme"
-    ],
+    "require": ["@babel/register", "@instructure/canvas-theme"],
     "sourceMap": false,
     "instrument": false
   },
   "dependencies": {
-    "@instructure/canvas-theme": "10.11.0",
+    "@instructure/canvas-theme": "10.24.2",
     "@instructure/canvas-media": "*",
-    "@instructure/debounce": "10.11.0",
-    "@instructure/emotion": "10.11.0",
+    "@instructure/debounce": "10.24.2",
+    "@instructure/emotion": "10.24.2",
     "@instructure/k5uploader": "*",
     "@instructure/media-capture": "^9.0.0",
-    "@instructure/theme-registry": "10.11.0",
-    "@instructure/ui-a11y-content": "10.11.0",
-    "@instructure/ui-a11y-utils": "10.11.0",
-    "@instructure/ui-alerts": "10.11.0",
-    "@instructure/ui-avatar": "10.11.0",
-    "@instructure/ui-badge": "10.11.0",
-    "@instructure/ui-billboard": "10.11.0",
-    "@instructure/ui-buttons": "10.11.0",
-    "@instructure/ui-checkbox": "10.11.0",
-    "@instructure/ui-source-code-editor": "10.11.0",
-    "@instructure/ui-color-picker": "10.11.0",
-    "@instructure/ui-color-utils": "10.11.0",
-    "@instructure/ui-file-drop": "10.11.0",
-    "@instructure/ui-flex": "10.11.0",
-    "@instructure/ui-focusable": "10.11.0",
-    "@instructure/ui-form-field": "10.11.0",
-    "@instructure/ui-grid": "10.11.0",
-    "@instructure/ui-heading": "10.11.0",
-    "@instructure/ui-icons": "10.11.0",
-    "@instructure/ui-img": "10.11.0",
-    "@instructure/ui-link": "10.11.0",
-    "@instructure/ui-list": "10.11.0",
+    "@instructure/theme-registry": "10.24.2",
+    "@instructure/ui-a11y-content": "10.24.2",
+    "@instructure/ui-a11y-utils": "10.24.2",
+    "@instructure/ui-alerts": "10.24.2",
+    "@instructure/ui-avatar": "10.24.2",
+    "@instructure/ui-badge": "10.24.2",
+    "@instructure/ui-billboard": "10.24.2",
+    "@instructure/ui-buttons": "10.24.2",
+    "@instructure/ui-checkbox": "10.24.2",
+    "@instructure/ui-source-code-editor": "10.24.2",
+    "@instructure/ui-color-picker": "10.24.2",
+    "@instructure/ui-color-utils": "10.24.2",
+    "@instructure/ui-file-drop": "10.24.2",
+    "@instructure/ui-flex": "10.24.2",
+    "@instructure/ui-focusable": "10.24.2",
+    "@instructure/ui-form-field": "10.24.2",
+    "@instructure/ui-grid": "10.24.2",
+    "@instructure/ui-heading": "10.24.2",
+    "@instructure/ui-icons": "10.24.2",
+    "@instructure/ui-img": "10.24.2",
+    "@instructure/ui-link": "10.24.2",
+    "@instructure/ui-list": "10.24.2",
     "@instructure/ui-media-player": "^9.0.0",
-    "@instructure/ui-menu": "10.11.0",
-    "@instructure/ui-modal": "10.11.0",
-    "@instructure/ui-motion": "10.11.0",
-    "@instructure/ui-number-input": "10.11.0",
-    "@instructure/ui-overlays": "10.11.0",
-    "@instructure/ui-pagination": "10.11.0",
-    "@instructure/ui-pill": "10.11.0",
-    "@instructure/ui-popover": "10.11.0",
-    "@instructure/ui-radio-input": "10.11.0",
-    "@instructure/ui-simple-select": "10.11.0",
-    "@instructure/ui-spinner": "10.11.0",
-    "@instructure/ui-svg-images": "10.11.0",
-    "@instructure/ui-table": "10.11.0",
-    "@instructure/ui-tabs": "10.11.0",
-    "@instructure/ui-text-area": "10.11.0",
-    "@instructure/ui-text-input": "10.11.0",
-    "@instructure/ui-text": "10.11.0",
-    "@instructure/ui-themes": "10.11.0",
-    "@instructure/ui-toggle-details": "10.11.0",
-    "@instructure/ui-tooltip": "10.11.0",
-    "@instructure/ui-tray": "10.11.0",
-    "@instructure/ui-tree-browser": "10.11.0",
-    "@instructure/ui-truncate-text": "10.11.0",
-    "@instructure/ui-utils": "10.11.0",
-    "@instructure/ui-view": "10.11.0",
-    "@instructure/uid": "10.11.0",
+    "@instructure/ui-menu": "10.24.2",
+    "@instructure/ui-modal": "10.24.2",
+    "@instructure/ui-motion": "10.24.2",
+    "@instructure/ui-number-input": "10.24.2",
+    "@instructure/ui-overlays": "10.24.2",
+    "@instructure/ui-pagination": "10.24.2",
+    "@instructure/ui-pill": "10.24.2",
+    "@instructure/ui-popover": "10.24.2",
+    "@instructure/ui-radio-input": "10.24.2",
+    "@instructure/ui-simple-select": "10.24.2",
+    "@instructure/ui-spinner": "10.24.2",
+    "@instructure/ui-svg-images": "10.24.2",
+    "@instructure/ui-table": "10.24.2",
+    "@instructure/ui-tabs": "10.24.2",
+    "@instructure/ui-text-area": "10.24.2",
+    "@instructure/ui-text-input": "10.24.2",
+    "@instructure/ui-text": "10.24.2",
+    "@instructure/ui-themes": "10.24.2",
+    "@instructure/ui-toggle-details": "10.24.2",
+    "@instructure/ui-tooltip": "10.24.2",
+    "@instructure/ui-tray": "10.24.2",
+    "@instructure/ui-tree-browser": "10.24.2",
+    "@instructure/ui-truncate-text": "10.24.2",
+    "@instructure/ui-utils": "10.24.2",
+    "@instructure/ui-view": "10.24.2",
+    "@instructure/uid": "10.24.2",
     "@sheerun/mutationobserver-shim": "^0.3.2",
     "@types/tinycolor2": "^1.4.6",
     "@tinymce/tinymce-react": "~3.8.4",
     "aphrodite": "^2",
-    "axios": "^0.28.0",
+    "axios": "^1.11.0",
     "bloody-offset": "0.0.0",
-    "crypto-es": "^2.0.4",
+    "crypto-es": "^2.1.0",
     "classnames": "^2.2.5",
-    "concurrently": "^4",
     "format-message": "^6",
     "format-message-generate-id": "^6",
     "i18n-js": "^3",
     "isomorphic-fetch": "2.2.1",
-    "js-beautify": "1",
+    "js-beautify": "1.14.9",
     "keycode": "^2",
     "lodash": "^4",
     "mathlive": "^0.77.0",
@@ -181,7 +163,6 @@
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "@types/testing-library__jest-dom": "^5.0.0",
-    "axe-testcafe": "^3",
     "babel-loader": "^9.1.3",
     "babel-plugin-dynamic-import-node": "^2.2.0",
     "babel-plugin-inline-json-import": "^0.2.0",
@@ -200,16 +181,12 @@
     "jest-mock-proxy": "3.1.2",
     "jest": "^28",
     "mathjax": "^3.2.0",
-    "moxios": "^0.4",
+    "msw": "^2.7",
     "nyc": "^13",
     "proxyquire": "1.7.4",
     "shelljs": "^0.8.3",
-    "sinon": "^7",
     "skin-deep": "^1",
     "source-map-support": "0.5.21",
-    "testcafe-browser-provider-selenium": "^1.2.0",
-    "testcafe-react-selectors": "^3.3.0",
-    "testcafe": "1.14.2",
     "ts-node": "^10.9.2",
     "typescript": "*",
     "url-loader": "^4.1.1",
@@ -221,4 +198,4 @@
   "resolutions": {
     "format-message-estree-util": "./packages/format-message-estree-util"
   }
-}
+}