Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Async subject causes incorrect behaviour of an input caret #27

Closed
dmitry-korolev opened this issue Feb 14, 2018 · 5 comments
Closed

Async subject causes incorrect behaviour of an input caret #27

dmitry-korolev opened this issue Feb 14, 2018 · 5 comments

Comments

@dmitry-korolev
Copy link

I've built simplest possible example, you can find it here: https://codesandbox.io/s/1y8rlnlp83

It looks like after an action is dispatched, actual emit of an action$ source happens in the next task, which causes the store to be updated too late. That causes React to directly set a value property of an input, which makes the caret to jump at the end.

An issue is neither with most itself, nor with react. I suppose the problem is in the async nature of most-subject.

@dmitry-korolev dmitry-korolev changed the title Async subject causes incorrect behaviour of input caret Async subject causes incorrect behaviour of an input caret Feb 14, 2018
@joshburgess
Copy link
Owner

joshburgess commented Feb 14, 2018

Hmmm, I've built quite a few things with redux-most and haven't experienced that before. I actually built a production auto-complete search feature with it at a company and did not run into that problem, so I'm a little confused about what's going on here. I'll try to dig into your example soon.

If it's not some other sort of bug, and is, indeed, due to the asynchronous work in most-subject, there is an alternative sync version that we could switch to. When I first upgraded most-subject when they introduced the new async API, I tried both, but could not tell a difference between them.

Thanks for letting me know. Will try to look at it soon.

@joshburgess
Copy link
Owner

@TylorS167 thoughts?

@dmitry-korolev
Copy link
Author

I forgot to notice that absolutely same setup based on redux-observable works as expected
https://codesandbox.io/s/0mj3lxy2qp

@joshburgess
Copy link
Owner

joshburgess commented Feb 17, 2018

@dmitry-korolev I have confirmed that it is, indeed, an issue with the async subject in most-subject that I somehow overlooked. It must be in only specific use cases that this problem arises, as I've never actually ran into it before.

You can see that switching to using sync in the createEpicMiddleware.js file solves your problem and makes things work more predictably. See this forked version of your codesandbox project I created:

https://codesandbox.io/s/8n5owr4lml

However, it looks like most-subject has a new major version (6.0.0), which has another new API, and is intended to work with the new @most/core library. I don't yet have time to explore the API to see whether or not the same sync and async creation functions exist with different names. (I did try testing them both with most-subject@6.x.x, and they do not exist.)

I do plan to rewrite this library using @most/core soon, but I'm going to hold off on that for now and just continue using most-subject 5.3.0 while changing to the sync subject creation function.

Thanks again for letting me know about this problem!

@joshburgess
Copy link
Owner

This is fixed and in the new 0.6.3 release. Thanks, @dmitry-korolev

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants