diff --git a/example/App.js b/example/App.js index 524e90d..84d35cc 100644 --- a/example/App.js +++ b/example/App.js @@ -1,4 +1,6 @@ import Brahmos, { Suspense, lazy } from '../src'; +// adding debug for react devtool support +import '../src/debug'; import TodoList from './TodoList'; import UseStateExample from './UseStateExample'; diff --git a/src/debug/devtool/index.js b/src/debug/devtool/index.js new file mode 100644 index 0000000..a19cc05 --- /dev/null +++ b/src/debug/devtool/index.js @@ -0,0 +1,36 @@ +export function initDevTools() { + // rdtHook -> React Devtools hook + const rdtHook = (window).__REACT_DEVTOOLS_GLOBAL_HOOK__; + + // the developer has not installed react devtools + if(rdtHook == null) return; + + catchErrors(() => { + let isDev = false; + + try { + isDev = process.env.NODE_ENV !== 'production'; + } + catch {} + + window.parent.postMessage({ + source: 'react-devtools-detector', + reactBuildType: isDev + ? 'development' + : 'production' + }, + '*'); + })(); +} + +function catchErrors(fn) { + return function(...args) { + try { + fn(args); + } + catch(e) { + console.error(`React Devtools encountered an error`); + console.error(e); + } + }; +} \ No newline at end of file diff --git a/src/debug/index.js b/src/debug/index.js new file mode 100644 index 0000000..9090203 --- /dev/null +++ b/src/debug/index.js @@ -0,0 +1,3 @@ +import { initDevTools } from './devtool'; + +initDevTools(); \ No newline at end of file