Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

events from fromEvent + scan out of order

See original GitHub issue

I have the following code:

var createStore = function(name, reducer, initialState) {
  var storeName = 'store:'+ name

  var stream = most.fromEvent(storeName, document)
    .scan(function(state, event) {
      return reducer(state, event.detail)
    }, initialState)

  var subscribe = function(callback) {
      next: callback

  var dispatch = function(action) {
    document.dispatchEvent(new CustomEvent(storeName, { detail: action }))

  return {
    stream: stream,
    subscribe: subscribe,
    dispatch: dispatch

var store = createStore('foo', function(state, action) {
  switch (action.type) {
    case 'SET_FOOBAR':
      return { foobar: state.foobar + action.foobar }
      return state
}, { foobar: 1 })

store.dispatch({ type: 'SET_FOOBAR', foobar: 3 })
store.dispatch({ type: 'SET_FOOBAR', foobar: 5 })

which strangely enough prints the initial state as the last thing to the console:

Object {foobar: 4}
Object {foobar: 9}
Object {foobar: 1}

I would expect it to print the inital state as the first thing, like this:

Object {foobar: 1}
Object {foobar: 4}
Object {foobar: 9}

is this a bug? I’m trying this on 1.7.0. I’ve tried this code with rxjs and xstream and they both work like I expected it to

Issue Analytics

  • State:open
  • Created 6 years ago
  • Reactions:1
  • Comments:16 (1 by maintainers)

github_iconTop GitHub Comments

Risto-Stevcevcommented, Mar 1, 2018

@ryanlaws DOMHighResTimeStamp is in ms not mcs, could also be that you included the function declaration by accident:

const f = () => 123
const timeout = () => { performance.mark('fn-start'); setTimeout(f, 0); performance.mark('fn-end') }
performance.measure('fn', 'fn-start', 'fn-end')
// vs
timeout2 = () => { performance.mark('fn2-start'); f(); performance.mark('fn2-end') } 
performance.measure('fn2', 'fn2-start', 'fn2-end')

On my machine the difference is about 0.06-0.08 ms, which is 60-80 microseconds. That’s very negligible

Frikkicommented, Dec 29, 2017

As I see it, @axefrog, the culprit is what @davidchase wrote here, and is aligning with your comment, too.

@Risto-Stevcev, I still think that most.scan() does what it should, but the dispatchEvent() call blocks the caller and messes up the order:

… the event handlers run on a nested callstack: they block the caller until they complete …

If we, as @TylorS mentions in his comment, didn’t ensure that events occur on a different callstack than the subscription, we would see race condition issues in many cases.

This relates to this issue, and the solution chosen was to develop @most/core and get rid of these not-really-true-event-streams (see @TylorS’s and @briancavalier’s comments towards the end of the issue).

Read more comments on GitHub >

github_iconTop Results From Across the Web

RxJS Tutorial: fromEvent() - Create Reactive Event Streams
Senior Enterprise Software Engineer, Austin Kulp shows how to create observable streams from event sources using the RxJS ' fromEvent ()' ...
Read more >
fromEvent - RxJS
In order to get access to them, you can pass to fromEvent optional project function, which will be called with all arguments passed...
Read more >
Bridging To Events | RxJS - Javascript library for functional ...
This topic examines the fromEvent and fromEventPattern operator that allows "importing" a DOM or custom event into RxJS as an observable sequence.
Read more >
Using observables in real life — @nicoespeon's blog
Now, all we have to do is to filter out batches that don't look like scanned codes. And we know that a scanned...
Read more >
RxJS Primer - Learn RxJS
helper function to create an observable of mouse click events: ... import { fromEvent } from 'rxjs'; ... In this case, it will...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found