Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Polyfill is not applied in Edge 87 & Chrome 87 (Windows 10) #16

Open
hivokas opened this issue Jan 5, 2021 · 4 comments
Open

Polyfill is not applied in Edge 87 & Chrome 87 (Windows 10) #16

hivokas opened this issue Jan 5, 2021 · 4 comments

Comments

@hivokas
Copy link

hivokas commented Jan 5, 2021

Thanks for this awesome polyfill! Great job!

I've encountered a problem. Sometimes polyfill is not applied because these two checks return true...

image

...while the smooth scrolling doesn't work.

What do you think about providing a way to force apply the polyfill? For example, by prepending the polyfill import with window.forcePolyfillScrollBehavior = true;.

@hivokas
Copy link
Author

hivokas commented Jan 5, 2021

I've managed to force apply the polyfill the following way:

delete Element.prototype.scrollTo;
require('scroll-behavior-polyfill');

But I really don't like it.

@hivokas
Copy link
Author

hivokas commented Jan 5, 2021

It would be even cooler if I can do something like that:

import { patch } from 'scroll-behavior-polyfill';

/* my code */

patch();

@slorber
Copy link

slorber commented Jul 28, 2021

By chance, is there a better way to detect when the polyfill is really required?

It seems like the 'scrollBehavior' in document.documentElement.style is not a good-enough test as it returns true and then the native smooth scrollBehavior does not work in practice. It has been reported for some Windows and Linux users.

The home readme may also be a bit misleading: it's more reliable to always apply the polyfill in current state.

@slorber
Copy link

slorber commented Jul 29, 2021

Nolan Lawson used another way to test for this in his project but in my case it didn't give much better results: nolanlawson/pinafore#2082

function testSupportsSmoothScroll () {
  let supports = false
  try {
    const div = document.createElement('div')
    div.scrollTo({
      top: 0,
      get behavior () {
        supports = true
        return 'smooth'
      }
    })
  } catch (err) {} // Edge throws an error
  return supports
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants