Fix "Get Text" to retrieve the correct value for ShadowRoot using slot.

whimboo · whimboo · commit caaa83fd6b2f · 2024-01-02T10:05:03.000+01:00
diff --git a/javascript/atoms/dom.js b/javascript/atoms/dom.js
@@ -1325,7 +1325,9 @@ bot.dom.appendVisibleTextLinesFromNodeInComposedDom_ = function(
         } else {
           shadowChildren = contentElem.assignedNodes();
         }
-        goog.array.forEach(shadowChildren, function(node) {
+        const childrenToTraverse =
+          shadowChildren.length > 0 ? shadowChildren : contentElem.childNodes;
+        goog.array.forEach(childrenToTraverse, function (node) {
           bot.dom.appendVisibleTextLinesFromNodeInComposedDom_(
               node, lines, shown, whitespace, textTransform);
         });
diff --git a/javascript/atoms/test/text_shadow_test.html b/javascript/atoms/test/text_shadow_test.html
@@ -71,7 +71,31 @@
 
       let customEl = findElement({ tagName: 'open-shadow-element' });
       let text = getText(customEl);
-      assertEquals(text, 'full link text');
+      assertEquals('full link text', text);
+    }
+
+    function testTextForSlotValueInShadowDOM() {
+      setCustomElement('<slot><span>full</span></slot>');
+
+      let customEl = findElement({ id: 'custom-text' });
+      let text = getText(customEl);
+      assertEquals('custom', text);
+    }
+
+    function testTextForSlotAndExtraValueInShadowDOM() {
+      setCustomElement('<slot><span>full</span></slot> text');
+
+      let customEl = findElement({ id: 'custom-text' });
+      let text = getText(customEl);
+      assertEquals('custom text', text);
+    }
+
+    function testTextForDefaultSlotValueInShadowDOM() {
+      setCustomElement('<slot><span>full</span></slot> text');
+
+      let customEl = findElement({ tagName: 'open-shadow-element' });
+      let text = getText(customEl);
+      assertEquals('full text', text);
     }
 
     function testHiddenTextInShadowDOM() {
@@ -81,21 +105,22 @@
 
       let customEl = findElement({ tagName: 'open-shadow-element' });
       let text = getText(customEl);
-      assertEquals(text, 'full text');
+      assertEquals('full text', text);
     }
 
     function testTextForElementWithinClosedShadowDOM() {
       setCustomElement('<a href=# id=linkText>full link text</a>', 'closed');
       let customEl = findElement({ tagName: 'closed-shadow-element' });
       let innerEl = findElement({ css: 'a' }, customEl._shadowRoot);
       let text = getText(innerEl);
-      assertEquals(text, 'full link text');
+      assertEquals('full link text', text);
     }
   </script>
 </head>
 
 <body>
   <open-shadow-element></open-shadow-element>
+  <open-shadow-element id="custom-text">custom</open-shadow-element>
   <closed-shadow-element></closed-shadow-element>
 </body>
 
