0

我正在使用命令行中的Web組件測試器在我的Polymer組件上運行基於燈具的測試。測試成功Chrome(v.47),但在Firefox中失敗(v.42)。問題在於,在我的Polymer組件中的某些更改觀察器功能中,預期的數據正在Chrome中收到,但在Firefox中爲空,導致後者中的測試失敗。以下是必要的代碼:web-component-tester:測試在Chrome中成功,但在Firefox中失敗

聚合物組分: 聚合物({ 是: '組件名',

properties: { 
    data: { 
    type: Array, 
    observer: '_dataChanged' 
    }, 
    _dataChanged: function() { 
    process(this.data) // this line 
    ... 
    }, 
    ... 

在Chrome中, 'this.data' 在上述的 「這條線」 的值是非空的,無論在html中是否通過,這使得我的測試用例成功。 但是在Firefox中,從事件接收的'this.data'的值是一個空數組[],導致所述測試任何想法爲什麼是這樣的情況?

我也試過在事件監聽器中包裝我的測試套件fo r'WebComponentsReady'事件,儘管Web組件測試程序已確保只有在此類事件觸發後套件纔會啓動。這種方法在Chrome中仍然有效,但在Firefox中仍然失敗。

回答

1

更改_dataChanged法取數據值作爲參數,就像這樣:

properties: { 
    data: { 
    type: Array, 
    observer: '_dataChanged' 
}, 
_dataChanged: function(data) { 
    process(data); 
... 
} 

我不認爲聚合物保證了物業的價值將在這種情況下還時設置觀察員被解僱。

+0

嗨狗,我試過這個,但它仍然沒有在Firefox中產生非空數組。在Chrome中,測試仍然成功。謝謝,壽。 – geddevrel

+0

@gedestech,你能提供一個更大的代碼範例嗎?例如什麼是在元素上設置數據屬性,測試是什麼樣的等等。 – Dogs

+0

通過重新安排腳本中的動作並在「WebComponentsReady」事件中顯式地執行測試套件,解決了該問題,測試人員應該照顧那種興奮。我將在代碼模式中更詳細地回答這個問題。 – geddevrel

0

一個修復我發現(不是沒有僥倖)是在以下的圖案來構造夾具和測試腳本:

夾具(HTML):

<html> 
    <head> 
    ... 
    <script src="../web-component-tester/browser.js"></script> 
    ... 
    <script src="test-script.js"></script> 
    ... 
    </head> 
    <body> 
    ... 
    <my-component ...></my-component> 
    ... 
    </body> 
</html> 

測試的script.js:

document.addEventListener("WebComponentsReady", function() { 
    ... 
    // some code that changes the data of my-component 
    // (needed for correct state of the test cases) 
    ... 
    runTests(); 
} 

function runTests() { 
    suite('Test suite for my-component', function(){ 
    ... 
    }); 
} 

上述模式適用於Chrome和Firefox。由於Web組件測試人員已經在偵聽「WebComponentsReady」,所以它有點多餘,但上面添加的事件偵聽器是測試在Firefox上工作的原因。

我聽說Firefox在管理組件層次結構的「就緒」事件方面還不像Chrome那樣健壯或穩定。這可能與問題有關。

相關問題