canvas-kit icon indicating copy to clipboard operation
canvas-kit copied to clipboard

First item is not selected on load with the strict mode of React 18

Open RayRedGoose opened this issue 2 years ago • 2 comments

🐛 Bug Report

Tabs and SegmentedControl(preview) components without the hoisted model doesn't select first item on load correctly in the Strict Mode of React 18.

Items in the model state generates twice, first time it creates items with id starts from 0 and second time item id numbers start from items.length number. selectedIds filled only once and it selects the first item with id '0'. So on the second render there is no item with id '0'.

First render: Screen Shot 2023-04-05 at 9 57 29 AM

Second render Screen Shot 2023-04-05 at 9 57 56 AM

To Reproduce

https://codesandbox.io/s/tabs-in-strictmode-forked-c8z5fs?file=/src/index.tsx

Comment <StrictMode> to see how

Expected Behavior

The first item is selected on the load if there is no initial value provided.

RayRedGoose avatar Apr 05 '23 16:04 RayRedGoose

Looks like this is still an issue in v13.

alanbsmith avatar Sep 04 '25 20:09 alanbsmith

We should get a formal stance on React Strict Mode support.

alanbsmith avatar Oct 27 '25 17:10 alanbsmith