Race condition is back on setState

[vans163]

So I started using a 3rd party api that loads side by side the initial render. When setGlobalState is called, the first render does not notice the state was changed.

A second forced render a second later, picks up on the change. Something is making observableBits crap out, and I am not sure I could easily replicate this.

Is there anywhere in the code here, if setState gets called, it wont render upon initial render.

EDIT: I traced this bug/feature, hoping its a bug. If the initialState does not define the field, during first render it gets skipped over.

Broken code

initialState = {
}

const [s_user] = useGlobalState("user");

function asynccallback() {
    setGlobalState("user", ()=> {return {email: "bob@test.com"}})
}

Working code

initialState = {
    user: {}
}

const [s_user] = useGlobalState("user");

function asynccallback() {
    setGlobalState("user", ()=> {return {email: "bob@test.com"}})
}

[dai-shi]

I traced this bug/feature, hoping its a bug. If the initialState does not define the field, during first render it gets skipped over.

Oh, yes. Maybe, it isn't clear enough in README. But, that's the base idea of this library. All fields be must be provided in createGlobalState and even in createStore. It's quite different from Redux, and it's more like multiple contexts. Ref: my recent blog

In TypeScript, it will clearly show a compile error, it should probably show a runtime error too for JavaScript.

[dai-shi]

@vans163

const initialState = {
    user: null,
};

It can be just null. Hope it work for your use case.

[vans163]

can be closed, thanks.