Popper Logo
Popper Logo

Browser Support

Popper supports modern versions of Chrome, Firefox, Safari, Edge. IE11 works with some polyfills. Additionally, any Chromium-based browser, such as Opera, Beaker, etc should be supported.

Don't mind tech-related ads? Consider disabling your ad-blocker to help us!
They are small and unobtrusive.
Alternatively, consider to support us on Open Collective!

IE11

IE11 (and older browsers in general) require polyfills to work. The simplest way to make Popper work is to use the following polyfill service:

<script src="https://polyfill.io/v3/polyfill.min.js?features=Array.prototype.find,Promise,Object.assign"></script>

Browsers that don't need the polyfills won't be burdened with the JS bundle size.

Support note

If you need to support old browsers, ensure you lock Popper's version to a specific number when using the CDN. On new releases, we may add more modern functions that require new polyfills, or positioning behavior may break in IE11 since it is completely untested. We don't plan to officially support IE11, but welcome PRs to fix issues. For the most part, IE11 seems to work without much trouble, but there may be edge cases in some scenarios.

Safari

Safari has unfortunate quirks regarding updating the position of DOM elements. We have filed WebKit bugs for these, so hopefully they will be fixed in the future.

Lag

On macOS and iOS, when the popper is prevented from overflowing the root viewport boundary, it can appear to lag behind while scrolling (not 1:1 in-sync). For iOS this also happens in scrolling containers.

We recommend one of these options for Safari only:

  • Setting rootBoundary to "document" for the preventOverflow modifier
  • Hiding the popper upon scrolling

WebKit bug report

Fixed strategy

In the latest version of macOS Safari, when elastic overscroll (rubber-banding effect) is in progress, fixed elements will detach from the reference element because they no longer stick including the elastic overscroll – which Safari reports scroll to include. On iOS, this is not an issue.

In addition, while scrolling the document, a slight lag as mentioned above also becomes present because the popper needs to be continuously updated while scrolling, which Safari is not good at. Ideally this strategy should only be used when the reference element is fixed, and not to "break" the popper out of a clipping container context.

WebKit bug report

IE10 and older

Browsers older than 2013 (including Android 4.4) will never be supported since they are becoming increasingly obsolete and add a lot of complexity (runtime and bundle) costs to the library.

We encourage any Internet Explorer user to upgrade to Microsoft Edge, their most recent versions are based on Chromium, allowing to render all the modern websites without issues, but still provide a compatibility mode to render legacy websites designed to work with Internet Explorer.

Edit this page
Typings
© 2020 MIT License