2022-03-18 17:35:45 -05:00
|
|
|
import { h, Component as BaseComponent } from 'preact';
|
|
|
|
import render from 'preact-render-to-string';
|
|
|
|
import StaticHtml from './static-html.js';
|
|
|
|
|
2022-06-23 10:12:46 -05:00
|
|
|
const slotName = (str) => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase());
|
2022-06-23 10:10:54 -05:00
|
|
|
|
2022-06-30 07:10:56 -05:00
|
|
|
let originalConsoleError;
|
|
|
|
let consoleFilterRefs = 0;
|
|
|
|
|
2022-03-18 17:35:45 -05:00
|
|
|
function check(Component, props, children) {
|
|
|
|
if (typeof Component !== 'function') return false;
|
|
|
|
|
|
|
|
if (Component.prototype != null && typeof Component.prototype.render === 'function') {
|
|
|
|
return BaseComponent.isPrototypeOf(Component);
|
|
|
|
}
|
|
|
|
|
2022-06-30 07:10:56 -05:00
|
|
|
useConsoleFilter();
|
|
|
|
|
2022-03-18 17:35:45 -05:00
|
|
|
try {
|
2022-06-30 07:10:56 -05:00
|
|
|
try {
|
|
|
|
const { html } = renderToStaticMarkup(Component, props, children);
|
|
|
|
if (typeof html !== 'string') {
|
|
|
|
return false;
|
|
|
|
}
|
2022-03-18 17:35:45 -05:00
|
|
|
|
2022-06-30 07:10:56 -05:00
|
|
|
// There are edge cases (SolidJS) where Preact *might* render a string,
|
|
|
|
// but components would be <undefined></undefined>
|
2022-03-18 17:35:45 -05:00
|
|
|
|
2022-06-30 07:10:56 -05:00
|
|
|
return !/\<undefined\>/.test(html);
|
|
|
|
} catch (err) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
} finally {
|
|
|
|
finishUsingConsoleFilter();
|
2022-03-18 17:35:45 -05:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-06-23 10:10:54 -05:00
|
|
|
function renderToStaticMarkup(Component, props, { default: children, ...slotted }) {
|
|
|
|
const slots = {};
|
|
|
|
for (const [key, value] of Object.entries(slotted)) {
|
|
|
|
const name = slotName(key);
|
|
|
|
slots[name] = h(StaticHtml, { value, name });
|
|
|
|
}
|
|
|
|
// Note: create newProps to avoid mutating `props` before they are serialized
|
2022-06-23 10:12:46 -05:00
|
|
|
const newProps = { ...props, ...slots };
|
2022-03-18 17:35:45 -05:00
|
|
|
const html = render(
|
2022-06-23 10:10:54 -05:00
|
|
|
h(Component, newProps, children != null ? h(StaticHtml, { value: children }) : children)
|
2022-03-18 17:35:45 -05:00
|
|
|
);
|
|
|
|
return { html };
|
|
|
|
}
|
|
|
|
|
2022-06-30 07:10:56 -05:00
|
|
|
/**
|
|
|
|
* Reduces console noise by filtering known non-problematic errors.
|
2022-06-30 07:12:27 -05:00
|
|
|
*
|
2022-06-30 07:10:56 -05:00
|
|
|
* Performs reference counting to allow parallel usage from async code.
|
2022-06-30 07:12:27 -05:00
|
|
|
*
|
2022-06-30 07:10:56 -05:00
|
|
|
* To stop filtering, please ensure that there always is a matching call
|
|
|
|
* to `finishUsingConsoleFilter` afterwards.
|
|
|
|
*/
|
|
|
|
function useConsoleFilter() {
|
|
|
|
consoleFilterRefs++;
|
|
|
|
|
|
|
|
if (!originalConsoleError) {
|
|
|
|
// eslint-disable-next-line no-console
|
|
|
|
originalConsoleError = console.error;
|
|
|
|
|
|
|
|
try {
|
|
|
|
// eslint-disable-next-line no-console
|
|
|
|
console.error = filteredConsoleError;
|
|
|
|
} catch (error) {
|
|
|
|
// If we're unable to hook `console.error`, just accept it
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Indicates that the filter installed by `useConsoleFilter`
|
|
|
|
* is no longer needed by the calling code.
|
|
|
|
*/
|
|
|
|
function finishUsingConsoleFilter() {
|
|
|
|
consoleFilterRefs--;
|
|
|
|
|
|
|
|
// Note: Instead of reverting `console.error` back to the original
|
|
|
|
// when the reference counter reaches 0, we leave our hook installed
|
|
|
|
// to prevent potential race conditions once `check` is made async
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Hook/wrapper function for the global `console.error` function.
|
2022-06-30 07:12:27 -05:00
|
|
|
*
|
2022-06-30 07:10:56 -05:00
|
|
|
* Ignores known non-problematic errors while any code is using the console filter.
|
|
|
|
* Otherwise, simply forwards all arguments to the original function.
|
|
|
|
*/
|
|
|
|
function filteredConsoleError(msg, ...rest) {
|
|
|
|
if (consoleFilterRefs > 0 && typeof msg === 'string') {
|
|
|
|
// In `check`, we attempt to render JSX components through Preact.
|
|
|
|
// When attempting this on a React component, React may output
|
|
|
|
// the following error, which we can safely filter out:
|
|
|
|
const isKnownReactHookError =
|
|
|
|
msg.includes('Warning: Invalid hook call.') &&
|
|
|
|
msg.includes('https://reactjs.org/link/invalid-hook-call');
|
2022-06-30 07:12:27 -05:00
|
|
|
if (isKnownReactHookError) return;
|
2022-06-30 07:10:56 -05:00
|
|
|
}
|
|
|
|
originalConsoleError(msg, ...rest);
|
|
|
|
}
|
|
|
|
|
2022-03-18 17:35:45 -05:00
|
|
|
export default {
|
|
|
|
check,
|
|
|
|
renderToStaticMarkup,
|
|
|
|
};
|