0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2024-12-23 21:53:55 -05:00
astro/packages/integrations/react/server.js
Fred K. Schott 57f48b2701
Add support for React 18 in @astrojs/react (#2947)
* First pass at supporting React 18 in @astrojs/react

* Try marking React 18’s `react-dom/client` as external

* Try a different approach to importing different React versions

* Allow resolving JSON modules

* Revert "Allow resolving JSON modules"

This reverts commit 5279b7249c.

* Try the separate client entrypoint approach from #2946

* Clean up diff

* Trying to see something

* Just keep swimming… 🐠

* update to support react 18

* add changeset

* add docs

Co-authored-by: delucis <swithinbank@gmail.com>
2022-03-31 12:51:29 -04:00

67 lines
1.8 KiB
JavaScript

import React from 'react';
import ReactDOM from 'react-dom/server';
import StaticHtml from './static-html.js';
const reactTypeof = Symbol.for('react.element');
function errorIsComingFromPreactComponent(err) {
return err.message && (err.message.startsWith("Cannot read property '__H'") || err.message.includes("(reading '__H')"));
}
function check(Component, props, children) {
// Note: there are packages that do some unholy things to create "components".
// Checking the $$typeof property catches most of these patterns.
if (typeof Component === 'object') {
const $$typeof = Component['$$typeof'];
return $$typeof && $$typeof.toString().slice('Symbol('.length).startsWith('react');
}
if (typeof Component !== 'function') return false;
if (Component.prototype != null && typeof Component.prototype.render === 'function') {
return React.Component.isPrototypeOf(Component) || React.PureComponent.isPrototypeOf(Component);
}
let error = null;
let isReactComponent = false;
function Tester(...args) {
try {
const vnode = Component(...args);
if (vnode && vnode['$$typeof'] === reactTypeof) {
isReactComponent = true;
}
} catch (err) {
if (!errorIsComingFromPreactComponent(err)) {
error = err;
}
}
return React.createElement('div');
}
renderToStaticMarkup(Tester, props, children, {});
if (error) {
throw error;
}
return isReactComponent;
}
function renderToStaticMarkup(Component, props, children, metadata) {
delete props['class'];
const vnode = React.createElement(Component, {
...props,
children: children != null ? React.createElement(StaticHtml, { value: children }) : undefined,
});
let html;
if (metadata && metadata.hydrate) {
html = ReactDOM.renderToString(vnode);
} else {
html = ReactDOM.renderToStaticMarkup(vnode);
}
return { html };
}
export default {
check,
renderToStaticMarkup,
};