React native new architecture not showing anything

[jb-san]

Im trying to run @react-three/fiber in a new expo project that is using the new architecture, but it does not show anything and when adding object like lighting it causes threejs to throw cannot read trim of undefined

it renders on web and android

I created a repro repo here:
https://github.com/jb-san/expo-52-three-fiber
run:

npm I
npm run ios

it has 3 pages

1. using expo-gl and only threejs (works)
2. using expo-three (works, but it does have a dependency on a lower threejs version, but even forcing the latest version works)
3. using @react-three/fiber/native, (doesn't work)

I can get the PureThree.tsx to not render anything if I remove the style:{} on line 14

[jb-san]

trying to make a custom renderer like this

 <Canvas
      style={{ flex: 1, backgroundColor: "black" }}
      gl={(canvas) => {
        const gl = canvas.getContext("webgl", { antialias: false })!;
        const renderer = new THREE.WebGLRenderer({
          canvas: {
            powerPreference: "high-performance",
            antialias: true,
            alpha: true,
            width: gl.drawingBufferWidth,
            height: gl.drawingBufferHeight,
            style: {},
            addEventListener: (() => {}) as any,
            removeEventListener: (() => {}) as any,
            clientHeight: gl.drawingBufferHeight,
          },
          context: gl,
        });
        renderer.setPixelRatio(1);
        renderer.setSize(gl.drawingBufferWidth, gl.drawingBufferHeight);

        return renderer;
      }}
      style={{ flex: 1, backgroundColor: "red" }}
    >...

to mimic the way the renderer is created in PureThree.tsx does not work

[anurbecirovic]

Same issue

[jb-san]

After some digging, looks like it is running the renderer, updated my repo with an example where you can see that a useFrame is being called. I might be wrong, but I think there is something in the react-reconciler that is not working correctly with the new architecture

[jb-san]

I have tried to find out why, but from logs it looks like the reconciler works, but I can not figure out why it wont render

[teubs]

Thank you for your example repo - very helpful to see it's not my setup fault.
Is there any update? Having the same issue, but have to build up a new project using expo 52, but I am also in need of r3f. :/

[jb-san]

I keep investigating this on my free time, the only conclusion I have is that for some reason it does not manage to get its render target (canvas), don't know why yet,
I also did a test where I updated to v9 of @react-three/fiber, and react 19, but that gave me a whole set of new errors from the its-fine provider, Ill update if I find a way

[busybox11]

Can also reproduce the same issue on iOS.
Running the exact same code on Web does work though.

[jb-san]

strange.mov

It seams like the objects are there, the pointer events are there, but it does not render anything.
My guess is that it has to do with the reconciler

[cubevis]

Same issue :(