量角器：使用畫布元素 - ng-if/ng-show

我是新量角器和角度JS頁面。量角器：使用畫布元素 - ng-if/ng-show

對於我的end2end測試，我需要驗證，如果我的畫布已收到至少一個圖像（有一個websocket.io這填充在此畫布中的一些圖像）。

現在我應該驗證是否畫布開始接收該圖像。

<div class="terminal-screenshots" ng-class="{ online: isConnected() && vm.hasImage }"> 
 
     <canvas ng-show="isConnected() && vm.hasImage" style="width: 100%;" id="remoteTerminalCanvas"></canvas> 
 
     <span ng-if="!isConnected() || !vm.hasImage"> 
 
      {{ vm.display.message | translate }} 
 
     </span> 
 
</div> 
 
\t

這是我的期望：

我的HTML頁面

expect(element(by.id('remoteTerminalCanvas')).isDisplayed()).toBe(true);

但它返回true第一圖像在畫布上顯示出來了。

來源

2016-12-26 Guilherme Leindecker

我沒有在畫布上工作很多，但在畫面填充之後畫布的高度會發生變化嗎？如果是這樣，你可以使用'browser.wait（）'等到畫布的高度大於零。 – finspin

嘿，隊友，謝謝你的回答：D 你有沒有關於它的例子？（驗證如果畫布大於零） –

@ alecxe的答案正是我想到的。讓我們知道它是否有效。 – finspin

正如@finspin指出的那樣，您的canvas元素可能始終可見，但同時爲0高度。您可以等待height值是通過大於零browser.wait()和getSize()：

var canvas = element(by.id('remoteTerminalCanvas')); 
browser.wait(function() { 
    return canvas.getSize().then(function (size) { 
     return size.height > 0; 
    }); 
}, 5000);

另一種選擇是等待hasImage通過browser.wait()和evaluate()成爲真正：

var canvas = element(by.id('remoteTerminalCanvas')); 
browser.wait(function() { 
    return canvas.evaluate("vm.hasImage").then(function (hasImage) { 
     return hasImage; 
    }); 
}, 5000);

來源

2016-12-27 01:39:03 alecxe

感謝您的回答！第一個選項對我來說工作得很好。但我認爲第二個選擇更好，因爲使用hasImage檢查畫布是否至少收到一個圖像。但是，當我跑我的天賦，我面臨這個錯誤wirh評估方法 - 失敗：未知的錯誤：如果你想感謝 –

@GuilhermeLeindecker無法讀取屬性未定義「$ EVAL」我可以提供完整的堆棧嗯，以前沒見過這種錯誤。你在最新的量角器？如果你改變了'vm.hasImage'到'VM && vm.hasImage' .. – alecxe

量角器--version 版本4.0.14 谷歌Chrome瀏覽器版本：54 代碼回報canvas.evaluate（'VM && VM。 hasImage'）同樣的錯誤 –

量角器：使用畫布元素 - ng-if/ng-show

回答

相關問題