学习笔记《PhantomJS》

因为要找的一个前端的 Browser Testing 解决方案，看下来 PhantomJS 是比较合适的，但是前端做 Browser Testing 确实比较麻烦，登录态、Seed、数据伪造等等

PhantomJS 的安装：

npm -g install phantomjs-prebuilt

实现一个拖拽效果的测试用例，代码如下（省略了为实现登录，异常复杂的代码）：

var page = require('webpage').create();
page.viewportSize = { width: 1440, height: 1080 };
page.open('http://www.darwin.com/teach/course/1', function () {
  setTimeout(function () {
    page.sendEvent("mousedown", 180, 180);
    page.sendEvent("mousemove", 180, 240);
    page.sendEvent("mouseup", 180, 240);
    page.render('finish.png');
    phantom.exit();
  }, 2000);
});

PhantomJS 支持的函数：

page.childFramesCount
page.childFramesName
page.close
page.currentFrameName
page.deleteLater
page.destroyed
page.evaluate
page.initialized
page.injectJs
page.javaScriptAlertSent
page.javaScriptConsoleMessageSent
page.loadFinished
page.loadStarted
page.openUrl
page.release
page.render
page.resourceError
page.resourceReceived
page.resourceRequested
page.uploadFile
page.sendEvent
page.setContent
page.switchToChildFrame
page.switchToMainFrame
page.switchToParentFrame
page.addCookie
page.deleteCookie
page.clearCookies

PhantomJS 认为自己并不是一个测试框架，只是为其他的测试框架提供支持而已，在官网有罗列其支持的测试框架：

PhantomJS itself is not a test framework, it is only used to launch the tests via a suitable test runner.

The following table summarizes the list of various test frameworks and the corresponding test runners. If the framework does not need an external/third-party runner, it is marked as “built-in”.

http://phantomjs.org/headless-testing.html

目前 PhantomJS 还不能很好的支持 ES6，但是 2.5 Beta 版本是可以支持的，目前团队正在为这个目标努力：
https://github.com/Medium/phantomjs/issues/668

下载 2.5 Beta 以后还需要一些额外的操作，后续版本应该会 fix 这些问题：

brew install webp

cd /usr/local/opt/webp/lib
cp libwebp.{7,6}.dylib

勉强可以用，但是因为 PhantomJS 的定位非常底层，真的要一个一个写测试用例，还需要自己来设计代码结构，实际上会异常的复杂，看来 Karma 这样的 Runner 真的是必不可少的