How do I set the "type" of a React Fiber?
Asked Answered
T

0

9

I have a custom React Fiber Reconciler, which I create using the default export from the react-reconciler package. In a ReactDOM Component, I execute

this.mountNode = CustomRenderer.createContainer(this.stage)
CustomRenderer.updateContainer(
  <SomeContextProvider>{children}<SomeContextProvider/>,
  this.mountNode,
  this
)

However, when I open the React devtools, I get

Uncaught TypeError: Cannot read property 'replace' of null  in the getDataFiber method here:
    case HostComponent:
        nodeType = 'Native';
        name = fiber.type;

        // TODO (bvaughn) we plan to remove this prefix anyway.
        // We can cut this special case out when it's gone.
        name = name.replace('topsecret-', ''); /////////// Error here on this line 

This appears to be because fiber.type is null. Searching around, i see people passing a type as the second argument to their renderer's createContainer, but doing so gives me a weird and seemingly unrelated error of

Uncaught TypeError: scheduleDeferredCallback is not a function
Uncaught TypeError: cancelDeferredCallback is not a function

, so this probably isn't the right thing to do.

The Host config is pretty long, so here it is in a gist: https://gist.github.com/arilotter/d34c684da13a4825285ddfe021ec4be3

And here's my package.json: https://gist.github.com/arilotter/fd53712900f726a46c1d9a6ceeaf151c

Where can I specify the type for my container, so the devtools work?

Tom answered 27/9, 2018 at 13:58 Comment(7)
May be name = name && name.replace('topsecret-', '');Tureen
@Think-Twice the error is in React code, not in my code :(Tom
Can you show the CustomRender hostConfigHairsplitter
@ShubhamKhatri added to the postTom
Can you show package.json?Bonbon
@Alex added to the post as wellTom
If you can provide a codesandbox or something, I think it will be useful and easier for someone to help you outHairsplitter

© 2022 - 2024 — McMap. All rights reserved.