Accept window and document arguments in polyfill method

[james2406]

This will allow the window and document context to be overridden, useful when targeting another document on the page (e.g. an iframe)

[iamdustan]

Would you call this with something like polyfill(document.querySelector('iframe').contentWindow?

I assume it isn’t possible to load the polyfill on the iframe itself as well 🤔

[james2406]

Yes, that would apply the polyfill to the iframe.

In my case, I am using the react-frame-component library to render my react app in an iframe.

I'm then using the frames context to apply the polyfill to that iframe:

import Frame, { FrameContextConsumer } from 'react-frame-component'
import smoothscroll from 'smoothscroll-polyfill';

const MyComponent = (props, context) => (
  <Frame>
    <FrameContextConsumer>
      {
        // Callback is invoked with iframe's window and document instances
        ({ window, document }) => {
          smoothscroll.polyfill(window, document);
          // Render Children
        }
      }
    </FrameContextConsumer>
  </Frame>
);

Tested on chrome, safari, firefox, ie11 and iOS

[iamdustan]

This is only necessary because we don’t auto-polyfill on load, correct? If we did, then the solution would be to just load the script into the iframe.