考虑这个AngularJs应用程序
<!DOCTYPE html>
<html>
<head>
<title>
AngularJs insert text after bold checked
</title>
<script src="lib/angular/angular.js"></script>
<script type="text/javascript">
var app = angular.module('ngTestBoldInsert', []);
app.controller('ngCtrl', function ($scope) {
$scope.boldButtonClicked = function () {
document.execCommand('bold', false, null);
};
});
</script>
</head>
<body>
<div ng-app="ngTestBoldInsert" ng-controller="ngCtrl">
<h2>Edit text after click on checkbox</h2>
<label for="boldButtonId">Bold</label>
<input id="boldButtonId" type="checkbox" ng-change="boldButtonClicked()" ng-model="boldStatus">
<br /><br />
<div id="textFrame" contenteditable="true" style="padding:10px; border:1px solid black; width:30%; ">text</div>
</div>
<p>Manual: click on edit frame, input text, Click on 'bold' checkbox. click on edit frame, input some text. Now the text is bold. <br /><br />Please note that this is a simplification, in real application the bold button status is synced with the status of the text but that would make this example very complicated.</p>
</body>
</html>
而这个量角器测试：
'use strict';
describe('text editor', function() {
var textFrame = element(by.id('textFrame'));
var boldCheckbox = element(by.id('boldButtonId'));
it('should insert normal text', function() {
browser.get('index.html#!/');
var text = textFrame.getText();
expect(text).toBe('text');
textFrame.click();
textFrame.sendKeys(' plus normal text');
text = textFrame.getText();
expect(text).toBe('text plus normal text');
var html = browser.executeScript("return arguments[0].innerHTML;", textFrame);
expect(html).toBe('text plus normal text');
});
it('should insert bold text', function() {
boldCheckbox.click();
textFrame.click();
textFrame.sendKeys('plus bold text');
var text = textFrame.getText();
expect(text).toBe('text plus normal textplus bold text');
var html = browser.executeScript("return arguments[0].innerHTML;", textFrame);
expect(html).toBe('text plus normal text<b>plus bold text</b>');
});
});
此测试工作到 chromedriver_76.0.3809.68
并在 chromedriver_77.0.3865.40 中损坏
由 Web 驱动程序更新导致：https://bugs.chromium.org/p/chromedriver/issues/detail?id=2704
文本在测试中不再加粗。
测试的输出：
Expected 'text plus normal textplus bold text' to be 'text plus normal text<b>plus bold text</b>'.
现在如何测试？
首先，尝试element.getAttribute("innerHTML")
如果没有帮助，请执行element.getAttribute("outterHTML")它会返回一个字符串，例如<div id="textFrame" contenteditable="true" style="padding:10px; border:1px solid black; width:30%; ">text plus normal text<b>plus bold text</b></div>，所以只需执行expect(html).toContain('text plus normal text<b>plus bold text</b>');
在最坏的情况下，如果您不想走这条路，您别无选择，只能向 chromedriver 团队报告错误，我建议无论如何都要这样做，因为它的社区驱动努力
使用 w3c/webdriver 团队提到的操作 https://github.com/w3c/webdriver/issues/1469
操作 API：https://w3c.github.io/webdriver/#actions
而不是 textFrame.click(( 和 textFrame.sendKeys 用 法典：
browser.actions().click(textFrame).sendKeys('text plus normal textplus bold text').perform();