Add DocumentType rep.

Fixes #945.

Previously it was rendered by the Grip Rep and was causing issue
because the packet does not have a ownProperties prop.
Adding a dedicated Rep, with similar output as in the markup view fixes
the issue. Stubs and tests are added as well.
And to be safe, we default ownProperties to an empty object in the Grip
rep so we don't have errors anymore.

Author: nchevobbe

packages/devtools-reps/src/reps/document-type.js

@@ -0,0 +1,49 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// ReactJS
+const PropTypes = require("prop-types");
+
+// Reps
+const {
+  getGripType,
+  isGrip,
+  wrapRender,
+} = require("./rep-utils");
+const dom = require("react-dom-factories");
+const { span } = dom;
+
+/**
+ * Renders DOM documentType object.
+ */
+DocumentType.propTypes = {
+  object: PropTypes.object.isRequired,
+};
+
+function DocumentType(props) {
+  const { object } = props;
+  let name = object && object.preview && object.preview.nodeName
+    ? ` ${object.preview.nodeName}`
+    : "";
+  return span({
+    "data-link-actor-id": props.object.actor,
+    className: "objectBox objectBox-document"
+  }, `<!DOCTYPE${name}>`);
+}
+
+// Registration
+function supportsObject(object, noGrip = false) {
+  if (noGrip === true || !isGrip(object)) {
+    return false;
+  }
+
+  const type = getGripType(object, noGrip);
+  return (object.preview && type === "DocumentType");
+}
+
+// Exports from this module
+module.exports = {
+  rep: wrapRender(DocumentType),
+  supportsObject,
+};

packages/devtools-reps/src/reps/grip.js

@@ -147,8 +147,9 @@ function propIterator(props, object, max) {
   });
 
   let properties = object.preview
-    ? object.preview.ownProperties
+    ? object.preview.ownProperties || {}
     : {};
+
   let propertiesLength = getPropertiesLength(object);
 
   if (object.preview && object.preview.safeGetterValues) {

packages/devtools-reps/src/reps/rep.js

@@ -20,6 +20,7 @@ const Accessor = require("./accessor");
 const Attribute = require("./attribute");
 const DateTime = require("./date-time");
 const Document = require("./document");
+const DocumentType = require("./document-type");
 const Event = require("./event");
 const Func = require("./function");
 const PromiseRep = require("./promise");
@@ -53,6 +54,7 @@ let reps = [
   PromiseRep,
   ArrayRep,
   Document,
+  DocumentType,
   Window,
   ObjectWithText,
   ObjectWithURL,
@@ -128,6 +130,7 @@ module.exports = {
     CommentNode,
     DateTime,
     Document,
+    DocumentType,
     ElementNode,
     ErrorRep,
     Event,

packages/devtools-reps/src/reps/stubs/document-type.js

@@ -0,0 +1,38 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const stubs = new Map();
+stubs.set("html", {
+  "type": "object",
+  "actor": "server1.conn7.child1/obj195",
+  "class": "DocumentType",
+  "extensible": true,
+  "frozen": false,
+  "sealed": false,
+  "ownPropertyLength": 0,
+  "preview": {
+    "kind": "DOMNode",
+    "nodeType": 10,
+    "nodeName": "html",
+    "isConnected": true
+  }
+});
+
+stubs.set("unnamed", {
+  "type": "object",
+  "actor": "server1.conn7.child1/obj195",
+  "class": "DocumentType",
+  "extensible": true,
+  "frozen": false,
+  "sealed": false,
+  "ownPropertyLength": 0,
+  "preview": {
+    "kind": "DOMNode",
+    "nodeType": 10,
+    "nodeName": "",
+    "isConnected": true
+  }
+});
+
+module.exports = stubs;

packages/devtools-reps/src/reps/tests/document-type.js

@@ -0,0 +1,41 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { shallow } = require("enzyme");
+const {
+  REPS,
+  getRep,
+} = require("../rep");
+
+const {
+  expectActorAttribute
+} = require("./test-helpers");
+
+const { DocumentType } = REPS;
+const stubs = require("../stubs/document-type");
+
+describe("DocumentType", () => {
+  const stub = stubs.get("html");
+  it("correctly selects DocumentType Rep", () => {
+    expect(getRep(stub)).toBe(DocumentType.rep);
+  });
+
+  it("renders with expected text content on html doctype", () => {
+    const renderedComponent = shallow(DocumentType.rep({
+      object: stub
+    }));
+
+    expect(renderedComponent.text()).toEqual("<!DOCTYPE html>");
+    expectActorAttribute(renderedComponent, stub.actor);
+  });
+
+  it("renders with expected text content on empty doctype", () => {
+    const unnamedStub = stubs.get("unnamed");
+    const renderedComponent = shallow(DocumentType.rep({
+      object: unnamedStub
+    }));
+    expect(renderedComponent.text()).toEqual("<!DOCTYPE>");
+    expectActorAttribute(renderedComponent, unnamedStub.actor);
+  });
+});