Consider tree above iframe when creating Node path

Combined with a recent change to the DOM agent backend, this supports
restoring the select Node in the elements panel upon refresh, even for
elements inside an iframe.

Example path:

0,HTML,1,BODY,0,DIV,0,IFRAME,d,#document,0,HTML,1,BODY,0,DIV

"d,#document" is always the first component after an IFRAME.

Bug: 40719145
Change-Id: I490968297e8e73e90f29a681d7226823f2bdd5df
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/5778499
Reviewed-by: Paul Irish <paulirish@chromium.org>
Commit-Queue: Connor Clark <cjamcl@chromium.org>

front_end/core/sdk/DOMModel.ts

diff --git a/front_end/core/sdk/DOMModel.ts b/front_end/core/sdk/DOMModel.ts
index 0d6432f..919e8a8 100644
--- a/front_end/core/sdk/DOMModel.ts
+++ b/front_end/core/sdk/DOMModel.ts
@@ -569,17 +569,34 @@
   }
 
   path(): string {
-    function canPush(node: DOMNode): number|false|null {
-      return (node.index !== undefined || (node.isShadowRoot() && node.parentNode)) && node.#nodeNameInternal.length;
+    function getNodeKey(node: DOMNode): number|'u'|'a'|'d'|null {
+      if (!node.#nodeNameInternal.length) {
+        return null;
+      }
+      if (node.index !== undefined) {
+        return node.index;
+      }
+      if (!node.parentNode) {
+        return null;
+      }
+      if (node.isShadowRoot()) {
+        return node.shadowRootType() === DOMNode.ShadowRootTypes.UserAgent ? 'u' : 'a';
+      }
+      if (node.nodeType() === Node.DOCUMENT_NODE) {
+        return 'd';
+      }
+      return null;
     }
 
     const path = [];
     let node: (DOMNode|null) = (this as DOMNode | null);
-    while (node && canPush(node)) {
-      const index = typeof node.index === 'number' ?
-          node.index :
-          (node.shadowRootType() === DOMNode.ShadowRootTypes.UserAgent ? 'u' : 'a');
-      path.push([index, node.#nodeNameInternal]);
+    while (node) {
+      const key = getNodeKey(node);
+      if (key === null) {
+        break;
+      }
+
+      path.push([key, node.#nodeNameInternal]);
       node = node.parentNode;
     }
     path.reverse();