Skip to content

Commit

Permalink
fix: properly handle render errors in 'react' driver.
Browse files Browse the repository at this point in the history
  • Loading branch information
tmilar committed Feb 2, 2021
1 parent 3281f76 commit 977ce2e
Showing 1 changed file with 27 additions and 1 deletion.
28 changes: 27 additions & 1 deletion src/drivers/react.js
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,21 @@ type ReactLibraryType = {|
ReactDOM : ReactDomType
|};


/**
* Util to check if component is currently mounted
*/
function isMounted(component, ReactDOM) {
try {
return !!ReactDOM.findDOMNode(component);
}
catch (error) {
// Error: Unable to find node on an unmounted component
return false;
}
}


export const react : ComponentDriverType<*, ReactLibraryType, typeof ReactClassType> = {

register: (tag, propsDef, init, { React, ReactDOM }) => {
Expand All @@ -45,7 +60,18 @@ export const react : ComponentDriverType<*, ReactLibraryType, typeof ReactClassT
// $FlowFixMe
const el = ReactDOM.findDOMNode(this);
const parent = init(extend({}, this.props));
parent.render(el, CONTEXT.IFRAME);
parent.render(el, CONTEXT.IFRAME)
.catch(error => {
// component failed to render, possibly because it was closed or destroyed.
if(!isMounted(this, ReactDOM)) {
// not mounted anymore, we can safely ignore the error
return
}
// still mounted, throw error inside react to allow a parent component or ErrorBoundary to handle it
this.setState(() => {
throw error
})
});
this.setState({ parent });
}

Expand Down

0 comments on commit 977ce2e

Please sign in to comment.