TINY-11911: Added version checking for disabled option in the disabled demo.

abhinavgandham · abhinavgandham · commit 63a3f1267aac · 2025-05-13T17:51:00.000+10:00
diff --git a/src/demo/html/disabled.html b/src/demo/html/disabled.html
@@ -1,41 +1,56 @@
 <!DOCTYPE html>
 <html>
-  <head>
-    <meta charset="utf-8"/>
-    <title>TinyMCE WebComponent Demo: Disabled and Readonly </title>
-    <link rel="icon" href="data:;base64,iVBORw0KGgo=">
-  </head>
 
-  <body>
-    <script>
-      function toggleDisabled() {
-        var editor = document.getElementById('mody');
+<head>
+  <meta charset="utf-8" />
+  <title>TinyMCE WebComponent Demo: Disabled and Readonly </title>
+  <link rel="icon" href="data:;base64,iVBORw0KGgo=">
+</head>
 
-        if (!editor.hasAttribute('disabled')) {
-          editor.setAttribute('disabled', '');
+<body>
+  <script>
+
+
+    function toggleDisabled() {
+      var editor = document.getElementById('mody');
+      const editorInstance = editor.get
+        var version = tinymce.majorVersion + '.' + tinymce.minorVersion
+        var isoldVersion = parseFloat(version) < 7.6
+        if (isoldVersion) {
+          if (!editor.hasAttribute('readonly')) {
+            editor.setAttribute('readonly', '');
+          } else {
+            editor.removeAttribute('readonly');
+          }
         } else {
-          editor.removeAttribute('disabled');
+          if (!editor.hasAttribute('disabled')) {
+            editor.setAttribute('disabled', '')
+          }
+          else {
+            editor.removeAttribute('disabled');
+          }
         }
       }
 
-      function toggleReadonly() {
-        var editor = document.getElementById('mody');
+    function toggleReadonly() {
+      var editor = document.getElementById('mody');
 
-        editor.removeAttribute('disabled');
-        if (!editor.hasAttribute('readonly')) {
-          editor.setAttribute('readonly', '');
-        } else {
-          editor.removeAttribute('readonly');
-        }
+      editor.removeAttribute('disabled');
+      if (!editor.hasAttribute('readonly')) {
+        editor.setAttribute('readonly', '');
+      } else {
+        editor.removeAttribute('readonly');
       }
-    </script>
-	  <h2>TinyMCE WebComponent Demo: Disabled and Readonly</h2>
-    <div id="ephox-ui">
-      <button onclick="toggleDisabled()">Toggle disabled</button>
-      <button onclick="toggleReadonly()">Toggle readonly</button>
-      <tinymce-editor id="mody"></tinymce-editor>
-    </div>
+    }
+  </script>
+  <h2>TinyMCE WebComponent Demo: Disabled and Readonly</h2>
+  <div id="ephox-ui">
+    <button onclick="toggleDisabled()">Toggle disabled</button>
+    <button onclick="toggleReadonly()">Toggle readonly</button>
+    <tinymce-editor id="mody"></tinymce-editor>
+  </div>
   <script src="../../../node_modules/tinymce/tinymce.js"></script>
   <script src="../../../dist/tinymce-webcomponent.js"></script>
-  </body>
-</html>
+</body>
+
+</html>
