Weird transpilation bug

The issue appeared when I extended preact-cli default service worker with some additional Workbox recipes.

I got _d of undefined error in the console which looked like Workbox issue. I managed to pinpoint it down to workbox expiration plugin.

I reported an issue and Jeff pointed me to transpilation issue.

First I removed Babel plugin I added to my preact-cli thinking it was causing problems. That didn’t fix it so I tried to make a reduced test case: pulled clean preact-cli and wrote minimal service worker. On build, everything worked. Further exploration pointed towards a difference in my browserslist spec. preact-cli by default supports 0.25% of active browsers while my project did only 0.75%.

I cross-referenced the difference in browser support by running npx browserslist and then kept adding additional browsers one by one to my config. Finally, it came down to Samsung 4. A very old browser that causes babel-env to add a bunch of transforms and plugins just for it.

I found babel-env example repo and modified it so I could get the output of plugins used solely by Samsung 4. Looking at the plugins list, few stood out immediately so I tried adding those to my build (same way I added plugin I initially removed).

In the end, adding transform-arrow-functions fixed the issue. That fix is not optimal since arrow functions are widely supported but transpilation fixed scoping issue I had. I suspect that issue might be related to the way fast-async works.

I reported an issue to preact-cli team.