diff --git a/examples/integrations-playground/astro.config.mjs b/examples/integrations-playground/astro.config.mjs index a1f21fe0b..2859263ad 100644 --- a/examples/integrations-playground/astro.config.mjs +++ b/examples/integrations-playground/astro.config.mjs @@ -1,12 +1,13 @@ import { defineConfig } from 'astro/config'; - import lit from '@astrojs/lit'; import react from '@astrojs/react'; import tailwind from '@astrojs/tailwind'; import turbolinks from '@astrojs/turbolinks'; import sitemap from '@astrojs/sitemap'; import partytown from '@astrojs/partytown'; +import solid from "@astrojs/solid-js"; +// https://astro.build/config export default defineConfig({ - integrations: [lit(), react(), tailwind(), turbolinks(), partytown(), sitemap()], -}); + integrations: [lit(), react(), tailwind(), turbolinks(), partytown(), sitemap(), solid()] +}); \ No newline at end of file diff --git a/examples/integrations-playground/package.json b/examples/integrations-playground/package.json index 023ae1c07..af39d140e 100644 --- a/examples/integrations-playground/package.json +++ b/examples/integrations-playground/package.json @@ -13,9 +13,11 @@ "@astrojs/partytown": "^0.1.2", "@astrojs/react": "^0.1.1", "@astrojs/sitemap": "^0.1.0", + "@astrojs/solid-js": "0.1.2", "@astrojs/tailwind": "^0.2.1", "@astrojs/turbolinks": "^0.1.2", - "astro": "^1.0.0-beta.27" + "astro": "^1.0.0-beta.27", + "solid-js": "^1.3.6" }, "dependencies": { "@webcomponents/template-shadowroot": "^0.1.0", @@ -23,7 +25,6 @@ "preact": "^10.7.1", "react": "^18.0.0", "react-dom": "^18.0.0", - "solid-js": "^1.3.16", "svelte": "^3.47.0", "vue": "^3.2.33" } diff --git a/examples/integrations-playground/src/components/Link.jsx b/examples/integrations-playground/src/components/Link.jsx index 2758df130..040d112c3 100644 --- a/examples/integrations-playground/src/components/Link.jsx +++ b/examples/integrations-playground/src/components/Link.jsx @@ -1,3 +1,6 @@ +/* jsxImportSource: react */ +import React from 'react'; + export default function Link({ to, text }) { return {text}; } diff --git a/examples/integrations-playground/src/components/SolidCounter.jsx b/examples/integrations-playground/src/components/SolidCounter.jsx new file mode 100644 index 000000000..4453b881c --- /dev/null +++ b/examples/integrations-playground/src/components/SolidCounter.jsx @@ -0,0 +1,18 @@ +import { createSignal } from 'solid-js'; + +export default function Counter(props) { + const [count, setCount] = createSignal(0); + const add = () => setCount(count() + 1); + const subtract = () => setCount(count() - 1); + + return ( + <> +
+ + 
{count()}
+ +
+
{props.children}
+ + ); +} diff --git a/examples/integrations-playground/src/pages/index.astro b/examples/integrations-playground/src/pages/index.astro index 2ee717d6a..06c9aa3d8 100644 --- a/examples/integrations-playground/src/pages/index.astro +++ b/examples/integrations-playground/src/pages/index.astro @@ -1,8 +1,9 @@ --- import Lorem from '../components/Lorem.astro'; import Link from '../components/Link.jsx'; +import SolidCounter from '../components/SolidCounter.jsx'; import '../components/Test.js'; -import '../components/Counter.js'; +import '../components/Counter.js'; --- @@ -14,20 +15,19 @@ import '../components/Counter.js';

Test app

- Party Mode! + Party Mode! Colors changing = partytown is enabled

+ - - diff --git a/packages/astro/src/runtime/server/index.ts b/packages/astro/src/runtime/server/index.ts index 73c13c139..13d408f97 100644 --- a/packages/astro/src/runtime/server/index.ts +++ b/packages/astro/src/runtime/server/index.ts @@ -201,13 +201,22 @@ Did you mean to add ${formatList(probableRendererNames.map((r) => '`' + r + '`') // Call the renderers `check` hook to see if any claim this component. let renderer: SSRLoadedRenderer | undefined; if (metadata.hydrate !== 'only') { + let error; for (const r of renderers) { - if (await r.ssr.check(Component, props, children)) { - renderer = r; - break; + try { + if (await r.ssr.check(Component, props, children)) { + renderer = r; + break; + } + } catch (e) { + error ??= e; } } + if (error) { + throw error; + } + if (!renderer && typeof HTMLElement === 'function' && componentIsHTMLElement(Component)) { const output = renderHTMLElement(result, Component as typeof HTMLElement, _props, slots); diff --git a/packages/integrations/solid/server.js b/packages/integrations/solid/server.js index 636fa50f6..dc4f88227 100644 --- a/packages/integrations/solid/server.js +++ b/packages/integrations/solid/server.js @@ -2,12 +2,8 @@ import { renderToString, ssr, createComponent } from 'solid-js/web'; function check(Component, props, children) { if (typeof Component !== 'function') return false; - try { - const { html } = renderToStaticMarkup(Component, props, children); - return typeof html === 'string'; - } catch (err) { - return false; - } + const { html } = renderToStaticMarkup(Component, props, children); + return typeof html === 'string'; } function renderToStaticMarkup(Component, props, children) { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 8cc31f697..29b9251f0 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -245,6 +245,7 @@ importers: '@astrojs/partytown': ^0.1.2 '@astrojs/react': ^0.1.1 '@astrojs/sitemap': ^0.1.0 + '@astrojs/solid-js': 0.1.2 '@astrojs/tailwind': ^0.2.1 '@astrojs/turbolinks': ^0.1.2 '@webcomponents/template-shadowroot': ^0.1.0 @@ -253,7 +254,7 @@ importers: preact: ^10.7.1 react: ^18.0.0 react-dom: ^18.0.0 - solid-js: ^1.3.16 + solid-js: ^1.3.6 svelte: ^3.47.0 vue: ^3.2.33 dependencies: @@ -262,7 +263,6 @@ importers: preact: 10.7.1 react: 18.0.0 react-dom: 18.0.0_react@18.0.0 - solid-js: 1.3.16 svelte: 3.47.0 vue: 3.2.33 devDependencies: @@ -270,9 +270,11 @@ importers: '@astrojs/partytown': link:../../packages/integrations/partytown '@astrojs/react': link:../../packages/integrations/react '@astrojs/sitemap': link:../../packages/integrations/sitemap + '@astrojs/solid-js': link:../../packages/integrations/solid '@astrojs/tailwind': link:../../packages/integrations/tailwind '@astrojs/turbolinks': link:../../packages/integrations/turbolinks astro: link:../../packages/astro + solid-js: 1.3.16 examples/minimal: specifiers: