1 files changed, 185 insertions, 0 deletions
diff --git a/devtools/client/webconsole/test/browser/test-console-custom-formatters-errors.html b/devtools/client/webconsole/test/browser/test-console-custom-formatters-errors.html
new file mode 100644
index 0000000000..a186bb338a
--- /dev/null
+++ b/devtools/client/webconsole/test/browser/test-console-custom-formatters-errors.html
@@ -0,0 +1,185 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8"/>
+    <title>Webconsole erroneous custom formatters test page</title>
+  </head>
+  <body>
+    <p>Erroneous custom formatters test page</p>
+    <script>
+      "use strict";
+
+      window.devtoolsFormatters = [
+        {
+          // this header is invalid because it is not a function
+          header: 1,
+        },
+        {
+          // this header is invalid because it doesn't return JsonML
+          header: () => 1,
+        },
+        {
+          // this header is invalid because the returned array misses an element type
+          header: () => [],
+        },
+        {
+          // this header is invalid because it throws an exception
+          header: () => { throw new Error("ERROR"); },
+        },
+        {
+          header: (obj) => {
+            return obj.hasOwnProperty("hasBodyNotAFunction") ?
+              ["div", "hasBody not a function"] :
+              null;
+          },
+          // this hasBody is invalid because it is not a function
+          hasBody: 1,
+        },
+        {
+          header: (obj) => {
+            return obj.hasOwnProperty("hasBodyThrows") ?
+              ["div", "hasBody throws"] :
+              null;
+          },
+          // this hasBody throws an exception
+          hasBody: () => { throw new Error("ERROR"); },
+        },
+        {
+          header: (obj) => {
+            return obj.hasOwnProperty("bodyNotAFunction") ?
+              ["div", "body not a function"] :
+              null;
+          },
+          hasBody: () => true,
+          // this body is invalid because it is not a function
+          body: 1,
+        },
+        {
+          header: (obj) => {
+            return obj.hasOwnProperty("bodyReturnsNull") ?
+              ["div", "body returns null"] :
+              null;
+          },
+          hasBody: () => true,
+          // this body is invalid because it doesn't return JsonML
+          body: () => null,
+        },
+        {
+          header: (obj) => {
+            return obj.hasOwnProperty("bodyNoJsonMl") ?
+              ["div", "body doesn't return JsonML"] :
+              null;
+          },
+          hasBody: () => true,
+          // this body is invalid because it doesn't return JsonML
+          body: () => 1,
+        },
+        {
+          header: (obj) => {
+            return obj.hasOwnProperty("bodyNoElementType") ?
+              ["div", "body array misses element type"] :
+              null;
+          },
+          hasBody: () => true,
+          // this body is invalid because the returned array misses an element type
+          body: () => [],
+        },
+        {
+          header: (obj) => {
+            return obj.hasOwnProperty("bodyThrows") ?
+              ["div", "body throws"] :
+              null;
+          },
+          hasBody: () => true,
+          // this body is invalid because it throws an exception
+          body: () => { throw new Error("ERROR"); },
+        },
+        {
+          header: (obj) => {
+            if (obj?.hasOwnProperty("objectTagWithNoAttribute")) {
+              // This is invalid because "object" tag should have attributes
+              return ["object"];
+            }
+            return null;
+          },
+        },
+        {
+          header: (obj) => {
+            if (obj?.hasOwnProperty("objectTagWithoutObjectAttribute")) {
+              // This is invalid because "object" tag should have an "object" attribute
+              return [
+                  "object",
+                  { config: "something" }
+                ];
+            }
+            return null;
+          },
+        },
+        {
+          header: (obj) => {
+            if (obj?.hasOwnProperty("infiniteObjectTag")) {
+              // This is invalid because this triggers an infinite loop (object is being
+              // replaced by itself, which will keep triggering the custom formatter hook)
+              return [ "object", { object: obj }];
+            }
+            return null;
+          },
+        },
+        {
+          // the returned value is invalid because the tagName isn't a string
+          header: (obj) => {
+            if (obj?.hasOwnProperty("invalidTag")) {
+              return [ 42 ];
+            }
+            return null;
+          },
+        },
+        {
+          header: (obj) => {
+            if (obj.hasOwnProperty("customFormatHeader")) {
+              return ["span", {"style": "font-size: 3rem;"}, "custom formatted header"];
+            }
+            return null;
+          },
+          hasBody: (obj) => false
+        },
+        {
+          header: (obj) => {
+            if (obj.hasOwnProperty("customFormatHeaderAndBody")) {
+              return ["span", {"style": "font-style: italic;"}, "custom formatted body"];
+            }
+            return null;
+          },
+          hasBody: (obj) => true,
+          body: (obj) => ["span", {"style": "font-family: serif; font-size: 2rem;"}, obj.customFormatHeaderAndBody]
+        },
+        {
+          header: (obj) => {
+            if (obj.hasOwnProperty("privileged")) {
+              // This should throw as the hooks should not have privileged access
+              window.windowUtils.garbageCollect();
+              return ["span", {}, "privileged"];
+            }
+            return null;
+          },
+        },
+      ];
+
+      [
+        {},
+        {hasBodyNotAFunction: true},
+        {hasBodyThrows: true},
+        {bodyNotAFunction: true},
+        {bodyReturnsNull: true},
+        {bodyNoJsonMl: true},
+        {bodyNoElementType: true},
+        {bodyThrows: true},
+        {objectTagWithNoAttribute: true},
+        {objectTagWithoutObjectAttribute: true},
+        {infiniteObjectTag: true},
+        {invalidTag: true},
+        {privileged: true},
+      ].forEach(variable => console.log(variable));
+    </script>
+  </body>
+</html>