无法弄清楚如何在 Ember 运行循环中包装函数

Question

我有一个组件，集成了2个第三方库，imagesLoaded和同位素。

在浏览器和cli模式下运行测试时，我得到冲突的测试失败。错误是:

Error: Assertion Failed: You have turned on testing mode, which disabled the run-loop's autorun. You will need to wrap any code with asynchronous side-effects in a run

或

TypeError: 'undefined' is not an object (evaluating 'self.$().isotope')

当我尝试在ember运行循环中包装回调时，它们在cli模式下通过，但在浏览器模式下失败。我似乎找不到合适的组合。这个问题似乎发生在imagesLoaded的回调中，好像我删除了那个插件，它似乎通过了。

我已经尝试了多种组合，但这里是我的最新代码。如果有人知道如何在这个组件中正确使用run循环，那将会很有帮助。

handleLoad: function() {
  let self = this;
  Ember.run.scheduleOnce('afterRender', this, function(){      
    self.$().imagesLoaded( function() {
        Ember.run(function() {
          self.$().isotope({itemSelector: ".card-container"});
          self.$().isotope('shuffle');
        });
    }); // imagesLoaded
  }); // Ember.run
}.on('didInsertElement')

Answer 1

您必须将现有代码包装在

中

Ember.run(function () {
//  Ember.run.scheduleOnce('afterRender....
});

告诉Ember运行循环从哪里开始和结束——在生产/开发中，这是Ember自己为你做的，但在测试中，你必须包装它。

作为替代，您可以开始&通过显式调用手动结束运行循环(参见API文档):

Ember.run.begin() // <-- tell Ember that your starting a run loop
//Ember.run.scheduleOnce('afterRender', ...
//more ember run loops here
Ember.run.end(); // <-- tell Ember that the run loop ends here