Use decodeURIComponent to fix error: "SyntaxError: Unexpected token '%'"

[pankdm]

Summary

This PRs decodes the data portion of the worker script before executing this in NodeJS. Worth noting that decodeURIComponent on a normal text or base64 encoding is idempotent so this change shouldn't affect other cases.
Also the browser itself probably does such decoding automatically when loading workers.

More details

I discovered this issue when trying to use this web-worker package along with webpack worker-loader syntax. For example, if I have a worker defined like this:

import DummyWorker from "worker-loader?inline=no-fallback!./dummy_worker";
const worker = DummyWorker();
...

Then I get the following error coming from web-worker package:

worker.<data:>:1
%2F*%0A%20*%20ATTENTION%3A%20An%20%22eval-source-map%22%20devtool%20has%20been%20used.%0A%20*%20This%20devtool%20is%20neither%20made%20for%20production%20nor%20for%20readable%20output%20files.%0A%20*%20It%20uses%20%22eval()%22%20calls%20to%20create%20a%20separate%20source%20file%20with%20attached%20SourceMaps%20in%20the%20browser%20devtools.%0A%20*%20If%20you%20are%20trying%20to%20read%20the%20output%20file%2C%20select%20a%20different%20devtool%20(https%3A%2F%2Fwebpack.js.org%2Fconfiguration%2Fdevtool%2F)%0A%20*%20or%20disable%20the%20default%20devtool%20with%20%22devtool%3A%20false%22.%0A%20*%20If%20you%20are%20looking%20for%20production-ready%20output%20files%2C%20see%20mode%3A%20%22production%22%20(https%3A%2F%2Fwebpack.js.org%2Fconfiguration%2Fmode%2F).%0A%20*%2F%0A%2F******%2F%20(()%20%3D%3E%20%7B%20%2F%2F%20webpackBootstrap%0A%2F******%2F%20%09%22use%20strict%22%3B%0A%2F******%2F%20%09var%20__webpack_modules__%20%3D%20(%7B%0A%0A%2F***%2F%20%22.%2Fnode_modules%2Fts-loader%2Findex.js!.%2Fjest%2Fdummy_worker.ts%22%3A%0A%2F*!****************************************************************!*%5C%0A%20%20!***%20.%2Fnode_modules%2Fts-loader%2Findex.js!.%2Fjest%2Fdummy_worker.ts%20***!%0A%20%20%5C****************************************************************%2F%0A%2F***%2F%20(()%20%3D%3E%20%7B%0A%0Aeval(%22%5Cnconsole.log(%5C%22Hello%2C%20world%5C%22)%3B%5Cn%2F%2F%23%20sourceURL%3D%5Bmodule%5D%5Cn%22)%3B%0A%0A%2F***%2F%20%7D)%0A%0A%2F******%2F%20%09%7D)%3B%0A%2F************************************************************************%2F%0A%2F******%2F%20%09%0A%2F******%2F%20%09%2F%2F%20startup%0A%2F******%2F%20%09%2F%2F%20Load%20entry%20module%20and%20return%20exports%0A%2F******%2F%20%09%2F%2F%20This%20entry%20module%20can't%20be%20inlined%20because%20the%20eval-source-map%20devtool%20is%20used.%0A%2F******%2F%20%09var%20__webpack_exports__%20%3D%20%7B%7D%3B%0A%2F******%2F%20%09__webpack_modules__%5B%22.%2Fnode_modules%2Fts-loader%2Findex.js!.%2Fjest%2Fdummy_worker.ts%22%5D()%3B%0A%2F******%2F%20%09%0A%2F******%2F%20%7D)()%0A%3B
^

SyntaxError: Unexpected token '%'
    at new Script (node:vm:100:7)
    at createScript (node:vm:257:10)
    at Object.runInThisContext (node:vm:305:10)
    at evaluateDataUrl (webpack-internal:///../../../web-worker/cjs/node.js:228:13)
    at workerThread (webpack-internal:///../../../web-worker/cjs/node.js:212:9)
    at eval (webpack-internal:///../../../web-worker/cjs/node.js:79:56)

It looks like webpack URI-encodes the worker script before sending it.

The same worker script looks totally reasonable after decoding:

decoded =  /*
 * ATTENTION: An "eval-source-map" devtool has been used.
 * This devtool is neither made for production nor for readable output files.
 * It uses "eval()" calls to create a separate source file with attached SourceMaps in the browser devtools.
 * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
 * or disable the default devtool with "devtool: false".
 * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
 */
/******/ (() => { // webpackBootstrap
/******/ 	"use strict";
/******/ 	var __webpack_modules__ = ({

/***/ "./node_modules/ts-loader/index.js!./jest/dummy_worker.ts":
/*!****************************************************************!*\
  !*** ./node_modules/ts-loader/index.js!./jest/dummy_worker.ts ***!
  \****************************************************************/
/***/ (() => {

eval("\nconsole.log(\"Hello, world\");\n//# sourceURL=[module]\n");

/***/ })

/******/ 	});
/************************************************************************/
/******/
/******/ 	// startup
/******/ 	// Load entry module and return exports
/******/ 	// This entry module can't be inlined because the eval-source-map devtool is used.
/******/ 	var __webpack_exports__ = {};
/******/ 	__webpack_modules__["./node_modules/ts-loader/index.js!./jest/dummy_worker.ts"]();
/******/
/******/ })()
;

and the above PR fixes my issue.