From d213cd1b0045d5bb74169042ecd18a2fb899942c Mon Sep 17 00:00:00 2001 From: David Taylor Date: Mon, 12 May 2025 17:54:48 +0100 Subject: [PATCH] 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 --- .../javascripts/theme-transpiler/build.js | 1 - .../theme-transpiler/content-tag.js | 9 ++++ .../javascripts/theme-transpiler/package.json | 4 +- .../javascripts/theme-transpiler/shims.js | 29 +++++++++++++ .../theme-transpiler/transpiler.js | 25 ++--------- package.json | 1 - patches/content-tag@3.1.3.patch | 24 ----------- pnpm-lock.yaml | 42 ++++++++++--------- 8 files changed, 65 insertions(+), 70 deletions(-) create mode 100644 app/assets/javascripts/theme-transpiler/content-tag.js create mode 100644 app/assets/javascripts/theme-transpiler/shims.js delete mode 100644 patches/content-tag@3.1.3.patch diff --git a/app/assets/javascripts/theme-transpiler/build.js b/app/assets/javascripts/theme-transpiler/build.js index 5619ad53120..4cb4a36fbc8 100644 --- 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", diff --git a/app/assets/javascripts/theme-transpiler/content-tag.js b/app/assets/javascripts/theme-transpiler/content-tag.js new file mode 100644 index 00000000000..3b2bebe1a8e --- /dev/null +++ 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); diff --git a/app/assets/javascripts/theme-transpiler/package.json b/app/assets/javascripts/theme-transpiler/package.json index 67cdf101367..15ac94dbd75 100644 --- 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", diff --git a/app/assets/javascripts/theme-transpiler/shims.js b/app/assets/javascripts/theme-transpiler/shims.js new file mode 100644 index 00000000000..e6470c5884d --- /dev/null +++ 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 }; diff --git a/app/assets/javascripts/theme-transpiler/transpiler.js b/app/assets/javascripts/theme-transpiler/transpiler.js index 32a02cc9423..962b39c34da 100644 --- 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, diff --git a/package.json b/package.json index 31d7b041cff..935f3756570 100644 --- 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" }, diff --git a/patches/content-tag@3.1.3.patch b/patches/content-tag@3.1.3.patch deleted file mode 100644 index 70d6c29a93b..00000000000 --- a/patches/content-tag@3.1.3.patch +++ /dev/null @@ -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); - diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 437d1e37f08..1e6403d8514 100644 --- 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