chiark / gitweb /
webstead: use a non-module <script> and import()
authorBen Harris <bjh21@bjh21.me.uk>
Mon, 6 Oct 2025 23:16:01 +0000 (00:16 +0100)
committerBen Harris <bjh21@bjh21.me.uk>
Tue, 13 Jan 2026 21:42:18 +0000 (21:42 +0000)
According to <https://github.com/fuweichin/xhtml5-esm-support>, an
internal script (a <script> element with content) can't be a module in
an XHTML page in Safari.  So following the suggestion on that page, I
make the <script> on the page into a classic script, and use import()
to load the module containing the bedstead executable.  Maybe this
will work on a reasonable selection of modern browsers.

webstead.xhtml

index 03b115272b7e2644105c48a8de8dc4a11908a156..d01a29726588d071faf51711c781b802a4e1376b 100644 (file)
     </style>
     <!-- Script is async rather than deferred because Chromium can't
          handle deferred scripts in XHTML.
-         https://issues.chromium.org/issues/40518469 -->
-    <script type="module" async="async"><![CDATA[
-    import Bedstead from './bedstead.js';
+         https://issues.chromium.org/issues/40518469
+         And it's not a module because Safari can't handle that. -->
+    <script async="async"><![CDATA[
+    var Bedstead;
     function update_glyph() {
         var args = [];
         var cstr = "";
         }
         update_glyph();
     }
-    // This script is loaded asynchronously, so make sure the DOM is
-    // loaded before touching it.
-    if (document.readyState === "loading") {
-        document.addEventListener("DOMContentLoaded", init);
-    } else {
-        init();
-    }
+    import("./bedstead.js").then((module) => {
+        Bedstead = module.default;
+        // This script is loaded asynchronously, so make sure the DOM is
+        // loaded before touching it.
+        if (document.readyState === "loading") {
+            document.addEventListener("DOMContentLoaded", init);
+        } else {
+            init();
+        }
+    });
 ]]>
     </script>
   </head>