在前端开发过程中测试是必不可少的一步，其中单元测试和端到端测试是最基础的两种，而 karam-phantomjs-bundled-launcher 实现了无头浏览器的启动，让我们能够方便的进行端到端测试。本文将详细介绍 karam-phantomjs-bundled-launcher 的使用。
karma-phantomjs-bundled-launcher 简介
karma-phantomjs-bundled-launcher 是一个 Karma 浏览器启动器插件，它会在本地启动 PhantomJS 无头浏览器，并将其作为一个 Karma 浏览器实例运行。通过 karma-phantomjs-bundled-launcher 我们可以在 Karma 测试框架中使用 PhantomJS 无头浏览器运行端到端测试，这样无需手动启动浏览器。
使用 karma-phantomjs-bundled-launcher
安装
使用 npm 安装 karma-phantomjs-bundled-launcher
npm install karma-phantomjs-bundled-launcher --save-dev
配置 karma.conf.js
在 karma.conf.js 中添加以下配置，在 browsers 数组中加入 PhantomJS_custom。PhantomJS_custom 是在 customLaunchers 中定义的浏览器名称。
-- -------------------- ---- -------
-------------- - ---------------- -
------------
-- ---
----------- ------------
--------- ---------------------
---------------- -
----------------- -
----- ------------
-------- -
----------- ------------
--------- -
------------------- -----
--
--
------ -----------------------
------ ----
-
--
-- ---
--
-我们可以通过设置 options 配置项来配置 PhantomJS 的具体行为，例如上面的配置项中设置了 windowName 为 my-window，禁用了浏览器的安全模式。使用 flags 配置项可以设置传递给 PhantomJS 的命令行参数。设置 debug 为 true 可以启动 PhantomJS 与 Karma 之间的调试模式，方便我们调试代码。
如果你使用的是 Webpack 或 Browserify，你可以通过设置 client 配置项添加 Karma 测试框架自定义配置。例如，在 webpack.js 中，可以添加以下配置：
-- -------------------- ---- -------
-------------- - -
-- ---
------ -
----------------- -
-------- -
-- ---
-
-
-
-示例代码
这里提供一个 karma-phantomjs-bundled-launcher 的示例代码。在 test.js 中编写端到端测试。
describe('e2e test', function() {
it('should display user name after login', function() {
browser.get('http://localhost:8080');
element(by.model('name')).sendKeys('user');
element(by.buttonText('Login')).click();
expect(element(by.binding('name')).getText()).toEqual('Welcome user');
});
});总结
karma-phantomjs-bundled-launcher 为我们的端到端测试提供了便利，无需手动启动浏览器，可以在 Karma 测试框架中直接使用 PhantomJS 无头浏览器，使得我们能够更便捷的进行端到端测试。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066efe4c49986ca68d8ad0