Skip to content

scrollTo doesn't work with debounce #158

Open
@lougreenwood

Description

@lougreenwood

I have a scrollEventHandler which is debouncing the scroll events so that I can create a scrollEnd-like feature:

scrollable-view.hbs

<div
  data-test-scroll-container
  class="scrollable-view"
  {{!-- {{on "scroll" (action (optional @onScroll))}} --}}
  {{on "scroll" (action (optional @onScroll))}}
  {{on "scroll" (action "scrollEnd" @onScrollEnd)}}
  ...attributes
>
  <div data-test-scroll-content class="scrollable-view__content">
    {{yield}}
  </div>
</div>

scrollable-view.js

export default Component.extend({
  layout,
  tagName: '',

  actions: {
    scrollEnd(callback) {
      if (callback && typeof callback === 'function') {
        debounce(this, () => callback, 100, false);
      }
    },
  },
});

This all works fine in the app. However, when I attempt to test this feature and make use of the scrollTo helper, each scroll event forces the debounce to wait for it's timeout to expire and trigger (effectively nullifying the purpose of the debounce).

It seems that this is caused by the use of wait in the helper: https://github.com/cibernox/ember-native-dom-helpers/blob/master/addon-test-support/scroll-to.js#L16

Now, my question is whether it's possible for the helper to wait for the scroll event to occur in the browser without having to wait() for ember runloop (which is what seems to cause the debounce)?

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