fix(op_crates/web): Add customInspect for Location (#9290)

cli/tests/070_location.ts.out

@@ -1,20 +1,15 @@
 [WILDCARD][Function: Location]
 Location { [Symbol(Symbol.toStringTag)]: "Location" }
 Location {
-  hash: [Getter/Setter],
-  host: [Getter/Setter],
-  hostname: [Getter/Setter],
-  href: [Getter/Setter],
-  origin: [Getter],
-  pathname: [Getter/Setter],
-  port: [Getter/Setter],
-  protocol: [Getter/Setter],
-  search: [Getter/Setter],
-  ancestorOrigins: [Getter],
-  assign: [Function: assign],
-  reload: [Function: reload],
-  replace: [Function: replace],
-  toString: [Function: toString]
+  hash: "#bat",
+  host: "foo",
+  hostname: "foo",
+  href: "https://foo/bar?baz#bat",
+  origin: "https://foo",
+  pathname: "/bar",
+  port: "",
+  protocol: "https:",
+  search: "?baz"
 }
 NotSupportedError: Cannot set "location.hostname".
 [WILDCARD]

cli/tests/unit/url_test.ts

@@ -387,19 +387,25 @@ unitTest(function sortingNonExistentParamRemovesQuestionMarkFromURL(): void {
   assertEquals(url.search, "");
 });
 
-unitTest(
-  {
-    // FIXME(bartlomieju)
-    ignore: true,
-  },
-  function customInspectFunction(): void {
-    const url = new URL("http://example.com/?");
-    assertEquals(
-      Deno.inspect(url),
-      'URL { href: "http://example.com/?", origin: "http://example.com", protocol: "http:", username: "", password: "", host: "example.com", hostname: "example.com", port: "", pathname: "/", hash: "", search: "?" }',
-    );
-  },
-);
+unitTest(function customInspectFunction(): void {
+  const url = new URL("http://example.com/?");
+  assertEquals(
+    Deno.inspect(url),
+    `URL {
+  href: "http://example.com/?",
+  origin: "http://example.com",
+  protocol: "http:",
+  username: "",
+  password: "",
+  host: "example.com",
+  hostname: "example.com",
+  port: "",
+  pathname: "/",
+  hash: "",
+  search: "?"
+}`,
+  );
+});
 
 unitTest(function protocolNotHttpOrFile() {
   const url = new URL("about:blank");

op_crates/web/11_url.js

@@ -522,23 +522,25 @@
     #searchParams = null;
 
     [Symbol.for("Deno.customInspect")]() {
-      const keys = [
-        "href",
-        "origin",
-        "protocol",
-        "username",
-        "password",
-        "host",
-        "hostname",
-        "port",
-        "pathname",
-        "hash",
-        "search",
-      ];
-      const objectString = keys
-        .map((key) => `${key}: "${this[key] || ""}"`)
-        .join(", ");
-      return `URL { ${objectString} }`;
+      const object = {
+        href: this.href,
+        origin: this.origin,
+        protocol: this.protocol,
+        username: this.username,
+        password: this.password,
+        host: this.host,
+        hostname: this.hostname,
+        port: this.port,
+        pathname: this.pathname,
+        hash: this.hash,
+        search: this.search,
+      };
+      if (typeof globalThis?.Deno?.inspect == "function") {
+        return `URL ${Deno.inspect(object)}`;
+      }
+      return `URL { ${
+        Object.entries(object).map(([k, v]) => `${k}: ${v}`).join(", ")
+      } }`;
     }
 
     #updateSearchParams = () => {

op_crates/web/12_location.js

@@ -164,6 +164,27 @@
           },
           enumerable: true,
         },
+        [Symbol.for("Deno.customInspect")]: {
+          value: function () {
+            const object = {
+              hash: this.hash,
+              host: this.host,
+              hostname: this.hostname,
+              href: this.href,
+              origin: this.origin,
+              pathname: this.pathname,
+              port: this.port,
+              protocol: this.protocol,
+              search: this.search,
+            };
+            if (typeof globalThis?.Deno?.inspect == "function") {
+              return `Location ${Deno.inspect(object)}`;
+            }
+            return `Location { ${
+              Object.entries(object).map(([k, v]) => `${k}: ${v}`).join(", ")
+            } }`;
+          },
+        },
       });
     }
   }
@@ -305,6 +326,27 @@
       value: "WorkerLocation",
       configurable: true,
     },
+    [Symbol.for("Deno.customInspect")]: {
+      value: function () {
+        const object = {
+          hash: this.hash,
+          host: this.host,
+          hostname: this.hostname,
+          href: this.href,
+          origin: this.origin,
+          pathname: this.pathname,
+          port: this.port,
+          protocol: this.protocol,
+          search: this.search,
+        };
+        if (typeof globalThis?.Deno?.inspect == "function") {
+          return `WorkerLocation ${Deno.inspect(object)}`;
+        }
+        return `WorkerLocation { ${
+          Object.entries(object).map(([k, v]) => `${k}: ${v}`).join(", ")
+        } }`;
+      },
+    },
   });
 
   let location = null;