title: How to test AngularJs with protractor, contenteditable with 'bold' modifier, broken since webdriver update
body: <p>Consider this AngularJs app</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;
  AngularJs insert text after bold checked
  &lt;/title&gt;
  &lt;script src="lib/angular/angular.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
      var app = angular.module('ngTestBoldInsert', []);
      app.controller('ngCtrl', function ($scope) {
          $scope.boldButtonClicked = function () {            
              document.execCommand('bold', false, null);
          };
      });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div ng-app="ngTestBoldInsert" ng-controller="ngCtrl"&gt;
  &lt;h2&gt;Edit text after click on checkbox&lt;/h2&gt;
  &lt;label for="boldButtonId"&gt;Bold&lt;/label&gt;
  &lt;input id="boldButtonId" type="checkbox" ng-change="boldButtonClicked()" ng-model="boldStatus"&gt;
  &lt;br /&gt;&lt;br /&gt;
      &lt;div id="textFrame" contenteditable="true" style="padding:10px; border:1px solid black; width:30%; "&gt;text&lt;/div&gt;
  &lt;/div&gt;
      &lt;p&gt;Manual: click on edit frame, input text, Click on 'bold' checkbox. click on edit frame, input some text. Now the text is bold. &lt;br /&gt;&lt;br /&gt;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.&lt;/p&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And this protractor test:</p>
  
  <pre><code>'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&lt;b&gt;plus bold text&lt;/b&gt;');
      });
  
  });
  </code></pre>
  
  <p>This test works until chromedriver_76.0.3809.68</p>
  
  <p>and is broken in chromedriver_77.0.3865.40</p>
  
  <p>caused by webdriver update: <a href="https://bugs.chromium.org/p/chromedriver/issues/detail?id=2704" rel="nofollow noreferrer">https://bugs.chromium.org/p/chromedriver/issues/detail?id=2704</a></p>
  
  <p>Text is no longer bold in the test.</p>
  
  <p>output of the test:</p>
  
  <pre><code>Expected 'text plus normal textplus bold text' to be 'text plus normal text&lt;b&gt;plus bold text&lt;/b&gt;'.
  </code></pre>
  
  <p>How to test this now?</p>