[VitalSource] Odd page scroll behavior in VitalSource

[chrisshaw]

Issue

When I click on an annotation card, the epub scrolls a fixed amount down away from the highlighted text.

Expected

Clicking on the card will scroll me to the highlight.

Steps to reproduce:

1. Open the following VitalSource item
   • User chris.shaw@hypothes.is
   • Course & Assignment: https://hypothesis.instructure.com/courses/305/assignments/2174?module_item_id=3267
2. Create a highlight on the page
3. Click the highlight to scroll to the page
4. Click the card of the annotation

https://user-images.githubusercontent.com/2966918/141201606-21e6a3aa-f10d-4946-a825-cf6490f02e84.mp4

[robertknight]

The video above loads in Chrome but not Safari. I believe this is because it is actually WebM video but has been given a .webm.mp4 extension and thus gets treated by Safari as an MP4 file. Can you re-upload with just the .webm extension?

[chrisshaw]

@robertknight GitHub doesn't support webm. This is a community hack for WEBM videos. So... no.

[robertknight]

Ah, that's unfortunate. It seems this hack works in Firefox and Chrome on macOS but not Safari. I guess GitHub's video support started with MOV and MP4 because those were the most ubiquitous, albeit patent-encumbered, formats.

[robertknight]

The issue turns out to be a more general problem with the scroll-into-view package that affects all XHTML documents. As far as I understand, all EPUBs are either XHTML or SVG documents. Solutions I am evaluating include:

1. Resolve the issue in scroll-into-view (https://github.com/KoryNunn/scroll-into-view/issues/101)
2. Replace scroll-into-view with the native Element.scrollIntoView method. This is supported in all browsers but the smooth-scrolling feature is not supported in Safari, and timing may differ
3. Replace scroll-into-view with a local solution. We already did this for PDFs (see src/annotator/util/scroll.js)