INT-3354: add license_key to make the component compatible with version 8

lorenzo-pomili · lorenzo-pomili · commit de5a6c72571d · 2025-07-08T13:20:28.000+02:00
diff --git a/src/demo/html/basic.html b/src/demo/html/basic.html
@@ -8,7 +8,7 @@
 
   <body>
   <h1>TinyMCE Web Component Simple Demo Page</h1>
-  <tinymce-editor promotion="false"></tinymce-editor>
+  <tinymce-editor license_key="gpl" 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/cdn.html b/src/demo/html/cdn.html
@@ -9,6 +9,6 @@
 
   <body>
   <h1>TinyMCE Web Component Simple CDN Demo Page</h1>
-  <tinymce-editor api-key="no-api-key"></tinymce-editor>
+  <tinymce-editor license_key="gpl" api-key="no-api-key"></tinymce-editor>
   </body>
 </html>
diff --git a/src/demo/html/common-attributes.html b/src/demo/html/common-attributes.html
@@ -37,6 +37,7 @@ <h1>TinyMCE Web Component Common Attributes Demo Page</h1>
     <li>setup</li>
   </ul>
   <tinymce-editor
+    license_key="gpl"
     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,7 @@
 
   <body>
   <h1>TinyMCE Web Component Content Demo Page</h1>
-  <tinymce-editor promotion="false">
+  <tinymce-editor license_key="gpl" 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
@@ -12,6 +12,7 @@ <h2>TinyMCE Web Component Demo Page</h2>
       <h3>Attribute config</h3>
       <tinymce-editor autofocus
         toolbar="undo redo | bold"
+        license_key="gpl"
         menubar="false"
         plugins="lists image"
         setup="editors.setupFn"
@@ -20,7 +21,7 @@ <h3>Attribute config</h3>
         promotion="false"
       ></tinymce-editor>
       <h3>Default with readonly</h3>
-      <tinymce-editor promotion="false" readonly>
+      <tinymce-editor license_key="gpl" 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
@@ -31,10 +31,10 @@ <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 license_key="gpl" 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 license_key="gpl" 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
@@ -27,6 +27,7 @@
   <body>
   <h1>TinyMCE Web Component Events Demo Page</h1>
   <tinymce-editor
+    license_key="gpl"
     setup="editors.setupFn"
     on-Init="editors.initFn"
     on-Change="editors.changeFn"
diff --git a/src/demo/ts/Server.ts b/src/demo/ts/Server.ts
@@ -45,14 +45,14 @@ const page = (editor1Value: string, editor2Value: string, editor3Value: string,
     <body>
       <h1>TinyMCE WebComponent in Form</h1>
       <h2>Editor 1 (outside form with form attribute)</h2>
-      <tinymce-editor name="editor1" form="myform">${encodeHtmlEntities(editor1Value)}</tinymce-editor>
+      <tinymce-editor license_key="gpl" name="editor1" form="myform">${encodeHtmlEntities(editor1Value)}</tinymce-editor>
       <h2>Editor 2 (nested in shadow dom, outside form with form attribute)</h2>
-      <tinymce-editor-nested nested="2" name="editor2" form="myform" value="${encodeHtmlEntities(editor2Value)}"></tinymce-editor-nested>
+      <tinymce-editor-nested license_key="gpl" nested="2" name="editor2" form="myform" value="${encodeHtmlEntities(editor2Value)}"></tinymce-editor-nested>
       <form id="myform" method="POST" action="/">
         <h2>Editor 3 (inside form)</h2>
-        <tinymce-editor name="editor3">${encodeHtmlEntities(editor3Value)}</tinymce-editor>
+        <tinymce-editor license_key="gpl" name="editor3">${encodeHtmlEntities(editor3Value)}</tinymce-editor>
         <h2>Editor 4 (nested in shadow dom, inside form)</h2>
-        <tinymce-editor-nested nested="2" name="editor4" value="${encodeHtmlEntities(editor4Value)}"></tinymce-editor-nested>
+        <tinymce-editor-nested license_key="gpl" nested="2" name="editor4" value="${encodeHtmlEntities(editor4Value)}"></tinymce-editor-nested>
         <input type="submit" value="Submit">
       </form>
 
diff --git a/src/main/ts/component/Editor.ts b/src/main/ts/component/Editor.ts
@@ -49,6 +49,7 @@ const parseNumberOrString = (value: string) => /^\d+$/.test(value) ? Number.pars
 
 const configAttributes: Record<string, (v: string) => unknown> = {
   setup: parseGlobal, // function
+  license_key: parseString, // string
   statusbar: parseBooleanOrString, // boolean
   toolbar: parseFalseOrString, // string or false
   menubar: parseFalseOrString, // string or false
