From b87caead475ad47a98bbead7adabe96f2a449aef Mon Sep 17 00:00:00 2001
From: Henrik Skupin <mail@hskupin.info>
Date: Sat, 9 May 2020 15:06:30 +0000
Subject: [PATCH] Bug 1636557 - [remote] Return class name and description for
 DOM nodes in Runtime.callFunctionOn and Runtime.evalute.
 r=remote-protocol-reviewers,maja_zf

Differential Revision: https://phabricator.services.mozilla.com/D74454
---
 .../content/runtime/ExecutionContext.jsm      |  5 +++
 .../browser_callFunctionOn_returnByValue.js   | 36 +++++++++++++------
 .../test/browser/runtime/browser_evaluate.js  | 34 +++++++++++++-----
 3 files changed, 55 insertions(+), 20 deletions(-)

diff --git a/remote/domains/content/runtime/ExecutionContext.jsm b/remote/domains/content/runtime/ExecutionContext.jsm
index ed297712a990..d8afffa2695d 100644
--- a/remote/domains/content/runtime/ExecutionContext.jsm
+++ b/remote/domains/content/runtime/ExecutionContext.jsm
@@ -414,6 +414,11 @@ class ExecutionContext {
         result.subtype = "typedarray";
       } else if (Node.isInstance(rawObj)) {
         result.subtype = "node";
+        result.className = ChromeUtils.getClassName(rawObj);
+        result.description = rawObj.localName || rawObj.nodeName;
+        if (rawObj.id) {
+          result.description += `#${rawObj.id}`;
+        }
       }
       return result;
     }
diff --git a/remote/test/browser/runtime/browser_callFunctionOn_returnByValue.js b/remote/test/browser/runtime/browser_callFunctionOn_returnByValue.js
index c4dda855cea6..97790d6eef87 100644
--- a/remote/test/browser/runtime/browser_callFunctionOn_returnByValue.js
+++ b/remote/test/browser/runtime/browser_callFunctionOn_returnByValue.js
@@ -3,8 +3,6 @@
 
 "use strict";
 
-const TEST_DOC = toDataURL("default-test-page");
-
 add_task(async function returnAsObjectTypes({ client }) {
   const { Runtime } = client;
 
@@ -23,27 +21,43 @@ add_task(async function returnAsObjectTypes({ client }) {
     { expression: "[1, 2]", type: "object", subtype: "array" },
     { expression: "new Proxy({}, {})", type: "object", subtype: "proxy" },
     { expression: "new Date()", type: "object", subtype: "date" },
-    { expression: "document", type: "object", subtype: "node" },
-    { expression: "document.documentElement", type: "object", subtype: "node" },
     {
-      expression: "document.createElement('div')",
+      expression: "document",
       type: "object",
       subtype: "node",
+      className: "HTMLDocument",
+      description: "#document",
+    },
+    {
+      expression: `{{
+        const div = document.createElement('div');
+        div.id = "foo";
+        return div;
+      }}`,
+      type: "object",
+      subtype: "node",
+      className: "HTMLDivElement",
+      description: "div#foo",
     },
   ];
 
-  for (const { expression, type, subtype } of expressions) {
+  for (const entry of expressions) {
+    const { expression, type, subtype, className, description } = entry;
+
     const { result } = await Runtime.callFunctionOn({
       functionDeclaration: `() => ${expression}`,
       executionContextId,
     });
-    is(
-      result.subtype,
-      subtype,
-      `Evaluating '${expression}' has the expected subtype`
-    );
+
     is(result.type, type, "The type is correct");
+    is(result.subtype, subtype, "The subtype is correct");
     ok(!!result.objectId, "Got an object id");
+    if (className) {
+      is(result.className, className, "The className is correct");
+    }
+    if (description) {
+      is(result.description, description, "The description is correct");
+    }
   }
 });
 
diff --git a/remote/test/browser/runtime/browser_evaluate.js b/remote/test/browser/runtime/browser_evaluate.js
index f1dbf9c32c8f..19fa4bd7102e 100644
--- a/remote/test/browser/runtime/browser_evaluate.js
+++ b/remote/test/browser/runtime/browser_evaluate.js
@@ -205,24 +205,40 @@ add_task(async function returnAsObjectTypes({ client }) {
     { expression: "[1, 2]", type: "object", subtype: "array" },
     { expression: "new Proxy({}, {})", type: "object", subtype: "proxy" },
     { expression: "new Date()", type: "object", subtype: "date" },
-    { expression: "document", type: "object", subtype: "node" },
-    { expression: "document.documentElement", type: "object", subtype: "node" },
     {
-      expression: "document.createElement('div')",
+      expression: "document",
       type: "object",
       subtype: "node",
+      className: "HTMLDocument",
+      description: "#document",
+    },
+    {
+      expression: `(() => {{
+        const div = document.createElement('div');
+        div.id = "foo";
+        return div;
+      }})()`,
+      type: "object",
+      subtype: "node",
+      className: "HTMLDivElement",
+      description: "div#foo",
     },
   ];
 
-  for (const { expression, type, subtype } of expressions) {
+  for (const entry of expressions) {
+    const { expression, type, subtype, className, description } = entry;
+
     const { result } = await Runtime.evaluate({ expression });
-    is(
-      result.subtype,
-      subtype,
-      `Evaluating '${expression}' has the expected subtype`
-    );
+
     is(result.type, type, "The type is correct");
+    is(result.subtype, subtype, "The subtype is correct");
     ok(!!result.objectId, "Got an object id");
+    if (className) {
+      is(result.className, className, "The className is correct");
+    }
+    if (description) {
+      is(result.description, description, "The description is correct");
+    }
   }
 });