Я провожу модульное тестирование компонента, в частности визуализируемой формы. Я подхожу к этому в значительной степени как описано в Руководствах по Ember.
В частности, компонент имеет три вычисляемых свойства, которые отображают разные классы отображаемых элементов в зависимости от базовой модели. Я настраиваю свойства в блоках Ember.run()
, а затем снова смотрю на визуализированный компонент.
Что интересно здесь, так это то, что вычисляемые свойства, кажется, не пересчитываются, даже если я касаюсь атрибута, который они наблюдают. Более поздние тесты, которые не проверяют отрисовку — только возврат от компонента — проходят.
Вот мой тестовый код:
moduleForComponent('wizard-tab', "Component - WizardTab", {
setup: function () {
this.tab = this.subject({ step: 2, stepCompleted: 1, tab: tabs.all()[1] });
}
});
test('#render', function () {
let tab = this.tab;
ok(this.$().find('span.wizard-tab-detail').length, "Active tab has a detail span"); // Passes
// Note that both of the additional states observe stepCompleted
// so I need to touch that to get them to recalculate
Ember.run( function () {
tab.set('stepCompleted', 2);
tab.set('tab', WizardTab.all()[4]);
});
ok(this.$().find('span.wizard-tab-icon-disabled').length, "Future tabs have a disabled class"); // Fails
Ember.run( function () {
tab.set('stepCompleted', 3);
tab.set('tab', WizardTab.all()[1]);
});
ok(this.$().find('span.wizard-tab-icon-done').length, "Inactive tabs have a done class"); // Fails
});
Первое утверждение проходит, следующие два терпят неудачу. Используя операторы console.log
, я проверил, что set()
работают, но свойство, вычисленное на их основе, возвращает неправильный результат.
Вот одно из вычисляемых определений свойств:
disabled: function() {
return this.get('tab.stepNumber') > (this.get('stepCompleted') + 1);
}.property('stepCompleted')
(Я буквально получаю false
за 5 > 2
, когда добавляю console.log
проверок для этого сравнения.) Есть ли что-то, что я упустил, что помешало бы этому обновлению при проверке последующих визуализаций компонента?
Это ember CLI 0.2.0, Ember 1.10.0 и ember-cli-qunit 0.3.8.
ETA: Вероятно, актуально: этот тест проходит на Ember 1.8 и ember-cli-qunit 0.3.1. Это обновление Ember CLI 0.2.0 и сопутствующие обновления Ember и ember-cli-qunit вызывают сбой.
(ETA: примечание из комментария kiwiupover ниже о том, что этот раздел ниже не имеет отношения к проблеме; руководства могут не показывать наилучший текущий способ сделать это.)
Обратите внимание, что в направляющих используется аналогичный шаблон:
test('changing colors', function() {
// this.subject() is available because we used moduleForComponent
var component = this.subject();
// we wrap this with Ember.run because it is an async function
Ember.run(function() {
component.set('name','red');
});
// first call to $() renders the component.
equal(this.$().attr('style'), 'color: red;');
// another async function, so we need to wrap it with Ember.run
Ember.run(function() {
component.set('name', 'green');
});
equal(this.$().attr('style'), 'color: green;');
});
Я попытался обернуть второе и третье утверждения в andThen()
, но это вызвало ошибки — andThen()
не определено.
andThen
не работает, спасибо. До сих пор не уверен, почему тесты терпят неудачу без них, хотя сейчас это звучит так, как будто точное следование примеру руководств — не самый надежный способ создания теста. - person pjmorse   schedule 13.03.2015