Skip to content

Component not aware of state change? #20

Closed
@mrGibi

Description

@mrGibi

I've been fighting this all day today.
Im new to Java/TypeScript world, React world and Redux world and I was pretty sure that I messed something up... until I tried doing the same with React-Redux (7.0.0.beta-1) and it turned out it works there!

Im writing a authorization flow with redux-saga - so this example that Im going to show you is just massively simplified code similar to mine. CodeSandboxes below.

Description: TOGGLE button dispatches an action that is caught by redux-saga. The Saga dispatches an action to toggle a value to true, wait 10ms, and then dispatches another action to toggle value back to false. Meanwhile the button is disabled if value === true, and there is a value ? 'ON' : 'OFF' text. Interestingly if you increase delay() value to (for example) 50ms it works!

How does it look like:

  • using react-redux 7.0.0-beta.1 (good!)
    react-redux

  • using reactive-react-redux 1.8.0 (bad!)
    reactive-react-redux

This was shot on MacOs 10.14.4 and Safari 12.1.
I have tested this also on:

  • iOS: latest Safari, latest Chrome and latest Firefox. Results are the same, although on Firefox sometimes I had to click "toggle button" couple of times to "achieve" this issue.
  • MacOs: latest Chrome, latest Firefox. On Firefox and Chrome sometimes it needs couple of clicks to get there.

Check out these codesandboxes:

I dropped on this issue by accident. In my original code the delay function is just a Api call. This Api call had a wrong port number set so it got Connection refused and returned immediately. TURN_ON and TURN_OFF was just a isLoading indicator that disabled a Login button.

@dai-shi Im totally blown away by Your work on reactive-react-redux and @theKashey 's proxyequal. I follow every discussion, every benchmark test and commits to this repo and wish I would understand enough of it to be able to help...

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions