DEV: Refactor content-tag usage in theme-transpiler, and upgrade (#32684)

This strategy allows us to synchronously init the wasm, without needing a patch on the npm package --------- Co-authored-by: Jarek Radosz <jarek@cvx.dev>
2025-05-24 14:12:10 +08:00 · 2025-05-12 17:54:48 +01:00
parent de32f00b30
commit d213cd1b00
8 changed files with 65 additions and 70 deletions
--- a/app/assets/javascripts/theme-transpiler/build.js
+++ b/app/assets/javascripts/theme-transpiler/build.js
@ -49,7 +49,6 @@ esbuild
    bundle: true,
    minify: false,
    alias: {
-      util: "./node_modules/@zxing/text-encoding",
      path: "path-browserify",
      url: "./url-polyfill",
      "source-map-js": "source-map-js",
--- a/app/assets/javascripts/theme-transpiler/content-tag.js
+++ b/app/assets/javascripts/theme-transpiler/content-tag.js
@ -0,0 +1,9 @@
+import {
+  initSync,
+  Preprocessor,
+} from "./node_modules/content-tag/pkg/standalone/content_tag.js";
+import contentTagWasm from "./node_modules/content-tag/pkg/standalone/content_tag_bg.wasm";
+
+export { Preprocessor };
+
+initSync(contentTagWasm);
--- a/app/assets/javascripts/theme-transpiler/package.json
+++ b/app/assets/javascripts/theme-transpiler/package.json
@ -9,10 +9,9 @@
  "dependencies": {
    "@babel/standalone": "^7.27.2",
    "@csstools/postcss-light-dark-function": "^2.0.8",
-    "@zxing/text-encoding": "^0.9.0",
    "autoprefixer": "^10.4.21",
    "babel-plugin-ember-template-compilation": "^2.4.1",
-    "content-tag": "^3.1.3",
+    "content-tag": "^4.0.0",
    "core-js": "^3.42.0",
    "decorator-transforms": "^2.3.0",
    "discourse": "workspace:0.0.0",
@ -20,6 +19,7 @@
    "ember-cli-htmlbars": "^6.3.0",
    "ember-source": "~5.12.0",
    "ember-this-fallback": "^0.4.0",
+    "fastestsmallesttextencoderdecoder": "^1.0.22",
    "path-browserify": "^1.0.1",
    "polyfill-crypto.getrandomvalues": "^1.0.0",
    "postcss": "^8.5.3",
--- a/app/assets/javascripts/theme-transpiler/shims.js
+++ b/app/assets/javascripts/theme-transpiler/shims.js
@ -0,0 +1,29 @@
+/* global rails */
+
+import "core-js/actual/url";
+import { TextDecoder, TextEncoder } from "fastestsmallesttextencoderdecoder";
+import path from "path";
+import getRandomValues from "polyfill-crypto.getrandomvalues";
+
+const CONSOLE_PREFIX = "[DiscourseJsProcessor] ";
+globalThis.window = {};
+globalThis.console = {
+  log(...args) {
+    rails.logger.info(CONSOLE_PREFIX + args.join(" "));
+  },
+  warn(...args) {
+    rails.logger.warn(CONSOLE_PREFIX + args.join(" "));
+  },
+  error(...args) {
+    rails.logger.error(CONSOLE_PREFIX + args.join(" "));
+  },
+};
+
+globalThis.TextEncoder = TextEncoder;
+globalThis.TextDecoder = TextDecoder;
+
+path.win32 = {
+  sep: "/",
+};
+
+globalThis.crypto = { getRandomValues };
--- a/app/assets/javascripts/theme-transpiler/transpiler.js
+++ b/app/assets/javascripts/theme-transpiler/transpiler.js
@ -1,36 +1,17 @@
 // This is executed in mini_racer to provide the JS logic for lib/discourse_js_processor.rb

-/* global rails */
-
-const CONSOLE_PREFIX = "[DiscourseJsProcessor] ";
-globalThis.window = {};
-globalThis.console = {
-  log(...args) {
-    rails.logger.info(CONSOLE_PREFIX + args.join(" "));
-  },
-  warn(...args) {
-    rails.logger.warn(CONSOLE_PREFIX + args.join(" "));
-  },
-  error(...args) {
-    rails.logger.error(CONSOLE_PREFIX + args.join(" "));
-  },
-};
-
+import "./shims";
+import "./postcss";
 import { transform as babelTransform } from "@babel/standalone";
 import HTMLBarsInlinePrecompile from "babel-plugin-ember-template-compilation";
-import { Preprocessor } from "content-tag";
 import DecoratorTransforms from "decorator-transforms";
 import colocatedBabelPlugin from "ember-cli-htmlbars/lib/colocated-babel-plugin";
 import { precompile } from "ember-source/dist/ember-template-compiler";
 import EmberThisFallback from "ember-this-fallback";
-// A sub-dependency of content-tag (getrandom) needs `getRandomValues`
-// so we polyfill it
-import getRandomValues from "polyfill-crypto.getrandomvalues";
 import { minify as terserMinify } from "terser";
 import { WidgetHbsCompiler } from "discourse-widget-hbs/lib/widget-hbs-compiler";
-globalThis.crypto = { getRandomValues };
-import "./postcss";
 import { browsers } from "../discourse/config/targets";
+import { Preprocessor } from "./content-tag";

 const thisFallbackPlugin = EmberThisFallback._buildPlugin({
  enableLogging: false,
--- a/package.json
+++ b/package.json
@ -69,7 +69,6 @@
      "babel-plugin-debug-macros@0.3.4": "patches/babel-plugin-debug-macros@0.3.4.patch",
      "virtual-dom@2.1.1": "patches/virtual-dom@2.1.1.patch",
      "licensee@11.1.1": "patches/licensee@11.1.1.patch",
-      "content-tag@3.1.3": "patches/content-tag@3.1.3.patch",
      "@ember-compat/tracked-built-ins@0.9.1": "patches/@ember-compat__tracked-built-ins@0.9.1.patch",
      "ember-source@5.12.0": "patches/ember-source@5.12.0.patch"
    },
--- a/patches/content-tag@3.1.3.patch
+++ b/patches/content-tag@3.1.3.patch
@ -1,24 +0,0 @@
-diff --git a/pkg/standalone/content_tag.js b/pkg/standalone/content_tag.js
-index ffac649b59d3c00ee025807971082cfea4e1cb2c..511c7ccf57b16e2d95dcd94da737d79ef170387f 100644
--- a/pkg/standalone/content_tag.js
-+++ b/pkg/standalone/content_tag.js
-@@ -1,5 +1,6 @@
- let wasm;
- 
-+const { TextDecoder, TextEncoder } = require('util');
- const cachedTextDecoder = (typeof TextDecoder !== 'undefined' ? new TextDecoder('utf-8', { ignoreBOM: true, fatal: true }) : { decode: () => { throw Error('TextDecoder not available') } } );
- 
- if (typeof TextDecoder !== 'undefined') { cachedTextDecoder.decode(); };
-diff --git a/pkg/standalone.js b/pkg/standalone.js
-index cb50046539df05b41dcc842ffb98e354236f8d26..10eea2962ffd804905d85057bb25d5b30b4d2e11 100644
--- a/pkg/standalone.js
-+++ b/pkg/standalone.js
-@@ -1,5 +1,6 @@
-import init from "./standalone/content_tag.js";
-+import { initSync } from "./standalone/content_tag.js";
-+import module from "./standalone/content_tag_bg.wasm";
- export { Preprocessor  } from "./standalone/content_tag.js";
- 
-await init();
-+initSync(module);
- 
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -11,9 +11,6 @@ patchedDependencies:
  babel-plugin-debug-macros@0.3.4:
    hash: wki6cycbrrm5sscamn5w4cujby
    path: patches/babel-plugin-debug-macros@0.3.4.patch
-  content-tag@3.1.3:
-    hash: lgdkxhmahesfzwpl4vwprolz5m
-    path: patches/content-tag@3.1.3.patch
  ember-source@5.12.0:
    hash: xx7mvsb7nmshqkkqhmf45r3hse
    path: patches/ember-source@5.12.0.patch
@ -1024,9 +1021,6 @@ importers:
      '@csstools/postcss-light-dark-function':
        specifier: ^2.0.8
        version: 2.0.8(postcss@8.5.3)
-      '@zxing/text-encoding':
-        specifier: ^0.9.0
-        version: 0.9.0
      autoprefixer:
        specifier: ^10.4.21
        version: 10.4.21(postcss@8.5.3)
@ -1034,8 +1028,8 @@ importers:
        specifier: ^2.4.1
        version: 2.4.1
      content-tag:
-        specifier: ^3.1.3
-        version: 3.1.3(patch_hash=lgdkxhmahesfzwpl4vwprolz5m)
+        specifier: ^4.0.0
+        version: 4.0.0
      core-js:
        specifier: ^3.42.0
        version: 3.42.0
@ -1057,6 +1051,9 @@ importers:
      ember-this-fallback:
        specifier: ^0.4.0
        version: 0.4.0(patch_hash=znalyv6akdxlqfpmxunrdi3osa)(ember-cli-htmlbars@6.3.0)(ember-source@5.12.0(patch_hash=xx7mvsb7nmshqkkqhmf45r3hse)(@glimmer/component@1.1.2(@babel/core@7.27.1))(@glint/template@1.4.1-unstable.34c4510)(rsvp@4.8.5)(webpack@5.99.8(@swc/core@1.11.24)(esbuild@0.25.4)))
+      fastestsmallesttextencoderdecoder:
+        specifier: ^1.0.22
+        version: 1.0.22
      path-browserify:
        specifier: ^1.0.1
        version: 1.0.1
@ -2855,9 +2852,6 @@ packages:
  '@xtuc/long@4.2.2':
    resolution: {integrity: sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==}

-  '@zxing/text-encoding@0.9.0':
-    resolution: {integrity: sha512-U/4aVJ2mxI0aDNI8Uq0wEhMgY+u4CNtEb0om3+y3+niDAsoTCOB33UF0sxpzqzdqXLqmvc+vZyAt4O8pPdfkwA==}
-
  a11y-dialog@8.1.3:
    resolution: {integrity: sha512-fA1RKuGEeDnfqSUeigf0Yec8SHsn7Qng/V0Tw4lcwbwLl+4bigxqxm8b7UdBhl6cqGmKO/4USRXU1lkCdpW0/g==}

@ -3961,6 +3955,9 @@ packages:
  content-tag@3.1.3:
    resolution: {integrity: sha512-4Kiv9mEroxuMXfWUNUHcljVJgxThCNk7eEswdHMXdzJnkBBaYDqDwzHkoh3F74JJhfU3taJOsgpR6oEGIDg17g==}

+  content-tag@4.0.0:
+    resolution: {integrity: sha512-qqJiY9nueYAI396MOmfOk+w/0KL6ERKxANQcSKcR0CrNTc38yT//b73l+WHr9brZx57bFHNaW7a/6Yll0bn95w==}
+
  content-type@1.0.5:
    resolution: {integrity: sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==}
    engines: {node: '>= 0.6'}
@ -4929,6 +4926,9 @@ packages:
    resolution: {integrity: sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==}
    engines: {node: '>= 4.9.1'}

+  fastestsmallesttextencoderdecoder@1.0.22:
+    resolution: {integrity: sha512-Pb8d48e+oIuY4MaM64Cd7OW1gt4nxCHs7/ddPPZ/Ic3sg8yVGM7O9wDvZ7us6ScaUupzM+pfBolwtYhN1IxBIw==}
+
  fastq@1.19.1:
    resolution: {integrity: sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==}

@ -11226,8 +11226,6 @@ snapshots:

  '@xtuc/long@4.2.2': {}

-  '@zxing/text-encoding@0.9.0': {}
-
  a11y-dialog@8.1.3:
    dependencies:
      focusable-selectors: 0.8.4
@ -12483,11 +12481,13 @@ snapshots:

  content-tag-utils@0.3.1:
    dependencies:
-      content-tag: 3.1.3(patch_hash=lgdkxhmahesfzwpl4vwprolz5m)
+      content-tag: 3.1.3

  content-tag@2.0.3: {}

-  content-tag@3.1.3(patch_hash=lgdkxhmahesfzwpl4vwprolz5m): {}
+  content-tag@3.1.3: {}
+
+  content-tag@4.0.0: {}

  content-type@1.0.5: {}

@ -13118,7 +13118,7 @@ snapshots:
      compression: 1.8.0
      configstore: 5.0.1
      console-ui: 3.1.2
-      content-tag: 3.1.3(patch_hash=lgdkxhmahesfzwpl4vwprolz5m)
+      content-tag: 3.1.3
      core-object: 3.1.5
      dag-map: 2.0.2
      diff: 7.0.0
@ -13420,7 +13420,7 @@ snapshots:
  ember-template-imports@4.3.0:
    dependencies:
      broccoli-stew: 3.0.0
-      content-tag: 3.1.3(patch_hash=lgdkxhmahesfzwpl4vwprolz5m)
+      content-tag: 3.1.3
      ember-cli-version-checker: 5.1.2
    transitivePeerDependencies:
      - supports-color
@ -13436,7 +13436,7 @@ snapshots:
      aria-query: 5.3.2
      chalk: 5.4.1
      ci-info: 4.2.0
-      content-tag: 3.1.3(patch_hash=lgdkxhmahesfzwpl4vwprolz5m)
+      content-tag: 3.1.3
      content-tag-utils: 0.3.1
      date-fns: 3.6.0
      ember-template-recast: 6.1.5
@ -14134,6 +14134,8 @@ snapshots:

  fastest-levenshtein@1.0.16: {}

+  fastestsmallesttextencoderdecoder@1.0.22: {}
+
  fastq@1.19.1:
    dependencies:
      reusify: 1.1.0
@ -15509,7 +15511,7 @@ snapshots:

  lint-to-the-future-ember-template@3.1.0(ember-template-lint@7.6.0(@babel/core@7.27.1)):
    dependencies:
-      content-tag: 3.1.3(patch_hash=lgdkxhmahesfzwpl4vwprolz5m)
+      content-tag: 3.1.3
      debug: 4.4.0(supports-color@8.1.1)
      ember-template-lint: 7.6.0(@babel/core@7.27.1)
      globby: 14.1.0
@ -16566,7 +16568,7 @@ snapshots:
  prettier-plugin-ember-template-tag@2.0.5(prettier@3.5.3):
    dependencies:
      '@babel/core': 7.27.1(supports-color@8.1.1)
-      content-tag: 3.1.3(patch_hash=lgdkxhmahesfzwpl4vwprolz5m)
+      content-tag: 3.1.3
      prettier: 3.5.3
    transitivePeerDependencies:
      - supports-color