const ComponentWithInlineWrite = (props: {
store: Store<TestState>;
}) => {
const coord = useSelected(props.store, selectCoord);
// write the value when first rendered
store.write({
...store.read(),
coord: [3, 4],
});
return <div data-testid="component">{JSON.stringify(coord)}</div>;
};
This is a deliberate test of the edge case of setting your own state within the render, (which should function), but we should not suggest to people that render loops are OK, as they are not.
The testing-library cleanup kills the component once the propagated change is detected. This probably prevents the runaway execution of the implicit loop. However, for readers of the test suite, the loop should be visibly prevented (e.g. only the first render should ever set the coord with subsequent renders not triggering their own render over and over).
At https://github.com/cefn/watchable/blob/main/packages/store-react/test/index.test.tsx#L145 we have a component that creates and writes a new state inline in its render, but also watches that state, creating an implicit render loop...
This is a deliberate test of the edge case of setting your own state within the render, (which should function), but we should not suggest to people that render loops are OK, as they are not.
The testing-library cleanup kills the component once the propagated change is detected. This probably prevents the runaway execution of the implicit loop. However, for readers of the test suite, the loop should be visibly prevented (e.g. only the first render should ever set the
coord
with subsequent renders not triggering their own render over and over).