38 lines
1.2 KiB
JavaScript
38 lines
1.2 KiB
JavaScript
import LogBoxInspectorContainer from '@expo/log-box/src/logbox-web-polyfill';
|
|
import { AppRegistry } from 'react-native';
|
|
|
|
registerRootComponentInShadowDOM(LogBoxInspectorContainer);
|
|
|
|
function registerRootComponentInShadowDOM(component) {
|
|
AppRegistry.registerComponent('main', () => component);
|
|
|
|
if (process.env.EXPO_OS !== 'web' || !window) {
|
|
console.error('expo-router/_error can be rendered only on Web.');
|
|
return;
|
|
}
|
|
|
|
const host = window.document.getElementById('root');
|
|
if (!host) {
|
|
throw new Error('Required HTML element with id "root" was not found in the document HTML.');
|
|
}
|
|
|
|
const shadow = host.attachShadow({ mode: 'open' });
|
|
const rootTag = window.document.createElement('div');
|
|
rootTag.id = 'shadow-root';
|
|
shadow.appendChild(rootTag);
|
|
|
|
AppRegistry.runApplication('main', {
|
|
rootTag,
|
|
});
|
|
|
|
// NOTE(@krystofwoldrich): Same as `react-native-stylesheet`
|
|
// I would expect the loaded css to be attached to the shadow host (not document head)
|
|
// For now we need to copy the styles manually
|
|
window.document.querySelectorAll('style').forEach((styleEl) => {
|
|
const isHmrLoadedCss = !!styleEl.getAttribute('data-expo-css-hmr');
|
|
if (isHmrLoadedCss) {
|
|
shadow.appendChild(styleEl.cloneNode(true));
|
|
}
|
|
});
|
|
}
|