$fromDOMEvent can't listening root self scroll event

[RyderJKL]

I tried to listen for the scroll event on vm root, but it didn't work because $fromDOMEvent delegated the scroll event to document.documentElement, but the scroll event didn't bubble up, please see the following demo:

<template lang="pug">
  section.drag-container-wrapper
    section.drag-container
</template>

<script>
  import { Observable } from 'rxjs'
  import { pluck } from 'rxjs/operators'

  export default {
    subscriptions () {
      const rootScroll$ = this.$fromDOMEvent(null, 'scroll')
        .map(e => console.log(e))

      return {
        rootScroll$
      }
    }
  }
</script>

<style lang="stylus" scoped>
.drag-container-wrapper
  height 600px
  border 1px solid green
  overflow-y scroll
  padding 10px

.drag-container
  height 1600px
  border 1px solid red
</style>

Any ideas?

environment

vue: v2.5.2
rxjs: v6.0
vue-rx: v6.0.0
chrome: v67

[regou]

this.$fromDOMEvent(null, 'scroll') is this line correct?

[RyderJKL]

@regou Is it not possible to add a scroll event in this way?
I made a simple demo on the CodeSandbox.
I successfully listened to the click, mousemove and other events on the container element through $fromDOMEvent, and even listened to the scroll event on the container via the mounted lifecycle, but using $fromDOMEvent would not work.

[regou]

subscriptions is called before created lifecycle, in that case the selector is unable to select the element
Try v-stream

[arjamizo]

import { fromEvent } from 'rxjs'
// Vue instance
subscriptions() {
   scroll$: fromEvent(window, 'scroll'),
   consoleLog: this.scroll$.subscribe(msg => console.log(msg))
}

should work :)

[1shaked]

the error I get when I try to do this with nuxt.js and I added it as a plugin is the window is not defined

[Vue warn]: Error in created hook: "ReferenceError: window is not defined"