`@sentry/webpack-plugin` Adds Code That Breaks Old Browsers

[grushetsky]

Environment

Chromium 38, @sentry/webpack-plugin 3.5.0.

Steps to Reproduce

1. Build the app with webpack and @sentry/webpack-plugin included in the list of plugins.
2. Run the app in an old browser.

Expected Result

The app starts up without errors.

Actual Result

A syntax error near let keyword is thrown upon app start.

Additional Details

Sentry injects some code that has let in it. let syntax is not supported by the old browsers.

[linear]

BUNDLER-73 `@sentry/webpack-plugin` Adds Code That Breaks Old Browsers

[Lms24]

Hey @grushetsky thanks for writing in! The decision to drop ES5 support was made intentionally in version 3.0.0 of the plugin (see changelog). Given this does save a little bit of bundle size and the overall decline of ES5, I think we'll keep it this way for now.

If you need ES5 support, I suggest trying @sentry/webpack-plugin@^2 for now. Let me know if you're missing a feature on this version.

Side note: If there is a blocker in using the older version, I think alternatively, we can consider adding back ES5 compatibility as an opt-in mechanism (similarly to what was propsed in #610 (comment), when we tried simplifying the global object lookup). For now though, I want to avoid this if we don't have to do it.

[grushetsky]

Hey, @Lms24! Thank you for the feedback!

ES5 is being phased out, which is a good thing. The problem is that most of the Smart TV platforms (like Samsung's Tizen and LG's webOS TV) do not update their browser engines that run apps. At the same time the userbase of these devices remains relevant for developers and vendors.

@sentry/webpack-plugin version 2.x had some issues with source map uploading as far as I remember. I could try to test it out once more, but it seems suboptimal to use this version. First of all, it is unlikely that the version 2.x is going to receive updates, so, it's not a futureproof solution. Second, in order to have the most optimal bundle I need separate builds (targeting both ES5 and ES2015+ environments), thus, I need to use two versions of the same library, which is solvable, but is also cumbersome. It adds complexity to the config.

I think that targetEnvironment option for the plugin would be the best approach here. As ES2035 comes around, Sentry will already have the option.

Are you OK if we add this or similar option to @sentry/webpack-plugin?

[Lms24]

@grushetsky thanks for explaining your use case!

Are you OK if we add this or similar option to @sentry/webpack-plugin?

Before you invest more time here, let me bring this up with the team to get some more opinions. I'll get back to you.

In the meantime, just to clarify: Do you have an option to polyfill missing features for your target language level? Usually our code should be added to the build early enough for tools like babel to come in. Also worth noting that our SDK code isn't transpiled to ES5 anymore since a long time. See browser compatibility. So either you're using a very old SDK version or you're adding polyfilles already?