1326321 - Page Metadata parser's babel pollutes global namespace. Breaking websites

Status: RESOLVED FIXED

(Firefox for iOS :: Browser, defect, P1)

Description

[Farhan Patel [:farhan]]

The page-metadata-paser will add babel to global._babelpollyfil. If a site also uses babel this will break that site as it won't be able to add its own version of babel pollyfil to global. 

In the console you should see this error
"only one instance of babel-polyfill is allowed"

You can test this on the mobile version of reddit.com with the page-metadata-parser enabled. You'll see that no content on the page loads. And in the js console the above error will be shown. 

Any thoughts on how we can get around this?

Comment 1

[Stephan Leroux [:sleroux]]

James had suggested that we find a way to maybe convert the page-metadata-parser/fathom.js stuff to not have to use babel.js. Since MobileSafari supports some ES6 features this might not be that big of a change.

Comment 2

[Farhan Patel [:farhan]]

We might be able to avoid using babel if we were on iOS10 only. But there is a lot of missing functionality on iOS9 https://kangax.github.io/compat-table/es6/#ios9

Comment 3

[Farhan Patel [:farhan]]

We could try moving it into a webworker. Similar to what I attempted with Readability. https://github.com/mozilla-mobile/firefox-ios/pull/2299

We'll need to create a new dom with JSDOM to pass to fathom.

Comment 4

[Jenn Chaulk (:jchaulk)]

Farhan,should this be in our MVP list?  Just double-checking before I set to P2

Comment 5

[Farhan Patel [:farhan]]

Yea it should be. I can do that.

Comment 6

[Farhan Patel [:farhan]]

I can get around this by using babel-transform-runtime.

Comment 7

[Farhan Patel [:farhan]]

I was able to fix this by using babel-transform you can see the changes I made to the webpack config here in my fork of the metadata parser repo https://github.com/mozilla-mobile/page-metadata-parser

https://github.com/mozilla-mobile/firefox-ios/pull/2424/commits/ca3c44dc81181a0688238d67d48e89305b3738af