Supporting Safari (ES5) with Rails JS bundling/eslint

I recently replaced Webpacker v6 in a Rails app with the new standard of jsbundling-rails using eslint. Turned out to be a lucky change as well considering that Rails have abandoned Webpacker without shipping a v6.0 release.

Shortly after shipping this change we started receiving customer feedback from users running iOS 13 or desktop Safari 13 - it appeared that JavaScript functionality was totally broken. It turns out that these versions of Safari were choking on ES6 code, and Webpacker clearly was transpiling it backwards as required.

Luckily, esbuild has an option called target which allows you to specify browser vendors/version combinations that need to be supported. I suppose this is similar to browserlist (which Webpacker used). This makes it easy to add support for Safari 13 back with just --target=safari13 in the package.json scripts.

{
  "scripts": {
    "build": "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds --target=safari13"
  }
}