[英]How to test existence of element in polymer?
我在聚合物组件中遇到此问题,无法找到我要面对的地方。 以下是我的代码:
<dom-module id="invoice-history">
<template>
<template is="dom-if" if="{{!_isHistoryPresent(invoiceListHistory)}}" >
<div class="no-message">{{noDataMessage}}</div>
</template>
<style include="invoice-history-styles"></style>
</template>
<script>
Polymer({
is: 'invoice-history',
properties: {
invoiceListHistory: Array
},
_isHistoryPresent: function (history) {
var hp = true;
if(history){
hp = history.every(function (invoice) {
return invoice.txnStatus == null;
});
}else {
this.message = "history not present";
}
return !hp;
}
});
</script>
</dom-module>
以下是我的测试(我已经按照期望编写了输出):
<test-fixture id="invoice-history-fixture">
<template>
<invoice-history></invoice-history>
</template>
</test-fixture>
var invoiceListHistory = [good values]
before(function () {
iHistory = fixture('invoice-history-fixture');
});
context('dom manipulation tests', function () {
it('Should display no data message if there is no data', function (done) {
iHistory.setAttribute('invoice-list-history', invoiceListHistory);
iHistory.setAttribute('no-data-message', "It doesn't have data");
window.setTimeout(function () {
expect(Polymer.dom(iHistory.root).querySelector('.no-message').textContent).to.be.equal("XYZ"); // expected 'It doesn't have data' to equal 'XYZ'
expect(Polymer.dom(iHistory.root).querySelector('.no-message')).to.be.visible; // It passes
expect(qHistoryEl.message).to.be.equal('ABCD'); // expected 'history not present' to equal 'ABCD'
expect(window.getComputedStyle(Polymer.dom(iHistory.root).querySelector('.no-message'), null).getPropertyValue('visibility')).to.be.equal('jkl');
// expected 'visible' to equal 'jkl'
done();
}, 0);
});
});
First Expect(...)的结果是可以理解的。 但是第二期望(...)如何通过?
最重要的可能是根本原因,这是在Third Expect(...)中,它表示expected 'history not present' to equal 'ABCD'
。 这意味着代码将转到_isHistoryPresent()方法内的else {}块。 怎么样?
如何使用dom-if测试动态创建的元素的存在?
我距离Polymer专家还很远-我现在只是自己学习。 但是似乎“ setAttribute”不是分配invoiceListHistory.
的正确方法invoiceListHistory.
您还可以指定有关invoiceListHistory的更多详细信息。 像这样的东西:
// properties for your element
properties: {
"invoiceListHistory": {
type: Array,
// I'd do this if you want it to be exposed via attribute,
// but that seems weird to me with an array
reflectToAttribute: true,
value: []
},
"noDataMessage": {
type: String,
value: "No data available";
}
}
// Then in your test
iHistory.invoiceListHistory = invoiceListHistory;
Aaaand我刚刚注意到这个问题是从7月10日开始的,所以我确定您现在已经解决了这个问题。 没关系 -_-
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.