INT-3350: Update to work with TinyMCE 8 (#596)

Author: tiny-ben-tran

CHANGELOG.md

@@ -6,6 +6,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## Unreleased
 
+### Changed
+- Set the default `cloudChannel` to `8`. #INT-3350
+
 ## 6.2.1 - 2025-06-03
 
 ### Fixed

README.md

@@ -4,9 +4,9 @@
 
 This package is a thin wrapper around [TinyMCE](https://github.com/tinymce/tinymce) to make it easier to use in a React application.
 
-* If you need detailed documentation on TinyMCE, see: [TinyMCE Documentation](https://www.tiny.cloud/docs/tinymce/7/).
-* For the TinyMCE React Quick Start, see: [TinyMCE Documentation - React Integration](https://www.tiny.cloud/docs/tinymce/7/react-cloud/).
-* For the TinyMCE React Technical Reference, see: [TinyMCE Documentation - TinyMCE React Technical Reference](https://www.tiny.cloud/docs/tinymce/7/react-ref/).
+* If you need detailed documentation on TinyMCE, see: [TinyMCE Documentation](https://www.tiny.cloud/docs/tinymce/latest/).
+* For the TinyMCE React Quick Start, see: [TinyMCE Documentation - React Integration](https://www.tiny.cloud/docs/tinymce/latest/react-cloud/).
+* For the TinyMCE React Technical Reference, see: [TinyMCE Documentation - TinyMCE React Technical Reference](https://www.tiny.cloud/docs/tinymce/latest/react-ref/).
 * For our quick demos, check out the TinyMCE React [Storybook](https://tinymce.github.io/tinymce-react/).
 
 

SECURITY.md

@@ -2,4 +2,4 @@
 
 ## Reporting a Vulnerability
 
-For details on how to report security issues to Tiny, refer to the [Reporting TinyMCE security issues documentation](https://www.tiny.cloud/docs/tinymce/6/security/#reporting-tinymce-security-issues).
+For details on how to report security issues to Tiny, refer to the [Reporting TinyMCE security issues documentation](https://www.tiny.cloud/docs/tinymce/latest/security/#reporting-tinymce-security-issues).

package.json

@@ -31,7 +31,7 @@
   "peerDependencies": {
     "react": "^19.0.0 || ^18.0.0 || ^17.0.1 || ^16.7.0",
     "react-dom": "^19.0.0 || ^18.0.0 || ^17.0.1 || ^16.7.0",
-    "tinymce": "^7.0.0 || ^6.0.0 || ^5.5.1"
+    "tinymce": "^8.0.0 || ^7.0.0 || ^6.0.0 || ^5.5.1"
   },
   "peerDependenciesMeta": {
     "tinymce": {
@@ -68,12 +68,13 @@
     "react-dom": "^19.0.0",
     "rimraf": "^6.0.1",
     "storybook": "^8.6.4",
-    "tinymce": "^7",
+    "tinymce": "^8.0.1",
     "tinymce-4": "npm:tinymce@^4",
     "tinymce-5": "npm:tinymce@^5",
     "tinymce-6": "npm:tinymce@^6",
     "tinymce-7": "npm:tinymce@^7",
     "tinymce-7.5": "npm:[email protected]",
+    "tinymce-8": "npm:tinymce@^8.0.0",
     "typescript": "~5.8.2",
     "vite": "^6.2.1"
   },

src/main/ts/components/Editor.tsx

@@ -29,7 +29,7 @@ export type InitOptions = Omit<OmitStringIndexSignature<EditorOptions>, OmittedI
   license_key?: DoNotUse<'license_key prop is overridden by the integration, use the `licenseKey` prop instead'>;
 } & { [key: string]: unknown };
 
-export type Version = `${'4' | '5' | '6' | '7'}${'' | '-dev' | '-testing' | `.${number}` | `.${number}.${number}`}`;
+export type Version = `${'4' | '5' | '6' | '7' | '8'}${'' | '-dev' | '-testing' | `.${number}` | `.${number}.${number}`}`;
 
 export interface IProps {
   /**
@@ -150,7 +150,7 @@ export class Editor extends React.Component<IAllProps> {
   public static propTypes: IEditorPropTypes = EditorPropTypes;
 
   public static defaultProps: Partial<IAllProps> = {
-    cloudChannel: '7',
+    cloudChannel: '8',
   };
 
   public editor?: TinyMCEEditor;

src/test/ts/alien/Loader.tsx

@@ -69,7 +69,7 @@ export const render = async (props: Partial<IAllProps> = {}, container: HTMLElem
      * touch the nodes created by TinyMCE. Since this only seems to be an issue when rendering TinyMCE 4 directly
      * into a root and a fix would be a breaking change, let's just wrap the editor in a <div> here for now.
      */
-    root.render(<div><Editor ref={ref} apiKey='no-api-key' {...props} init={init} /></div>);
+    root.render(<div><Editor ref={ref} apiKey='no-api-key' {...props} init={init} licenseKey='gpl'/></div>);
   });
 
   const remove = () => {
@@ -81,7 +81,7 @@ export const render = async (props: Partial<IAllProps> = {}, container: HTMLElem
     ...ctx,
     /** By rendering the Editor into the same root, React will perform a diff and update. */
     reRender: (newProps: IAllProps) => new Promise<void>((resolve) => {
-      root.render(<div><Editor apiKey='no-api-key' ref={ctx.ref} {...newProps} /></div>);
+      root.render(<div><Editor apiKey='no-api-key' ref={ctx.ref} {...newProps}/></div>);
 
       if (newProps.disabled) {
         setMode(ctx.editor, 'readonly');

src/test/ts/alien/TestHelpers.ts

@@ -10,8 +10,8 @@ interface EventHandlerArgs<T> {
 
 type HandlerType<A> = (a: A, editor: TinyMCEEditor) => unknown;
 
-const VERSIONS: Version[] = [ '4', '5', '6', '7' ];
-const CLOUD_VERSIONS: Version[] = [ '5', '6', '7' ];
+const VERSIONS: Version[] = [ '5', '6', '7', '8' ];
+const CLOUD_VERSIONS: Version[] = [ '5', '6', '7', '8' ];
 
 const VALID_API_KEY = 'qagffr3pkuv17a8on1afax661irst1hbr4e6tbv888sz91jc';
 

src/test/ts/browser/EditorBehaviorTest.ts

@@ -17,7 +17,7 @@ describe('EditorBehaviourTest', () => {
     // INT-2278: This test currently times out in IE so we are skipping it
     return;
   }
-  const versionRegex = /6|7/;
+  const versionRegex = /6|7|8/;
 
   const isEditor = (val: unknown): val is TinyMCEEditor => {
     const tinymce = getTinymce(window);

yarn.lock

@@ -8715,10 +8715,15 @@ tiny-invariant@^1.3.1, tiny-invariant@^1.3.3:
   resolved "https://registry.yarnpkg.com/tinymce/-/tinymce-7.8.0.tgz#d57a597aecdc2108f2dd68fe74c6099c0a0ef66f"
   integrity sha512-MUER5MWV9mkOB4expgbWknh/C5ZJvOXQlMVSx4tJxTuYtcUCDB6bMZ34fWNOIc8LvrnXmGHGj0eGQuxjQyRgrA==
 
-tinymce@^7:
-  version "7.8.0"
-  resolved "https://registry.yarnpkg.com/tinymce/-/tinymce-7.8.0.tgz#d57a597aecdc2108f2dd68fe74c6099c0a0ef66f"
-  integrity sha512-MUER5MWV9mkOB4expgbWknh/C5ZJvOXQlMVSx4tJxTuYtcUCDB6bMZ34fWNOIc8LvrnXmGHGj0eGQuxjQyRgrA==
+"tinymce-8@npm:tinymce@^8.0.0":
+  version "8.0.1"
+  resolved "https://registry.yarnpkg.com/tinymce/-/tinymce-8.0.1.tgz#268903624c44be574c72daeedcf8ae36bf37f0ba"
+  integrity sha512-KQ/+KaWmkIzSkNCYmqhXD2mftt+EEhz1bd1QCVopa2DNkoJ/rYFXhMnYGg1gVcRQa43xkmmv0Jj0ph+05VY0hQ==
+
+tinymce@^8.0.1:
+  version "8.0.1"
+  resolved "https://registry.yarnpkg.com/tinymce/-/tinymce-8.0.1.tgz#268903624c44be574c72daeedcf8ae36bf37f0ba"
+  integrity sha512-KQ/+KaWmkIzSkNCYmqhXD2mftt+EEhz1bd1QCVopa2DNkoJ/rYFXhMnYGg1gVcRQa43xkmmv0Jj0ph+05VY0hQ==
 
 tinyrainbow@^1.2.0:
   version "1.2.0"