diff --git a/src/reconciler/hotReplacementRender.js b/src/reconciler/hotReplacementRender.js index 9c578b70d..e532d8f91 100644 --- a/src/reconciler/hotReplacementRender.js +++ b/src/reconciler/hotReplacementRender.js @@ -215,7 +215,7 @@ const mergeInject = (a, b, instance) => { const transformFlowNode = flow => flow.reduce((acc, node) => { if (isFragmentNode(node) && node.props && node.props.children) { - return [...acc, ...filterNullArray(node.props.children)] + return [...acc, ...filterNullArray(asArray(node.props.children))] } return [...acc, node] }, []) diff --git a/test/AppContainer.dev.test.js b/test/AppContainer.dev.test.js index bb1cfd2f4..8a1192f4a 100644 --- a/test/AppContainer.dev.test.js +++ b/test/AppContainer.dev.test.js @@ -1871,6 +1871,69 @@ describe(`AppContainer (dev)`, () => { expect(wrapper.update().text()).toBe('PATCHED + 6 v2') }) + it('hot-reloads children inside simple Fragments', () => { + if (React.version.startsWith('16')) { + const unmount = jest.fn() + + class InnerComponent extends Component { + componentWillUnmount() { + unmount() + } + + render() { + return internal + } + } + InnerComponent.displayName = 'InnerComponent' + + const App = () => ( + + + + ) + + RHL.register(App, 'App', 'test.js') + + const wrapper = mount( + + + , + ) + + { + class InnerComponent extends Component { + componentWillUnmount() { + unmount() + } + + render() { + return internal + } + } + InnerComponent.displayName = 'InnerComponent' + + const App = () => ( + + + + ) + RHL.register(App, 'App', 'test.js') + + wrapper.setProps({ children: }) + } + + expect(unmount).toHaveBeenCalledTimes(0) + expect(wrapper.update().text()).toBe('another textinternal') + } else { + // React 15 is always ok + expect(true).toBe(true) + } + }) + it('hot-reloads children inside Fragments', () => { if (React.version.startsWith('16')) { const unmount = jest.fn() @@ -1904,6 +1967,9 @@ describe(`AppContainer (dev)`, () => {
  • 3
  • + + F + ) // @@ -1920,7 +1986,7 @@ describe(`AppContainer (dev)`, () => { ) expect(wrapper.update().text()).toBe( - '1-1-OldInnerComponent-3-OldInnerComponent3', + '1-1-OldInnerComponent-3-OldInnerComponent3F', ) { class InnerComponent extends Component { @@ -1941,6 +2007,9 @@ describe(`AppContainer (dev)`, () => { -2- {false &&
    hole
    } -3- + + * + ) RHL.register(InnerItem, 'InnerItem', 'test.js') @@ -1949,7 +2018,7 @@ describe(`AppContainer (dev)`, () => { } expect(unmount).toHaveBeenCalledTimes(0) expect(wrapper.update().text()).toBe( - '1-2-NewInnerComponent-3-NewInnerComponent3', + '1-2-NewInnerComponent-3-NewInnerComponent*3F', // it should not be so! ) } else { // React 15 is always ok