使用 guard 和 jasmine 进行无头测试 Ember 应用程序答案

【问题标题】：Headless testing Ember application with guard and jasmine使用 guard 和 jasmine 进行无头测试 Ember 应用程序
【发布时间】：2012-04-06 20:06:56
【问题描述】：

我正在尝试使用 jasmine 和 guard 来测试我的 rails 3.2 应用程序的基于 ember 的前端。为此，我使用 jasminerice 和guard-jasmine，phantomjs。设置非常简单，我可以运行一些示例规范。当谈到玩 ember 时，事情变得很疯狂。我有下面的规范来测试视频阅读器类。调用 loadVideo 方法时，应该将 videoHeight 和 videoWitdh 属性设置为对应的视频 DOM 元素的值。当我在浏览器上运行 jasmine 时，测试通过了，但是当我使用 guard 和 phantomjs 运行它时，它失败了。我得到“期望未定义等于 640”。在 phantomjs 上运行测试时，似乎我的 DOM 元素没有考虑在内。

describe "VideoReader", ->
  it "loads video from video DOM element", ->
    videoDOM = Ember.$("<video width='640' height='480'><source src='/test.mp4'></source></video>")[0];

    player = Topper.VideoReader.create();

    player.loadVideo(videoDOM);

    videoHeight = player.get('videoHeight');
    videoWidth  = player.get('videoWidth');

    expect(videoHeight).toEqual(480);
    expect(videoWidth).toEqual(640);

我的规范写对了吗？

【问题讨论】：

标签： ember.js jasmine phantomjs

【解决方案1】：

您应该阅读有关 Testing in Ember.js 的博文。

我不知道您的 Topper.VideoReader 是什么样的，但我猜您的问题与在 DOM 上操作某些内容有关，而不是让 Ember.js 有机会传播这些更改。在您的测试中，您应该将与绑定交互或正在操作 DOM 的调用包装在 Ember.run(function(){...}) 调用中，如测试中所见，例如 child_views_test.js。

以下讨论的摘要：

如果您要测试的代码与 DOM 交互，请将其包装在 Ember.run 调用中。
如果您想测试代码中触发的事件并且您无法控制它们何时触发，请使用测试框架中的异步测试功能，例如 QUnit 的 asyncTest

【讨论】：

我的 loadVideo 方法看起来像： loadVideo: function(videoDOM) { this.set('videoHeight',videoDOM.height); this.set('videoWidth',videoDOM.width); },
您是否尝试过将您的loadVideo 调用封装到Ember.run(function(){ player.loadVideo(videoDOM); }); 中？
感谢您提供的链接，这很有帮助。
我做到了，我明白我的问题是由于视频元素在我的预期之后触发事件。所以当我评估我的属性时，还没有设置。如何让我的测试在评估期望之前等待特定事件？
我们在这里谈论什么样的事件？绑定？