facebook / react

The library for web and native user interfaces.
https://react.dev
MIT License
228.57k stars 46.79k forks source link

[react-reconciler] TypeError: _appendAllChildren is not a function #15356

Closed kevzettler closed 5 years ago

kevzettler commented 5 years ago

Do you want to request a feature or report a bug?

bug

What is the current behavior?

crashes on

   Reconciler.unbatchedUpdates(() => {
     Reconciler.updateContainer(this.props.children, this.rootNode, this);
    });

with TypeError: _appendAllChildren is not a function

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your JSFiddle (https://jsfiddle.net/Luktwrdm/) or CodeSandbox (https://codesandbox.io/s/new) example below:

This has occurred while updating https://github.com/kevzettler/react-regl to latest react and reconciler versions.

What is the expected behavior?

Does not crash or gives helpful error message.

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?

yarn list v1.15.2
warning Filtering by arguments is deprecated. Please use the pattern option instead.
└─ react@16.8.6
✨  Done in 0.85s.
Kevs-MacBook-Pro:react-regl-test kevzettler$ yarn list react-reconciler
yarn list v1.15.2
warning Filtering by arguments is deprecated. Please use the pattern option instead.
└─ react-reconciler@0.20.4
kevzettler commented 5 years ago

Here is stack trace

Uncaught TypeError: _appendAllChildren is not a function
    at completeWork (react-reconciler.development.js:9280)
    at completeUnitOfWork (react-reconciler.development.js:11749)
    at performUnitOfWork (react-reconciler.development.js:11956)
    at workLoop (react-reconciler.development.js:11967)
    at renderRoot (react-reconciler.development.js:12047)
    at performWorkOnRoot (react-reconciler.development.js:13004)
    at performWork (react-reconciler.development.js:12914)
    at performSyncWork (react-reconciler.development.js:12888)
    at requestWork (react-reconciler.development.js:12743)
    at scheduleWork (react-reconciler.development.js:12556)
    at scheduleRootUpdate (react-reconciler.development.js:13251)
    at updateContainerAtExpirationTime (react-reconciler.development.js:13277)
    at Object.updateContainer (react-reconciler.development.js:13345)
    at Regl.js:144
    at Object.unbatchedUpdates (react-reconciler.development.js:13133)
    at Regl.componentDidMount (Regl.js:141)
    at commitLifeCycles (react-dom.development.js:18115)
    at commitAllLifeCycles (react-dom.development.js:19674)
    at HTMLUnknownElement.callCallback (react-dom.development.js:147)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:196)
    at invokeGuardedCallback (react-dom.development.js:250)
    at commitRoot (react-dom.development.js:19898)
    at react-dom.development.js:21446
    at Object.unstable_runWithPriority (scheduler.development.js:255)
    at completeRoot (react-dom.development.js:21445)
    at performWorkOnRoot (react-dom.development.js:21368)
    at performWork (react-dom.development.js:21273)
    at performSyncWork (react-dom.development.js:21247)
    at requestWork (react-dom.development.js:21102)
    at scheduleWork (react-dom.development.js:20915)
    at scheduleRootUpdate (react-dom.development.js:21610)
    at updateContainerAtExpirationTime (react-dom.development.js:21636)
    at updateContainer (react-dom.development.js:21704)
    at ReactRoot.push../node_modules/react-dom/cjs/react-dom.development.js.ReactRoot.render (react-dom.development.js:22017)
    at react-dom.development.js:22169
    at unbatchedUpdates (react-dom.development.js:21492)
    at legacyRenderSubtreeIntoContainer (react-dom.development.js:22165)
    at Object.render (react-dom.development.js:22240)
    at Module../src/index.js (index.js:7)
    at __webpack_require__ (bootstrap:781)
    at fn (bootstrap:149)
    at Object.0 (serviceWorker.js:135)
    at __webpack_require__ (bootstrap:781)
    at checkDeferredModules (bootstrap:45)
    at Array.webpackJsonpCallback [as push] (bootstrap:32)
    at main.chunk.js:1
threepointone commented 5 years ago

Can you make a condesandbox, or git repo/branch where this issue actually occurs?

gaearon commented 5 years ago

You need to implement all of these properties (scrollable!):

https://github.com/facebook/react/blob/c25c59c808d90bfa78c40d0a19527d384a490cc8/packages/react-reconciler/src/forks/ReactFiberHostConfig.custom.js#L41-L93

You likely didn't implement supportsMutation (it should be set to true), as a result some internal functions didn't get assigned.

We don't really intend to provide more verbose errors for custom renderers as they would increase the bundle size. When in doubt, check ReactFiberHostConfig.custom.js in the commit that corresponds to a release, and make sure you implement everything.

Jeday commented 4 years ago

Why even have supportsMutation, if setting it to false will result in reconciler crash? I consider this to be a bug.

alexweej commented 1 year ago

Came here to ask the same question as @Jeday. I was interested in PoCing something without mutation. If it's known that it's not going to work, could we consider making that explicit in the documentation that's experimental or something?

Thanks!