Review polyfills based on updated target versions

[BPScott]

UPDATE: 2022-05 - We've shipped #2277 which drops support for node 12 and Safari 10, 11 and 12.

Thus the "Update browser targets" and "Update node versions" items have been completed.

We still need to audit our polyfills to remove polyfills that are now supported natively by browsers/node/jest.

---

Recently we dropped support for Safari/iOS 10, 11 and 12 in @shopify/browserslist-config.

To confirm the list of currently supported browsers run npx browserslist in an up-to-date copy of the web codebase.

We now target desktop Safari 13.1 and up and iOS Safari v13.4 and up (technically ioOS 13.6 is the minimum supported version but caniuse data says that iOS v13.4 through 13.7 all used the same browser and thus are grouped together). This saves a bunch of transpiling, notably async/await no longer needs to be transpiled, so we'll have smaller builds.
This begets some tidyiing

DONE! Update browser targets

• Update caniuse-lite to its latest version to ensure we get latest browser version info
• Update @shopify/browserslist-config to v3.0.0, so that build target the new change

Update polyfills

Removing browser support means we can also remove polyfills of features that are now present in all the browsers we target. Identify cases where polyfills can be removed, and remove them.

For instance intl.pluralRules and intersectionObserver is now supported by all browsers we support, and thus we can remove the intl and intersectionobserver polyfills.

While adjusting our polyfills and making a major version bump it is worth claiming we only support newer versions of jest too. Check what features the version of jsdom that jest 26/27 supports, as we may be able to remove some jest-only polyfills. For instance mutation observer was added in jsdom v13.2, so the mutation-observer polyfill may be able to be removed.

DONE! Bonus: Update node targets

We're close to being able to go all in on esmodules for node (this is going to be useful for skn internals). Let's ensure we are ready for that future by bumping the required node versions to the versions where esmodules are considered stable ^12.22.0 || ^14.17.0 || >=16.0.0. This is a little hairier than the browser version updates as this will force consumers to update their node versions, but I think it is worth forcing that issue and doing the bump at the same time as the browser targets so that we avoid needing another major version somewhere down the line.

Before doing this we should make sure that web, shrink-ray, hydrox are all using those latest node versions. (The versions are available for use, we've just gotta update the apps). I've confirmed Shipit is using 12.22.0 so that won't block deploying.

See v12 and v14 node changelogs.

[michenly]

Related to polyfills & export field vitejs/vite#3609

[michenly]

And this line will need to be deal with from dev init app https://github.com/Shopify/shopify-rails/blob/main/lib/shopify/rails/templates/shopify/web/foundation/GraphQL.tsx#L5

[BPScott]

TODO: Need to make a call on targets - do we match @shopify/browserslist-config - ios 13.4+ - or do we match what web does - ios 12.2+ because of legacy POS hardware support. Thanks to esnext build output web et al transpiles code which is nice, but should we handle polyfills stuff?

[BPScott]

When updating the node targets, remember to update the node versions CI runs on. After #2171 we should be able to go back to 14.x / 16.x.

[BPScott]

Update! We shipped #2277, which drops support for node 12 and safari 10, 11 and 12.

We still need to review our polyfills to account for this updated set of runtime targets.