[JS] [atoms] Use .textContent instead of .innerHTML in clear() action (#11504)

tosmolka · web-flow · commit 4f09bf0c744c · 2023-02-15T12:44:23.000+01:00
[js] [atoms] Use .textContent instead of .innerHTML in clear() action
diff --git a/javascript/atoms/action.js b/javascript/atoms/action.js
@@ -119,7 +119,11 @@ bot.action.clear = function (element) {
     // A single space is required, if you put empty string here you'll not be
     // able to interact with this element anymore in Firefox.
     bot.action.LegacyDevice_.focusOnElement(element);
-    element.innerHTML = goog.userAgent.GECKO ? ' ' : '';
+    if (goog.userAgent.GECKO) {
+      element.innerHTML = ' ';
+    } else {
+      element.textContent = '';
+    }
     var body = bot.getDocument().body;
     if (body) {
       bot.action.LegacyDevice_.focusOnElement(body);
diff --git a/javascript/atoms/test/action_test.html b/javascript/atoms/test/action_test.html
@@ -5,6 +5,7 @@
   <script src="test_bootstrap.js"></script>
   <script type="text/javascript">
     goog.require('bot.action');
+    goog.require('bot.locators');
     goog.require('goog.Promise');
     goog.require('goog.Uri');
     goog.require('goog.dom');
@@ -122,7 +123,9 @@
         expectBlurEvent(e);
         expectChangeEvent(e);
         bot.action.clear(e);
-        assertBlurFired();
+        if (goog.userAgent.IE) {
+          assertBlurFired();
+        }
         assertChangeFired();
         assertEquals('', e.value);
       });
@@ -197,6 +200,15 @@
       assertEquals("3", goog.dom.forms.getValue(e));
     }
 
+    function testClearingAIframeContentEditableArea() {
+      var iframe = goog.dom.getElement('iframe');
+      var iframeDoc = goog.dom.getFrameContentDocument(iframe);
+
+      var e = bot.locators.findElement({ id: 'content-editable' }, iframeDoc);
+      bot.action.clear(e);
+      assertEquals('', bot.dom.getVisibleText(e));
+    }
+
     function testSubmittingANonFormElementShouldResultInAnError() {
       assertThrows(goog.partial(bot.action.submit, document.body));
     }
@@ -300,5 +312,7 @@
     <div id="child-not-content-editable">child not content editable
     </div>
   </div>
+  <iframe id="iframe" src="testdata/trusted_types_iframe.html">
+  </iframe>
 </body>
 </html>
diff --git a/javascript/atoms/test/testdata/trusted_types_iframe.html b/javascript/atoms/test/testdata/trusted_types_iframe.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta http-equiv="Content-Security-Policy" content="require-trusted-types-for 'script';">
+  </head>
+  <body>
+    <div id="content-editable" contentEditable="true">This is a contentEditable area
+      <div id="child-content-editable">child content editable
+      </div>
+    </div>
+  </body>
+</html>
