preact SSR #6518
Description
Describe the bug
Trying to setup a fresh framework with ui5 component. When I used ThemeProvider I get the following error:
error: Uncaught (in promise) ReferenceError: HTMLElement is not defined
at https://esm.sh/v135/@ui5/webcomponents-base@2.3.0/X-ZS9yZWFjdCxyZWFjdC1kb20/denonext/dist/UI5Element.js:2:3633
Looks like ui5 is trying to attach the ui5 webcomponent on the server itself.
Isolated Example
No response
Reproduction steps
deno.json
"imports": {
"fresh": "jsr:@fresh/core@^2.0.0-alpha.22",
"@fresh/plugin-tailwind": "jsr:@fresh/plugin-tailwind@^0.0.1-alpha.7",
"@ui5/webcomponents-react": "https://esm.sh/@ui5/webcomponents-react@2.3.1?external=react,react-dom",
"preact": "npm:preact@^10.24.3",
"@preact/signals": "npm:@preact/signals@^1.3.0",
"tailwindcss": "npm:tailwindcss@3.4.14",
"tailwindcss/plugin": "npm:tailwindcss@3.4.14/plugin.js",
"react": "npm:preact@10.24.3/compat",
"react-dom": "npm:preact@10.24.3/compat"
},_app.tsx
import type { PageProps } from "fresh";
import { ThemeProvider } from "@ui5/webcomponents-react";
export default function App({ Component }: PageProps) {
return (
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>fresh-project</title>
<link rel="stylesheet" href="/styles.css" />
</head>
<body>
<ThemeProvider staticCssInjected>
<Component />
</ThemeProvider>
</body>
</html>
);
}Expected Behaviour
No response
Screenshots or Videos
No response
UI5 Web Components for React Version
2.3.1
UI5 Web Components Version
2.3.0
Browser
Chrome
Operating System
No response
Additional Context
No response
Relevant log output
No response
Organization
No response
Declaration
- I’m not disclosing any internal or sensitive information.