Crash with React 16

[alexnault]

Since React 16, any error thrown inside the onCreated callback of a template wrapped by BlazeComponent will crash an entire application:

modules.js?hash=957b7f56e70d424bf17fc542f707065bb55455e6:58144 The above error occurred in the <BlazeComponent> component: Consider adding an error boundary to your tree to customize error handling behavior. Visit https://fb.me/react-error-boundaries to learn more about error boundaries.

Uncaught Error: Expected template rendered with Blaze.render
    at Object.Blaze.remove (blaze.js?hash=f33d3dfed63a491d24e3aa07ad66c24b5fe8c761:2412)
    at BlazeComponent.componentWillUnmount (blaze-react-component-client.js:56)
    at callComponentWillUnmountWithTimer (modules.js?hash=957b7f56e70d424bf17fc542f707065bb55455e6:57129)
    at HTMLUnknownElement.callCallback (modules.js?hash=957b7f56e70d424bf17fc542f707065bb55455e6:48939)
    at Object.invokeGuardedCallbackDev (modules.js?hash=957b7f56e70d424bf17fc542f707065bb55455e6:48978)
    at invokeGuardedCallback (modules.js?hash=957b7f56e70d424bf17fc542f707065bb55455e6:48835)
    at safelyCallComponentWillUnmount (modules.js?hash=957b7f56e70d424bf17fc542f707065bb55455e6:57136)
    at commitUnmount (modules.js?hash=957b7f56e70d424bf17fc542f707065bb55455e6:57262)
    at commitNestedUnmounts (modules.js?hash=957b7f56e70d424bf17fc542f707065bb55455e6:57298)
    at unmountHostComponents (modules.js?hash=957b7f56e70d424bf17fc542f707065bb55455e6:57581)

How to reproduce:

<template name="myTemplate">
    Hey!
</template>

import React from 'react';
import ReactDOM from 'react-dom';
import Blaze from 'meteor/gadicc:blaze-react-component';

Template.myTemplate.onCreated(function() {
    const myVar = testtesttest; // testtesttest is undefined (error)
});

ReactDOM.render(
    <Blaze template='myTemplate' />,
    document.getElementById('root')
);

Maybe the package is not compatible with some of the React 16 breaking changes? Or maybe all we need is to add an error boundary over BlazeComponent?

[alexnault]

This was caused by React 16's new error handling behavior:

As of React 16, errors that were not caught by any error boundary will result in unmounting of the whole React component tree.

So, error boundaries must be defined to prevent the whole React tree from breaking.

[gadicc]

Hi Alex

Thanks for reporting back!

Best Gadi

On Mon, Dec 4, 2017 at 10:44 PM, Alex Nault notifications@github.com wrote:

This was caused by React 16's new error handling behavior https://reactjs.org/docs/error-boundaries.html#new-behavior-for-uncaught-errors :

As of React 16, errors that were not caught by any error boundary will result in unmounting of the whole React component tree.

So, error boundaries must be defined to prevent the whole React tree from breaking.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/gadicc/meteor-blaze-react-component/issues/12#issuecomment-349099310, or mute the thread https://github.com/notifications/unsubscribe-auth/AAXUGnszhP6nA7XgZuAq59W_doa7xa-fks5s9FmzgaJpZM4Qy80S .

--

Gadi Cohen aka Kinslayer dragon@wastelands.net www.wastelands.net Freelance admin/coding/design HABONIM DROR linux/fantasy enthusiast KeyID 0x93F26EF5: 256A 1FC7 AA2B 6A8F 1D9B 6A5A 4403 F34B 93F2 6EF5

[gadicc]

I guess we could also introduce our own error boundary for Blaze components... that could be a nice feature. Unfortunately I'm very short on time these days but would happily accept a PR to this end from anyone interested on working on it.

On Tue, Dec 5, 2017 at 8:09 PM, Gadi Cohen dragon@wastelands.net wrote:

Hi Alex

Thanks for reporting back!

Best Gadi

On Mon, Dec 4, 2017 at 10:44 PM, Alex Nault notifications@github.com wrote:

This was caused by React 16's new error handling behavior https://reactjs.org/docs/error-boundaries.html#new-behavior-for-uncaught-errors :

As of React 16, errors that were not caught by any error boundary will result in unmounting of the whole React component tree.

So, error boundaries must be defined to prevent the whole React tree from breaking.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/gadicc/meteor-blaze-react-component/issues/12#issuecomment-349099310, or mute the thread https://github.com/notifications/unsubscribe-auth/AAXUGnszhP6nA7XgZuAq59W_doa7xa-fks5s9FmzgaJpZM4Qy80S .

--

Gadi Cohen aka Kinslayer dragon@wastelands.net www.wastelands.net Freelance admin/coding/design HABONIM DROR linux/fantasy enthusiast KeyID 0x93F26EF5: 256A 1FC7 AA2B 6A8F 1D9B 6A5A 4403 F34B 93F2 6EF5

--

Gadi Cohen aka Kinslayer dragon@wastelands.net www.wastelands.net Freelance admin/coding/design HABONIM DROR linux/fantasy enthusiast KeyID 0x93F26EF5: 256A 1FC7 AA2B 6A8F 1D9B 6A5A 4403 F34B 93F2 6EF5