scrollIntoView Promise doesn't resolve on some elements

[matthew-dean]

I discovered an apparent bug, where I have something like this:

scrollIntoView([HTMLElement], {
  scrollMode: 'if-needed',
  block: 'nearest',
  boundary: document
}).then(() => { console.log('done') })

It appears that if the element doesn't need to be scrolled into view (or some other reason?), then the Promise will never resolve. Even if I change .then() to .finally(), nothing happens. No console.log is output. Meaning I can't chain scrollIntoViews.

I didn't have this problem until the element I needed to check if it needed to be scrolled into view was sometimes the same height as the document.

[stipsan]

Hey there!

Are you talking about smooth-scroll-into-view-if-needed?

[matthew-dean]

@stipsan Yes, that's what I'm using.

[stipsan]

Alright. Then it's for sure a bug. It's always returning a Promise.all:
https://github.com/stipsan/smooth-scroll-into-view-if-needed/blob/c8aa5a2d23541c8f24921f0196ece43843c58f0d/src/index.ts#L111-L125

If scrollMode: 'if-needed' is breaking the behavior it sounds like it's returning something other than an empty array. Gonna check it out, thanks for the report! 😄

[stipsan]

I just released v1.1.13 with a fix, let me know if it works 😄

[stipsan]

I'm open for feedback on what is returned when the promise resolved. It might make sense to include the same array of actions that it's mapping through?

[matthew-dean]

Thanks for the fast turnaround! It works! ^_^

[matthew-dean]

What it passes to the then() function is irrelevant for me. I just need to know when the Promise resolved.

[stipsan]

Alright, good news! 😄👍

[matthew-dean]

One thing that I'm seeing now. Although now an element that doesn't need scrolling returns a promise, it only resolves after the timeout, even though no scrolling happened. I would expect that if no scrolling needs to happen, then it resolves immediately.

[stipsan]

Good catch! I'll take care of it right after scroll-into-view/compute-scroll-into-view#17 😄

[stipsan]

I made a repro here: codepen.io/stipsan/pen/gjwWXV

It is showing a behavior similar to what you mentioned above 🤔