How to use reduction correctly and promise correctly?
I am using hello.js for login.
hello('abc').login()
returns a promise.
It logged in successfully because hello.js itself saved the token in local storage.
However, the code below sometimes does not dispatch the action SIGN_IN_SUCCEED
.
export const signInEpic = (action$, store) =>
action$
.ofType(SIGN_IN)
.mergeMap(action =>
Observable
.fromPromise(hello('msft').login({ scope }))
.map(response => ({
type: SIGN_IN_SUCCEED,
payload: response.authResponse.access_token
})
)
.catch(error => Observable.of({ type: SIGN_IN_FAILED, payload: error }))
);
UPDATE: Jay Pause on Caught Exceptions helped me find the error. There is no problem in the above code. The reason is that at first I try to save the token in the store after I get it SIGN_IN_SUCCEED
. Then I use the token right after the application starts to fetch something. So when a fetch step using a token is done before the token is stored in the step , it causes a problem that won't send either SIGN_IN_SUCCEED
.
source to share
If I make some assumptions about things missing from your example (like scope
what hello.js does, etc.) it works as expected. Here's an example: https://jsbin.com/rasumo/edit?js,output
There must be something else wrong in your code that is unfortunately not included here. How did you confirm this without dispatching an action SIGN_IN_SUCCEED
? Were there any errors in the console? Have you tried turning on the Pause Thrown Exceptions feature in your debugger to make sure that you might have silently swallowed the error somewhere that is preventing the action from reaching your reducers?
Another thing to be confirmed is that the promise returned hello('msft').login({ scope })
actually resolves. You can link .then()
to confirm this.
Hope this helps!
source to share