fix: Update babel deps to babel 7 (#214)
* fix: Update babel deps to babel 7 * chore: Replaced @babel/transfor-umd-modules with a small custom babel transformer script * test: Added minimal integration test as smoke test for importing polyfill as es6 module
This commit is contained in:
Luca Greco
GitHub
parent
2005a2ca22
commit
f85b5d8e5b
10
Gruntfile.js
10
Gruntfile.js
|
|
@ -60,7 +60,7 @@ module.exports = function(grunt) {
|
|||
options: {
|
||||
babelrc: false,
|
||||
comments: false,
|
||||
presets: ["babili"],
|
||||
presets: ["minify"],
|
||||
sourceMap: true,
|
||||
},
|
||||
files: {
|
||||
|
|
@ -72,11 +72,9 @@ module.exports = function(grunt) {
|
|||
babelrc: false,
|
||||
comments: true,
|
||||
plugins: [
|
||||
["transform-es2015-modules-umd", {
|
||||
globals: {
|
||||
"webextension-polyfill": "browser",
|
||||
},
|
||||
exactGlobals: true,
|
||||
["./scripts/babel-transform-to-umd-module", {
|
||||
globalName: "browser",
|
||||
amdModuleName: "webextension-polyfill",
|
||||
}],
|
||||
],
|
||||
sourceMap: true,
|
||||
|
|
|
|||
10
package.json
10
package.json
|
|
@ -17,12 +17,12 @@
|
|||
},
|
||||
"homepage": "https://github.com/mozilla/webextension-polyfill",
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.0.0",
|
||||
"@babel/preset-env": "^7.0.0",
|
||||
"@babel/register": "^7.0.0",
|
||||
"async-wait-until": "^1.1.5",
|
||||
"babel-core": "^6.26.3",
|
||||
"babel-eslint": "^10.0.3",
|
||||
"babel-plugin-transform-es2015-modules-umd": "^6.24.1",
|
||||
"babel-preset-babili": "^0.0.10",
|
||||
"babel-preset-es2017": "^6.24.1",
|
||||
"babel-preset-minify": "^0.5.1",
|
||||
"browserify": "^16.2.2",
|
||||
"chai": "^4.2.0",
|
||||
"chromedriver": "^78.0.1",
|
||||
|
|
@ -32,7 +32,7 @@
|
|||
"geckodriver": "^1.11.2",
|
||||
"global-replaceify": "^1.0.0",
|
||||
"grunt": "^1.0.1",
|
||||
"grunt-babel": "^6.0.0",
|
||||
"grunt-babel": "^8.0.0",
|
||||
"grunt-contrib-concat": "^1.0.1",
|
||||
"grunt-coveralls": "^2.0.0",
|
||||
"grunt-replace": "^1.0.1",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,61 @@
|
|||
const {template, types} = require("@babel/core");
|
||||
|
||||
const buildWrapper = template(`
|
||||
(function (global, factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
define(AMD_MODULE_NAME, ["module"], factory);
|
||||
} else if (typeof exports !== "undefined") {
|
||||
factory(module);
|
||||
} else {
|
||||
var mod = { exports: {} };
|
||||
factory(mod);
|
||||
global.GLOBAL = mod.exports;
|
||||
}
|
||||
})(
|
||||
typeof globalThis !== "undefined" ? globalThis
|
||||
: typeof self !== "undefined" ? self
|
||||
: this,
|
||||
function(module) {
|
||||
}
|
||||
)
|
||||
`);
|
||||
|
||||
module.exports = (api, options = {}) => {
|
||||
api.assertVersion(7);
|
||||
|
||||
if (typeof options.globalName != "string") {
|
||||
throw new Error("globalName option is mandatory");
|
||||
}
|
||||
|
||||
if (typeof options.amdModuleName != "string") {
|
||||
throw new Error("amdModuleName is mandatory");
|
||||
}
|
||||
|
||||
return {
|
||||
name: "transform-to-umd-module",
|
||||
|
||||
visitor: {
|
||||
Program: {
|
||||
exit(path) {
|
||||
const {body, directives} = path.node;
|
||||
path.node.directives = [];
|
||||
path.node.body = [];
|
||||
|
||||
const umdWrapper = path.pushContainer(
|
||||
"body",
|
||||
buildWrapper({
|
||||
AMD_MODULE_NAME: types.stringLiteral(options.amdModuleName),
|
||||
GLOBAL: options.globalName,
|
||||
})
|
||||
)[0];
|
||||
const umdFactory = umdWrapper
|
||||
.get("expression.arguments")[1]
|
||||
.get("body");
|
||||
|
||||
umdFactory.pushContainer("directives", directives);
|
||||
umdFactory.pushContainer("body", body);
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
};
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang='en'>
|
||||
<head>
|
||||
<meta charset='utf-8'>
|
||||
</head>
|
||||
<body>
|
||||
<script type='module' src='browser-polyfill.js'></script>
|
||||
<script type='module' src='background.js'></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
browser.runtime.onMessage.addListener(async (msg, sender) => {
|
||||
return {bgReceived: msg};
|
||||
});
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
test("Test browser.runtime.onMessage on polyfill loaded as es6 module", async (t) => {
|
||||
const msg = "send-message-to-background-page";
|
||||
const res = await browser.runtime.sendMessage(msg);
|
||||
t.deepEqual(res, {bgReceived: msg}, "Got the expected reply");
|
||||
});
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
{
|
||||
"manifest_version": 2,
|
||||
"name": "test-import-as-es6-module",
|
||||
"version": "0.1",
|
||||
"description": "test-import-as-es6-module",
|
||||
"content_scripts": [
|
||||
{
|
||||
"matches": [
|
||||
"http://localhost/*"
|
||||
],
|
||||
"js": [
|
||||
"browser-polyfill.js",
|
||||
"tape.js",
|
||||
"content.js"
|
||||
]
|
||||
}
|
||||
],
|
||||
"permissions": [],
|
||||
"background": {
|
||||
"page": "background.html"
|
||||
}
|
||||
}
|
||||
|
|
@ -2,6 +2,11 @@
|
|||
|
||||
const {defineExtensionTests} = require("./setup");
|
||||
|
||||
defineExtensionTests({
|
||||
description: "polyfill imported as an ES6 module",
|
||||
extensions: ["import-as-es6-extension"],
|
||||
});
|
||||
|
||||
defineExtensionTests({
|
||||
description: "browser.runtime.onMessage/sendMessage",
|
||||
extensions: ["runtime-messaging-extension"],
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
require("babel-core/register")({
|
||||
presets: ["es2017"],
|
||||
require("@babel/register")({
|
||||
presets: [["@babel/env", {
|
||||
targets: {
|
||||
node: "current",
|
||||
},
|
||||
}]],
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue