testing-polyfills.md

Question on JS testing for Polyfills

First off, I'm not great at testing; I'll come right out and say that. But I've had a few issues lately and am curious how I'd automate testing to safeguard features. Here's the scenario:

On the beta signup form for DayTrip, I wanted to use the new fetch() API as a replacement for jQuery and $.ajax. Using this across all browsers requires two polyfills, a Fetch Polyfill and a Promises Polyfill. The form has has broken twice now which is not ideal for a new product.

• First time was just ignorance, didn't realize I needed a Promise polyfill for some modern browsers, even tho that's documented on the Fetch polyfill.
• Second time was a botched Asset Pipeline. The polyfills weren't included in my home.js, maybe due switching to rails_12factor, still not sure.

	Edge	Mobile Safari	Chrome
Promises	❌	😄	😄
Fetch	❌	❌	😄

Another similar situation I have is with the <picture> element:

	Edge	Mobile Safari	Chrome
srcset	❌	😄	😄
<picture>	❌	❌	😄

Different browers need different levels of polyfilling. So my question is this:

1. Is it possible to automate testing that necessary polyfills exist as apart of an Integration test?
2. Is it possible to automate that across multiple platforms and browsers? Or is the only way to test to manually click through each form on each browser?
3. Even if I did the testing and the Asset Pipeline didn't inclulde and minify the correct files, would JS testing be able to detect that?
4. Is this out of scope for what I should be testing? What's a better way?

@backflip Cool. Knowing you can programmatically hit BrowserStack is sweet. Definitely going to try to make that happen (even just locally), but I might have to get on some CI service.

@robwierzbowski Testing the Polyfill seems a bit redundant, but maybe in these types of sensitive situations I could checkPromises() and checkFetch() and then do something like the above to run through BrowserStack.