页面生命周期早期的 PhantomXHR + CasperJS

Question

我正在使用 PhantomXHR along with CasperJS 来实现前端功能测试以及已删除的 AJAX 请求。

伪造的 XHR 请求和存根响应在已经初始化的页面中效果很好，AJAX 请求由用户操作（例如点击或键入）触发。

但是，当我试图在页面加载时初始化一个伪造的 XHR 请求时，我无法让它工作。这是一个错误，还是推荐的解决方法？

我在我的 SPA 中使用 Marionette 和 Backbone，并且在模板初始化时，如果满足某些条件，则会进行 AJAX 调用。无论我做什么，我都无法让 PhantomXHR 伪造这个请求。

我尝试在调用 casper.start('http://localhost:3000/my/foo/bar') 之前初始化 PhantomXHR 和伪造的请求，我尝试调用 casper.start()，初始化 PhantomXHR 然后执行 casper.open('http://localhost:3000/my/foo/bar')，似乎没有任何效果。谁能告诉我这样做的正确方法？

Answer 1

原来这是一个范围和操作顺序问题。通过在 CasperJS 甚至启动之前定义变量 fake，然后在我什至导航到任何地方之前将该假变量初始化为 page.initialized CasperJS 事件中的一个变量，fake 变量的范围正确并且可以访问我的测试。

var fakes = require('../base_fakes.js')
var fake = null

// Ensure that posts are being properly loaded into the UI with a stubbed XHR request
// to fetch the posts from the server
casper.test.begin('Loading stuff in the thing works', 5, function suite(test) {
  casper.start();
  casper.on('page.initialized', function(resource){
    xhr.init(casper.page, {
      libraryRoot: '../../../node_modules/phantomxhr/'
    })

    fake = xhr.fake(fakes.things_index)
  })

  casper.then(function() {
    casper.open('http://localhost:3000')
    this.wait(2000, function() {
      console.log("test")
      console.log(fake.count());
      this.capture('screenshot1.png')
    })
  })

页面生命周期早期的 PhantomXHR + CasperJS

PhantomXHR + CasperJS early in a page's lifecycle

ajax

phantomjs

sinon

casperjs