diff --git a/bin/esbuild.mjs b/bin/esbuild.mjs index 9360d5bb..e2242ee5 100644 --- a/bin/esbuild.mjs +++ b/bin/esbuild.mjs @@ -145,13 +145,13 @@ if (config.isDemoClient) { outfile: 'demo/dist/client-bundle.js', external: ['util', 'os', 'fs', 'path', 'stream', 'Terminal'], alias: { + // Library ESM imports "@xterm/xterm": ".", "@xterm/addon-attach": "./addons/addon-attach/lib/xterm-addon-attach.mjs", "@xterm/addon-canvas": "./addons/addon-canvas/lib/xterm-addon-canvas.mjs", "@xterm/addon-clipboard": "./addons/addon-clipboard/lib/xterm-addon-clipboard.mjs", "@xterm/addon-fit": "./addons/addon-fit/lib/xterm-addon-fit.mjs", "@xterm/addon-image": "./addons/addon-image/lib/xterm-addon-image.mjs", - // "@xterm/addon-ligatures": "./addons/addon-ligatures/lib/xterm-addon-ligatures.js", "@xterm/addon-search": "./addons/addon-search/lib/xterm-addon-search.mjs", "@xterm/addon-serialize": "./addons/addon-serialize/lib/xterm-addon-serialize.mjs", "@xterm/addon-web-links": "./addons/addon-web-links/lib/xterm-addon-web-links.mjs", @@ -159,8 +159,12 @@ if (config.isDemoClient) { "@xterm/addon-unicode11": "./addons/addon-unicode11/lib/xterm-addon-unicode11.mjs", "@xterm/addon-unicode-graphemes": "./addons/addon-unicode-graphemes/lib/xterm-addon-unicode-graphemes.mjs", - // Needed for out-tsc based image addon - "common/Lifecycle": "./src/common/Lifecycle.ts", + // Non-bundled ESM imports + // HACK: Ligatures imports fs which in the esbuild bundle resolves at runtime _on startup_ + // instead of only when it's needed. This causes a `Dynamic require of "fs" is not + // supported` exception to be thrown. So the unbundled out-esbuild sources are used + // instead of the .mjs file which seems to resolve the issue. + "@xterm/addon-ligatures": "./addons/addon-ligatures/out-esbuild/LigaturesAddon", } } }; diff --git a/demo/client.ts b/demo/client.ts index 5aa961c6..0e794f3e 100644 --- a/demo/client.ts +++ b/demo/client.ts @@ -8,9 +8,6 @@ /// -// TODO: Move to regular import, currently it complains about the `fs` module -import { LigaturesAddon } from '../addons/addon-ligatures/out-esbuild/LigaturesAddon'; - // HACK: Playwright/WebKit on Windows does not support WebAssembly https://stackoverflow.com/q/62311688/1156119 import type { ImageAddon as ImageAddonType, IImageAddonOptions } from '@xterm/addon-image'; let ImageAddon: typeof ImageAddonType | undefined; // eslint-disable-line @typescript-eslint/naming-convention @@ -24,7 +21,7 @@ import { AttachAddon } from '@xterm/addon-attach'; import { CanvasAddon } from '@xterm/addon-canvas'; import { ClipboardAddon } from '@xterm/addon-clipboard'; import { FitAddon } from '@xterm/addon-fit'; -// import { LigaturesAddon } from '@xterm/addon-ligatures'; +import { LigaturesAddon } from '@xterm/addon-ligatures'; import { SearchAddon, ISearchOptions } from '@xterm/addon-search'; import { SerializeAddon } from '@xterm/addon-serialize'; import { WebLinksAddon } from '@xterm/addon-web-links'; @@ -620,15 +617,15 @@ function initAddons(term: Terminal): void { term.unicode.activeVersion = '15-graphemes'; } if (name === 'search' && checkbox.checked) { - addon.instance.onDidChangeResults(e => updateFindResults(e)); + addons[name].instance.onDidChangeResults(e => updateFindResults(e)); } addDomListener(checkbox, 'change', () => { if (name === 'image') { if (checkbox.checked) { const ctorOptionsJson = document.querySelector('#image-options').value; addon.instance = ctorOptionsJson - ? new addon.ctor(JSON.parse(ctorOptionsJson)) - : new addon.ctor(); + ? new addons[name].ctor(JSON.parse(ctorOptionsJson)) + : new addons[name].ctor(); term.loadAddon(addon.instance); } else { addon.instance!.dispose(); @@ -637,7 +634,8 @@ function initAddons(term: Terminal): void { return; } if (checkbox.checked) { - addon.instance = new addon.ctor(); + // HACK: Manually remove addons that cannot be changes + addon.instance = new (addon as IDemoAddon>).ctor(); try { term.loadAddon(addon.instance); if (name === 'webgl') { @@ -657,7 +655,7 @@ function initAddons(term: Terminal): void { } else if (name === 'unicodeGraphemes') { term.unicode.activeVersion = '15-graphemes'; } else if (name === 'search') { - addon.instance.onDidChangeResults(e => updateFindResults(e)); + addons[name].instance.onDidChangeResults(e => updateFindResults(e)); } } catch {