Manual scroll should cancel/override our scroll?

With the current implementation, if the user does a manual scroll while the element is being scrolled by scrollIntoView, there is a jank and zig-zag scrolling, which I think is because scrollIntoView is trying to finish its scroll. Can we have an option to discard the automated scroll once user does a manual scroll?

[KoryNunn]

Do you want it to finish immediately or just completely take over the users inputs and complete the animation?

For instant completion, you can do:

scrollIntoView(target, function(type){
	if(type === 'canceled'){
		scrollIntoView(target, { time: 0 });
	}
});

which will instantly set the scroll to the correct position when the user attempts to override it.

Alternatively, For scroll-jacking, I have a few suggestions:

Option 1. Don’t scroll jack. Option 2. If you must scroll-jack, bind your own handlers to prevent scroll events from hitting scroll-into-view and remove them when scrolling is complete, something like:

function scrolljack(event){
	event.stopPropagation();
	event.preventDefault();
}
window.addEventListener('touchmove' scrolljack, true); // <- `true` makes this handler fire on the capture phase, which happens before the bubble phase, so it will be called well before scroll-into-view sees it.
window.addEventListener('mousewheel' scrolljack, true);

scrollIntoView(target, function(
	window.removeEventListener('touchmove' scrolljack, true);
	window.removeEventListener('mousewheel' scrolljack, true);
});

The above is untested, consider it psudocode. It’s also horrific and I highly recommend you don’t do it.

[KoryNunn]

Hey, thanks for the find,

This already exists for touchstart, just needs to be added for mousewheel.

Send a pr or I’ll get to it soon.