search

sveltejs / svelte

Cybernetically enhanced web apps
https://svelte.dev
MIT License
78.59k stars 4.12k forks source link

`TypeError` while mounting Svelte app in a Firefox content script (web extension) #13414

Open HectorxH opened 4 days ago

HectorxH commented 4 days ago

Describe the bug

While trying to mount a component using bits-ui I get the error TypeError: proto2 is null, the same doesn't happen when using a simpler component, neither while using Chrome. Looking at the debugger I found that this exception is triggered when Svelte tries to read the name of the constructor from an HTMLElement prototype here.

Making a smaller test I found out that Object.getPrototypeOf(document.createElement("div")).constructor.name is undefined for any content script in Firefox. This is probably related to the Xray vision isolation mechanism for extensions.

Reproduction

https://github.com/HectorxH/svelte-firefox-webext-bug

Installing the extension from /dist and opening github should replicate the issue.

Logs

No response

System Info

System:
    OS: Linux 5.15 NixOS 24.05 (Uakari) 24.05 (Uakari)
    CPU: (16) x64 AMD Ryzen 9 5900HX with Radeon Graphics
    Memory: 5.27 GB / 6.71 GB
    Container: Yes
    Shell: 5.2.26 - /nix/store/pg0zqlym7y3cd8631b3x6cghxcmjl8xa-bash-interactive-5.2p26/bin/bash
  Binaries:
    Node: 22.4.1 - /nix/store/k299g2zc7psy64kx3vj6c4v5m4g8s5z4-nodejs-22.4.1/bin/node
    npm: 10.8.1 - /nix/store/k299g2zc7psy64kx3vj6c4v5m4g8s5z4-nodejs-22.4.1/bin/npm
  npmPackages:
    svelte: ^5.0.0-next.259 => 5.0.0-next.259

Severity

blocking all usage of svelte

HectorxH commented 4 days ago

A workaround I found in the meanwhile is to manually re define this field at the beginning of the content script:

Object.getPrototypeOf(Element).prototype.constructor.name = "Element";