[xterm v5.1/5.2] Can't work with xterm above than v5.1 since the error indicates e.replaceChildren is not a function

[hongdyu]

When integrating the xterm in the electron+vue project on the windows platform.
It works well with xterm prior to v5.1. However, it returns the below error when update the xterm verison to 5.1 or 5.2:

Uncaught TypeError: e.replaceChildren is not a function

Work Environment

• Windows client
• OS version: windows10
• xterm.js version: v5.1/5.2
• xterm-addon-fit: v0.7

Refer to xterm in project

const term = new Terminal({
scrollback: 9999,
theme: darkTheme,
cursorBlink: true,
cursorStyle: 'bar',
cursorBarWidth: 3
});

const fitAddon = new FitAddon();
term.loadAddon(fitAddon);
term.open(document.getElementById("terminal"));
fitAddon.fit();

Can anyone help to look this issue and point out where the mistake is? Thanks for your kindly help.

[Tyriar]

What browser/version are you on?

[hongdyu]

Instead of using a browser, this library is used in the electron desktop client.
Actually in electron, the client is configured to work with the latest two version of most major browsers:
"browserslist": [
"> 1%",
"last 2 versions"
]

eg:
Chrome: v114/113
Edge: v114/113
Firefox: v113

[Tyriar]

What version of Electron are you on? The version of Electron uses a particular version of Chromium underneath which is very likely a version earlier than the last 2 versions.

[jerch]

@hongdyu Can you step debug this? What is e right before the exception happens?

Why I am asking - some frameworks do nasty rewrites of certain event handlers to fit their own DOM handling idea, so its not really safe to assume that e is actually a real DOM node, where replaceChildren is implemented. On the other hand that method is really long part of official DOM API (since Chrome 86), so it seems very unlikely, that you are on a pre-chrome-86 electron version (even electron 11 already shipped with chrome 87 in 2020).

[hongdyu]

Hi Tyriar & jerch,
Sorry for not replying in time.
oh, I'm using a very old version of electron: v6.0.11 and vue v2.6.10.

btw, it also use the local-echo library to display message and support most of bash-like input primitives.

[jerch]

Well from there you have several options - either upgrade electron (which I'd recommend, since this is also about security patches). If thats not viable and you need a hotfix, maybe check babel for a polyfill or write your own (like this one).

Last but not least, you can also revert the change (see #4217) and maintain your own copy of xterm.js, but that more involved to keep in sync in the long run.