Instalation: Chrome Plugin: TypeError: Cannot read properties of null (reading 'get')

[Nichtmetall]

Describe the bug

Hi guys, I get an error when I try to use UI5 React components. I am building a chrome plugin with Plasmo (https://www.plasmo.com/) and would like to use SAP UI5 as UI framework for it. Installation and build works fine. However, I get an error message when I go to the page where the extension is used.

Error Message:

Uncaught TypeError: Cannot read properties of null (reading 'get')
    at kAYYQ.@parcel/transformer-js/src/esmodule-helpers.js (menuButton.4e23c9af.js:39617:21)
    at newRequire (menuButton.4e23c9af.js:72:24)
    at localRequire (menuButton.4e23c9af.js:85:35)
    at hGJRF../StaticArea.js (menuButton.4e23c9af.js:39523:21)
    at newRequire (menuButton.4e23c9af.js:72:24)
    at localRequire (menuButton.4e23c9af.js:85:35)
    at 426P1.@ui5/webcomponents-base/dist/ssr-dom.js (menuButton.4e23c9af.js:38285:25)
    at newRequire (menuButton.4e23c9af.js:72:24)
    at localRequire (menuButton.4e23c9af.js:85:35)
    at ekBB0.@ui5/webcomponents-base/dist/Device.js (menuButton.4e23c9af.js:37978:21)

menuButton.tsx:

import "@ui5/webcomponents/dist/Assets"
import "@ui5/webcomponents-react/dist/Assets"

import { Button, ThemeProvider } from "@ui5/webcomponents-react"
import type { PlasmoGetInlineAnchor } from "plasmo"

export const config = {
  matches: ["https://blank.org/*"]
}

export const getInlineAnchor: PlasmoGetInlineAnchor = () =>
  document.querySelector("body")

const PlasmoInline = () => {
  return (
    <ThemeProvider>
      <div>
        <Button>Hello world!</Button>
      </div>
    </ThemeProvider>
  )
}

export default PlasmoInline

package.json:

"@ui5/webcomponents": "~1.24.0",
"@ui5/webcomponents-fiori": "~1.24.0",
"@ui5/webcomponents-react": "^1.27.0",

manifest:

"host_permissions": [
      "https://*/*",
      "http://*/*"
    ],
    "permissions": [
      "tabs",
      "activeTab",
      "storage",
      "scripting"
    ],
    "web_accessible_resources": [
      {
        "resources": [
          "@ui5/webcomponents/dist/Assets.js",
          "@ui5/webcomponents-react/dist/Assets.js",
          "@ui5/webcomponents-fiori/dist/Assets.js"
        ],
        "matches": [
          "<all_urls>"
        ]
      }
    ]

Unfortunately, I can't figure out what the problem might be. Maybe one of you can help me.

Isolated Example

No response

Reproduction steps

1. Install all packages
2. Build project
3. Open Page

Expected Behaviour

Button is showing

Screenshots or Videos

No response

UI5 Web Components for React Version

^1.27.0

UI5 Web Components Version

~1.24.0

Browser

Chrome

Operating System

Windows

Additional Context

No response

Relevant log output

Uncaught TypeError: Cannot read properties of null (reading 'get')
    at kAYYQ.@parcel/transformer-js/src/esmodule-helpers.js (menuButton.4e23c9af.js:39617:21)
    at newRequire (menuButton.4e23c9af.js:72:24)
    at localRequire (menuButton.4e23c9af.js:85:35)
    at hGJRF../StaticArea.js (menuButton.4e23c9af.js:39523:21)
    at newRequire (menuButton.4e23c9af.js:72:24)
    at localRequire (menuButton.4e23c9af.js:85:35)
    at 426P1.@ui5/webcomponents-base/dist/ssr-dom.js (menuButton.4e23c9af.js:38285:25)
    at newRequire (menuButton.4e23c9af.js:72:24)
    at localRequire (menuButton.4e23c9af.js:85:35)
    at ekBB0.@ui5/webcomponents-base/dist/Device.js (menuButton.4e23c9af.js:37978:21)

Organization

No response

Declaration

• [x] I’m not disclosing any internal or sensitive information.