聚合物單元測試嘲笑依賴關係

我剛開始聚合物。我試圖單元測試有依賴關係的自定義元素，我想假冒/模擬這些。我發現了Scott Miles關於如何模擬core-ajax實現的建議。我認爲我可以很容易地遵循這種模式，但只有當我的元素沒有導入要被嘲笑的元素（在這種情況下爲核心ajax）時，這纔會起作用。如果確實導入它，那麼當測試嘗試運行時，我得到聚合物單元測試嘲笑依賴關係

'未捕獲的NotSupportedError：未能在'Document'上執行'registerElement'：類型'core-ajax'的註冊失敗。具有該名稱的類型已被註冊。

如果我可以做一些像document.unregister core-ajax元素，並在我的測試中再次導入它，Id是一個更快樂的開發！聚合物很棒，但如果我不能單元測試它，那麼它會帶來很大的風險（至少在構建需要維護/更改的應用程序時）

你們是如何解決這個問題的？我一直在挖掘Polymer和PolymerLab元素回購，並且大多數都缺乏測試。到目前爲止，我還沒有找到如何做到這一點的很多參考。

感謝您的幫助！

聖地亞哥

斯科特的建議是：

代替進口核心AJAX /核心ajax.html的，創建自己的核心AJAX元素。

<polymer-element name="core-ajax" attributes="response"> 
<script> 
    Polymer('core-ajax', { 
    attached: function() { 
     this.response = ['a', 'b', 'c']; 
    } 
}); 
</script> 
</polymer-element>

很明顯，這只是一個例子，實際的實現取決於期望的模擬行爲。

這只是解決它的一種方法，還有很多其他的方法。我很想聽聽你方便的地方。

來源

2014-09-29 sesteva

同上。雙重錯誤包括痛苦。不知道如何解決這個問題呢。 – David 2014-10-29 15:29:47

被引用的解決方案是從https://stackoverflow.com/questions/24531473/how-do-i-mock-polymer-core-ajax-for-unit-testing – dskrvk 2016-04-12 22:34:52

您可以嘗試使用js命令註冊它，或者擴展您正在測試的每個單個元素，並覆蓋您想要模擬的屬性或方法。我認爲這只是它。這就像我的谷歌地圖自定義元素，我導入谷歌地圖和改變的東西左右，像這樣：

<polymer-element name="core-gmaps" attributes="lat long mapzoom markerlat markerlong markertitle" extends="google-map"> 
    <template> 
     <style> 
     :host{ 
      width: 100%; 
     } 
     #vivaMap { 
      display: block; 
      height: 100%; 
      width: 100%;    
     } 
     </style> 
     <google-map id="vivaMap" latitude="0" longitude="0" zoom="18"> 
      <google-map-marker id="vivaMarker" title="" latitude="0" longitude=""></google-map-marker> 
     </google-map> 
    </template> 
    <script> 

    Polymer("core-gmaps",{ 
    ready: function(){ 

     var map = this.$.vivaMap; 
     map.latitude = Number(this.getAttribute('lat')); 
     map.longitude = Number(this.getAttribute('long')); 
     map.zoom = Number(this.getAttribute('mapzoom')); 

     var mapMarker = this.$.vivaMarker; 
     mapMarker.latitude = Number(this.getAttribute('markerlat')); 
     mapMarker.longitude = Number(this.getAttribute('markerlong')); 
     mapMarker.title = this.getAttribute('markertitle'); 
     /*map.addEventListener('google-map-ready', function(e) { 
      console.log('Map loaded!'); 
     });*/ 
    } 
    }); 
    </script> 
</polymer-element>

我仍然不知道，如果它是值得的專業（我可能最終不使用它），但在智力上完全值得。學到了一些好東西。因爲我擴展谷歌地圖它只獲得一次註冊。

編輯：
在我的情況下，我使用的準備情況，因爲我不能操縱在地圖本身沒有它至少準備。但您可以從生命週期方法中選擇事件回調。
列表是here。
附註：是的，我沒有使用數據綁定，因爲我不能。谷歌地圖API是抱怨它是NaN所以我不得不施放它。

來源

2014-12-03 18:25:51

這個問題有點老了。我想提供一個更新，因爲這是一個很常見的情況。

聚合物CLI是單元測試聚合物單元的推薦方法。它用於測試的底層庫稱爲Web組件測試器（WCT）。 WCT支持存根元素。基本上，如果你的一個測試依賴於另一個元素來返回數據，你可以創建一個總是返回一致數據的元素的存根。

JS在單元測試碼用於指定存根元件：

setup(function() { 
    replace('paper-button').with('fake-paper-button'); 
});

元進行測試：

：

<dom-module id='x-el'> 
    <template> 
    <paper-button id="pb">button</paper-button> 
    </template> 
</dom-module>

在測試運行時，內容模板將作爲被衝壓出

<dom-module id='x-el'> 
    <template> 
    <fake-paper-button id="pb">button</fake-paper-button> 
    </template> 
</dom-module>

https://www.polymer-project.org/1.0/docs/tools/tests#create-stub-elements

來源

2016-06-15 16:55:30

你能提供一個什麼假紙按鈕的例子會看起來像？ – abendigo 2016-06-29 14:24:54

聚合物單元測試嘲笑依賴關係

回答

相關問題