INT-3354: Update to set the default cloud channel to 8 and properly set license key to all demos

tiny-ben-tran · tiny-ben-tran · commit 702da082b68a · 2025-07-25T08:49:08.000+09:30
diff --git a/package.json b/package.json
@@ -42,7 +42,7 @@
     "esm": "^3.2.25",
     "express": "^4.18.2",
     "rollup": "^4.24.0",
-    "tinymce": "^7.4.1",
+    "tinymce": "^8.0.0",
     "ts-loader": "^9.4.2",
     "ts-node": "^10.9.1",
     "typescript": "~5.6.3",
diff --git a/src/demo/html/basic.html b/src/demo/html/basic.html
@@ -8,7 +8,12 @@
 
   <body>
   <h1>TinyMCE Web Component Simple Demo Page</h1>
-  <tinymce-editor promotion="false"></tinymce-editor>
+  <script>
+    var editorConfig = {
+      license_key: 'gpl'
+    };
+  </script>
+  <tinymce-editor config="editorConfig" promotion="false"></tinymce-editor>
   <script src="../../../node_modules/tinymce/tinymce.js"></script>
   <script src="../../../dist/tinymce-webcomponent.js"></script>
   </body>
diff --git a/src/demo/html/common-attributes.html b/src/demo/html/common-attributes.html
@@ -36,7 +36,13 @@ <h1>TinyMCE Web Component Common Attributes Demo Page</h1>
     <li>icons_url</li>
     <li>setup</li>
   </ul>
+  <script>
+    var editorConfig = {
+      license_key: 'gpl'
+    };
+  </script>
   <tinymce-editor
+    config="editorConfig"
     height="500"
     menubar="false"
     plugins="advlist autolink lists link image charmap print preview anchor 
diff --git a/src/demo/html/content.html b/src/demo/html/content.html
@@ -8,7 +8,12 @@
 
   <body>
   <h1>TinyMCE Web Component Content Demo Page</h1>
-  <tinymce-editor promotion="false">
+  <script>
+    var editorConfig = {
+      license_key: 'gpl'
+    };
+  </script>
+  <tinymce-editor config="editorConfig" promotion="false">
 &lt;p style=&quot;text-align: center;&quot;&gt;&lt;span style=&quot;color: #bdc3c7;&quot;&gt;&amp;rarr; This is a full-featured editor demo. Please explore! &amp;larr;&lt;/span&gt;&lt;/p&gt;
 &lt;p style=&quot;text-align: center;&quot;&gt;&amp;nbsp;&lt;/p&gt;
 &lt;h2 style=&quot;text-align: center;&quot;&gt;TinyMCE is the world's most customizable, and flexible, rich text editor.&lt;/h2&gt;
diff --git a/src/demo/html/demo.html b/src/demo/html/demo.html
@@ -7,11 +7,17 @@
   </head>
 
   <body>
+    <script>
+      var editorConfig = {
+        license_key: 'gpl'
+      };
+    </script>
 	  <h2>TinyMCE Web Component Demo Page</h2>
     <div id="ephox-ui">
       <h3>Attribute config</h3>
       <tinymce-editor autofocus
         toolbar="undo redo | bold"
+        config="editorConfig"
         menubar="false"
         plugins="lists image"
         setup="editors.setupFn"
@@ -20,7 +26,7 @@ <h3>Attribute config</h3>
         promotion="false"
       ></tinymce-editor>
       <h3>Default with readonly</h3>
-      <tinymce-editor promotion="false" readonly>
+      <tinymce-editor config="editorConfig" promotion="false" readonly>
         &lt;p&gt;The quick &lt;b&gt;brown&lt;/b&gt; fox.&lt;/p&gt;
         &lt;p&gt;Jumps over the &lt;i&gt;lazy&lt;/i&gt; dog.&lt;/p&gt;
         &lt;p&gt;&lt;img src=&quot;http://www.google.com/google.jpg&quot; onload=&quot;javascript: alert('hello');&quot;/&gt;&lt;/p&gt;
diff --git a/src/demo/html/disabled.html b/src/demo/html/disabled.html
@@ -26,15 +26,18 @@
         editor.removeAttribute('readonly');
       }
     }
+    var editorConfig = {
+      license_key: 'gpl'
+    }
   </script>
   <h2>TinyMCE WebComponent Demo: Disabled and Readonly</h2>
   <div id="ephox-ui">
     <h2>Readonly mode</h2>
     <button onclick="toggleReadonly()">Toggle readonly</button>
