3
有沒有一種方法可以讓PhantomJS本身支持ES6,我有一堆ES6代碼通過Babel轉換爲ES5,我需要完成的是準確測量代碼覆蓋率, ES6代碼而不是ES5。這是客戶的要求,所以我不能只告訴他停止請求這樣的事情......對PhantomJS中的ES6的原生支持
Afaik NodeJS已經有ES6的本機支持,有沒有辦法用PhantomJS來做到這一點?
有沒有一種方法可以讓PhantomJS本身支持ES6,我有一堆ES6代碼通過Babel轉換爲ES5,我需要完成的是準確測量代碼覆蓋率, ES6代碼而不是ES5。這是客戶的要求,所以我不能只告訴他停止請求這樣的事情......對PhantomJS中的ES6的原生支持
Afaik NodeJS已經有ES6的本機支持,有沒有辦法用PhantomJS來做到這一點?
我已經結束了使用原始的NodeJS(不含PhantomJs)+快速+ JSDom(https://github.com/tmpvar/jsdom),POC的是這樣的:
"use strict"
const $module = require('module');
const path = require('path');
const babel = require("babel-core");
const Jasmine = require('jasmine');
const reporters = require('jasmine-reporters');
const express = require('express');
const jsdom = require("jsdom");
const app = express();
const vm = require('vm');
const fs = require("fs");
app.get('/', function (req, res) {
res.sendFile('index.html', { root: __dirname });
});
app.use('/bower_components', express.static('bower_components'));
const load = function (filename) {
return fs.readFileSync(`./bower_components/${filename}`, "utf-8");
};
const packages = [
fs.readFileSync('./bower_components/jquery/dist/jquery.js', "utf-8"),
fs.readFileSync('./bower_components/angular/angular.js', "utf-8"),
fs.readFileSync('./bower_components/angular-mocks/angular-mocks.js', "utf-8")
];
const sut = {
'./js/code.js': fs.readFileSync('./js/code.js', "utf-8")
};
const tests = {
'./tests/test.js': fs.readFileSync('./tests/test.js', "utf-8")
};
function navigate(FakeFileSystem, root, cwd, filename) {
// Normalize path according to root
let relative = path.relative(root, path.resolve(root, cwd, filename));
let parts = relative.split(path.sep);
let iterator = FakeFileSystem;
for (let part of parts) {
iterator = iterator[part] || (iterator[part] = { });
}
return iterator;
}
const server = app.listen(3333, function() {
const host = server.address().address;
const port = server.address().port;
const url = `http://${host === '::' ? 'localhost' : host}:${port}`;
console.log(`Server launched at ${ url }`);
console.log(`Running tests...`)
jsdom.env({
url: url,
src: packages,
done: function (err, window) {
let jasmine = new Jasmine();
let FakeFileSystem = {};
let descriptors = [];
jasmine.configureDefaultReporter({ showColors: true });
let env = jasmine.env;
for (let propertyName in env) {
if (env.hasOwnProperty(propertyName)) {
window[propertyName] = env[propertyName];
}
}
let context = vm.createContext(window);
let collections = [sut, tests];
for (let collection of collections) {
for (let filename in collection) {
let descriptor = navigate(FakeFileSystem, __dirname, '.', filename);
let source = collection[filename];
let transpiled = babel.transform(source, { "plugins": ["transform-es2015-modules-commonjs"] });
let code = $module.wrap(transpiled.code);
let _exports = {};
let _module = { exports: _exports };
descriptor.code = vm.runInContext(code, context);
descriptor.module = _module;
descriptor.exports = _exports;
descriptor.filename = filename;
descriptors.push(descriptor);
}
}
for (let descriptor of descriptors) {
let cwd = path.dirname(path.relative(__dirname, descriptor.filename));
descriptor.code.call(
undefined,
descriptor.exports,
// Closure is used to capture cwd
(function (cwd) {
return function (filename) { // Fake require function
return navigate(FakeFileSystem, __dirname, cwd, filename).exports;
}
})(cwd),
descriptor.module,
descriptor.filename
);
}
jasmine.execute();
server.close();
}
});
});
這種方法的好處是,有在transpiling沒有必要有通天的代碼,它允許前端軟件包,如角擺脫涼亭加載,而所有配置的東西來自NPM ...
我基於這樣的事實的NodeJS不支持迷迷糊糊所有的ES6功能,以及這樣的功能由於ES6模塊是一個真正的痛苦,他們不支持任何地方,所以我最終用babel進行了部分代碼轉換,期望當NodeJS開始爲ES6提供更豐富和更豐富的支持時,我最終會轉向-off babel功能一步一步,並切換到本地支持時,它將成爲可用...
我認爲與PhantomJS 2使它更容易使用一個較新的WebKit版本,這可能仍然是很多工作。祝你好運。使用已支持ES6的瀏覽器可能更容易。 –
巴別爾也打算在舊系統上運行。幻影上的失敗是什麼?聽起來就像你問了兩個問題:1.我如何填充幻影? 2.我如何獲得ES6代碼的覆蓋? – loganfsmyth
它給代碼覆蓋率提供了錯誤的觀點,當使用babel時代碼覆蓋率的結果是針對ES5調用進行的...... – Lu4