Can't get correct access to a Konva node with useEffect in StrictMode

[Kiku-CN]

There is demo. I expect that transformer always attach to react whatever count is, but transformer disappear when increase count to 3 by click +1 button. Everything work fine without StrictMode.

I tried to make some explanation what happen.

React Strict Mode rerender component in development. useEffect will also run twice when the first mount，so the ref in effect can get corresponding ref to knova node when count initialize with 1.

Component still render twice when count increase, but the effect only run once due to same count between two render. the ref in effect refer to konva node in first render, but the konva really show on the screen seems to be the second render. So the transormer disappear.

[lavrton]

That is an interesting issue. I see that on count = 3 it creates several new instances of all konva nodes. But somehow in effect in references to the old instances. If I do the effect in timeout, it resolves the issue:

React.useEffect(() => {
    setTimeout(() => {
      trRef.current?.nodes([shapeRef.current]);
      trRef.current?.getLayer().batchDraw();
    }, 100)
  }, [count]);

I am not sure yet what will be solution from react-konva side.