-    <tinymce-editor id="readonly_mode" readonly></tinymce-editor>
+    <tinymce-editor config="editorConfig" id="readonly_mode" readonly></tinymce-editor>
     <h2>Disabled state</h2>
     <button onclick="toggleDisabled()" plugins="help">Toggle disabled</button>
-    <tinymce-editor id="disabled_state" disabled></tinymce-editor>
+    <tinymce-editor config="editorConfig" id="disabled_state" disabled></tinymce-editor>
   </div>
   <script src="../../../node_modules/tinymce/tinymce.js"></script>
   <script src="../../../dist/tinymce-webcomponent.js"></script>
diff --git a/src/demo/html/events.html b/src/demo/html/events.html
@@ -26,7 +26,13 @@
 
   <body>
   <h1>TinyMCE Web Component Events Demo Page</h1>
+  <script>
+   var editorConfig = {
+      license_key: 'gpl'
+    }
+  </script>
   <tinymce-editor
+    config="editorConfig"
     setup="editors.setupFn"
     on-Init="editors.initFn"
     on-Change="editors.changeFn"
diff --git a/src/main/ts/component/Editor.ts b/src/main/ts/component/Editor.ts
@@ -287,7 +287,7 @@ class TinyMceEditor extends HTMLElement {
     if (src) {
       return src;
     }
-    const channel = this.getAttribute('channel') ?? '6';
+    const channel = this.getAttribute('channel') ?? '8';
     const apiKey = this.hasAttribute('api-key') ? this.getAttribute('api-key') : 'no-api-key';
     return `https://cdn.tiny.cloud/1/${apiKey}/tinymce/${channel}/tinymce.min.js`;
 
diff --git a/src/test/ts/browser/LoadTest.ts b/src/test/ts/browser/LoadTest.ts
@@ -6,7 +6,7 @@ import { Arr, Global } from '@ephox/katamari';
 
 const makeTinymceElement = (attrs: Record<string, string>, content: string) => {
   const ce = SugarElement.fromTag('tinymce-editor');
-  Attribute.set(ce, 'channel', '6-testing');
+  Attribute.set(ce, 'channel', '8');
   Attribute.setAll(ce, attrs);
   TextContent.set(ce, content);
   Insert.append(SugarBody.body(), ce);
diff --git a/yarn.lock b/yarn.lock
@@ -7055,10 +7055,10 @@ thunky@^1.0.2:
   resolved "https://registry.yarnpkg.com/thunky/-/thunky-1.1.0.tgz#5abaf714a9405db0504732bbccd2cedd9ef9537d"
   integrity sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==
 
-tinymce@^7.4.1:
-  version "7.9.0"
-  resolved "https://registry.yarnpkg.com/tinymce/-/tinymce-7.9.0.tgz#92e2260629de77e864e0a66e61c4a6193cf9cc32"
-  integrity sha512-tTrUmUGWqy1BY1WwDYh4WiuHm23LiRTcE1Xq3WLO8HKFzde/d0bTF/hXWOa97zqGh0ndJHx/nysQaNC9Gcd16g==
+tinymce@^8.0.0:
+  version "8.0.0"
+  resolved "https://registry.yarnpkg.com/tinymce/-/tinymce-8.0.0.tgz#e6abd6bd31a2972f0a514462c281d4f7b2dae50e"
+  integrity sha512-E1OwCXXCzmZLx6sQVeMHdb61Hsp+7AxWtYstXp7Yw59Et4AdHQ0N36n7InVaYDmq2aBlCM8qkTQYKEqKgecP3A==
 
 tinyrainbow@^1.2.0:
   version "1.2.0"

Original file line number	Diff line number	Diff line change
`@@ -287,7 +287,7 @@ class TinyMceEditor extends HTMLElement {`
`287`	`287`	`if (src) {`
`288`	`288`	`return src;`
`289`	`289`	`}`
`290`		`- const channel = this.getAttribute('channel') ?? '6';`
	`290`	`+ const channel = this.getAttribute('channel') ?? '8';`
`291`	`291`	`const apiKey = this.hasAttribute('api-key') ? this.getAttribute('api-key') : 'no-api-key';`
`292`	`292`	return `https://cdn.tiny.cloud/1/${apiKey}/tinymce/${channel}/tinymce.min.js`;
`293`	`293`