error when component uses context #1
Description
i have some components using context, and when i try SSR in astro i get the following error logged in the CLI terminal:
ReferenceError: CustomEvent is not defined
at dispatchEvent (file:///path/to/project/node_modules/atomico/src/element/set-prototype.js:112:20)
at ref.<computed> (file:///path/to/project/node_modules/atomico/src/hooks/custom-hooks/use-event.js:11:13)
at detectValueFromProvider (file:///path/to/project/node_modules/atomico/src/context.js:52:9)
at file:///path/to/project/node_modules/atomico/src/hooks/hooks.js:19:23
at setState (file:///path/to/project/node_modules/atomico/src/hooks/state.js:15:17)
at new State (file:///path/to/project/node_modules/atomico/src/hooks/state.js:21:9)
at file:///path/to/project/node_modules/atomico/src/hooks/hooks.js:17:21
at useHook (file:///path/to/project/node_modules/atomico/src/hooks/create-hooks.js:41:18)
at useState (file:///path/to/project/node_modules/atomico/src/hooks/hooks.js:15:12)
at useConsumer (file:///path/to/project/node_modules/atomico/src/context.js:62:55)
which surfaces in the browser as an astro error:
{"message":"The value defined for prop 'offset' must be of type 'Number'","target":{"dataset":{},"_props":{"offset":0},"mounted":{},"unmounted":{},"updated":{}},"value":"0"}
where offset is a prop in my component that consumes the context.
my astro config looks like this:
import { defineConfig } from "astro/config";
import Atomico from "@atomico/astro";
// https://astro.build/config
export default defineConfig({
integrations: [Atomico()],
});and my astro page looks like:
---
import "./path/to/components.js"
---
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<my-provider>
<my-consumer></my-consumer>
</my-provider>
</body>
</html>
<script>
import "./path/to/components.js"
</script>