[DevTools] Replace usages of document with custom functions.

Source/devtools/front_end/elements/ElementsTreeOutline.js

 /*
  * Copyright (C) 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2008 Matt Lilek <webkit@mattlilek.com>
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
@@ skipping 22 matching lines @@
  * @extends {TreeOutline}
  * @param {!WebInspector.Target} target
  * @param {boolean=} omitRootDOMNode
  * @param {boolean=} selectEnabled
  * @param {function(!WebInspector.DOMNode, string, boolean)=} setPseudoClassCallback
  */
 WebInspector.ElementsTreeOutline = function(target, omitRootDOMNode, selectEnabled, setPseudoClassCallback)
 {
     this._target = target;
     this._domModel = target.domModel;
-    var element = document.createElement("div");
+    var element = createElement("div");
 
     this._shadowRoot = element.createShadowRoot();
     this._shadowRoot.appendChild(WebInspector.View.createStyleElement("elementsTreeOutline.css"));
 
     var outlineDisclosureElement = this._shadowRoot.createChild("div", "component-root outline-disclosure source-code");
     this._element = outlineDisclosureElement.createChild("ol", "elements-tree-outline");
     this._element.addEventListener("mousedown", this._onmousedown.bind(this), false);
     this._element.addEventListener("mousemove", this._onmousemove.bind(this), false);
     this._element.addEventListener("mouseout", this._onmouseout.bind(this), false);
     this._element.addEventListener("dragstart", this._ondragstart.bind(this), false);
@@ skipping 1131 matching lines @@
             if (document.body.offsetWidth > 0)
                 this._readyToUpdateSelection = true;
             else {
                 // The stylesheet hasn't loaded yet or the window is closed,
                 // so we can't calculate what we need. Return early.
                 return;
             }
         }
 
         if (!this.selectionElement) {
-            this.selectionElement = document.createElement("div");
+            this.selectionElement = createElement("div");
             this.selectionElement.className = "selection selected";
             listItemElement.insertBefore(this.selectionElement, listItemElement.firstChild);
         }
 
         this.selectionElement.style.height = listItemElement.offsetHeight + "px";
     },
 
     onattach: function()
     {
         if (this._hovered) {
@@ skipping 170 matching lines @@
         const childNodeCount = visibleChildren.length;
 
         // In case some nodes from the expanded range were removed, pull some nodes from the collapsed range into the expanded range at the bottom.
         for (var i = this.expandedChildCount, limit = Math.min(this.expandedChildrenLimit, childNodeCount); i < limit; ++i)
             this.insertChildElement(visibleChildren[i], i);
 
         const expandedChildCount = this.expandedChildCount;
         if (childNodeCount > this.expandedChildCount) {
             var targetButtonIndex = expandedChildCount;
             if (!this.expandAllButtonElement) {
-                var button = document.createElement("button");
+                var button = createElement("button");
                 button.className = "text-button";
                 button.value = "";
                 var item = new TreeElement(button, null, false);
                 item.selectable = false;
                 item.expandAllButton = true;
                 this.insertChild(item, targetButtonIndex);
                 this.expandAllButtonElement = item.listItemElement.firstChild;
                 this.expandAllButtonElement.__treeElement = item;
                 this.expandAllButtonElement.addEventListener("click", this.handleLoadAllChildren.bind(this), false);
             } else if (!this.expandAllButtonElement.__treeElement.parent)
@@ skipping 304 matching lines @@
             if (textNode)
                 return this._startEditingTextNode(textNode);
             return;
         }
     },
 
     _addNewAttribute: function()
     {
         // Cannot just convert the textual html into an element without
         // a parent node. Use a temporary span container for the HTML.
-        var container = document.createElement("span");
+        var container = createElement("span");
         this._buildAttributeDOM(container, " ", "");
         var attr = container.firstElementChild;
         attr.style.marginLeft = "2px"; // overrides the .editing margin rule
         attr.style.marginRight = "2px"; // overrides the .editing margin rule
 
         var tag = this.listItemElement.getElementsByClassName("webkit-html-tag")[0];
         this._insertInLastAttributePosition(tag, attr);
         attr.scrollIntoViewIfNeeded(true);
         return this._startEditingAttribute(attr, attr);
     },
@@ skipping 173 matching lines @@
             return;
 
         function consume(event)
         {
             if (event.eventPhase === Event.AT_TARGET)
                 event.consume(true);
         }
 
         initialValue = this._convertWhitespaceToEntities(initialValue).text;
 
-        this._htmlEditElement = document.createElement("div");
+        this._htmlEditElement = createElement("div");
         this._htmlEditElement.className = "source-code elements-tree-editor";
 
         // Hide header items.
         var child = this.listItemElement.firstChild;
         while (child) {
             child.style.display = "none";
             child = child.nextSibling;
         }
         // Hide children item.
         if (this._childrenListNode)
@@ skipping 242 matching lines @@
         if (this._editing)
             return;
 
         if (onlySearchQueryChanged) {
             if (this._highlightResult)
                 this._updateSearchHighlight(false);
         } else {
             var nodeInfo = this._nodeTitleInfo(WebInspector.linkifyURLAsNode);
             if (nodeInfo.shadowRoot)
                 this.listItemElement.classList.add("shadow-root");
-            var highlightElement = document.createElement("span");
+            var highlightElement = createElement("span");
             highlightElement.className = "highlight";
             highlightElement.appendChild(nodeInfo.titleDOM);
             this.title = highlightElement;
             this._updateDecorations();
             delete this._highlightResult;
         }
 
         delete this.selectionElement;
         if (this.selected)
             this.updateSelection();
@@ skipping 20 matching lines @@
             if (this.expanded || this._elementCloseTag)
                 continue;
 
             message = decorator.decorateAncestor(node);
             if (message)
                 parentDecoratorMessages.push(message)
         }
         if (!decoratorMessages.length && !parentDecoratorMessages.length)
             return null;
 
-        var decoratorElement = document.createElement("div");
+        var decoratorElement = createElement("div");
         decoratorElement.classList.add("elements-gutter-decoration");
         if (!decoratorMessages.length)
             decoratorElement.classList.add("elements-has-decorated-children");
         decoratorElement.title = decoratorMessages.concat(parentDecoratorMessages).join("\n");
         return decoratorElement;
     },
 
     _updateDecorations: function()
     {
         if (this._decoratorElement)
@@ skipping 63 matching lines @@
 
         /**
          * @this {WebInspector.ElementsTreeElement}
          * @param {string} value
          * @return {!Element}
          */
         function linkifyValue(value)
         {
             var rewrittenHref = node.resolveURL(value);
             if (rewrittenHref === null) {
-                var span = document.createElement("span");
+                var span = createElement("span");
                 setValueWithEntities.call(this, span, value);
                 return span;
             }
             value = value.replace(closingPunctuationRegex, "$&\u200B");
             if (value.startsWith("data:"))
                 value = value.trimMiddle(60);
             return linkify(rewrittenHref, value, "", node.nodeName().toLowerCase() === "a");
         }
 
         if (linkify && (name === "src" || name === "href")) {
@@ skipping 83 matching lines @@
             result += text.substring(lastIndexAfterEntity);
         return {text: result || text, entityRanges: entityRanges};
     },
 
     /**
      * @param {function(string, string, string, boolean=, string=)=} linkify
      */
     _nodeTitleInfo: function(linkify)
     {
         var node = this._node;
-        var info = {titleDOM: document.createDocumentFragment(), hasChildren: this.hasChildren};
+        var info = {titleDOM: createDocumentFragment(), hasChildren: this.hasChildren};
 
         switch (node.nodeType()) {
             case Node.ATTRIBUTE_NODE:
                 this._buildAttributeDOM(info.titleDOM, /** @type {string} */ (node.name), /** @type {string} */ (node.value), true);
                 break;
 
             case Node.ELEMENT_NODE:
                 var pseudoType = node.pseudoType();
                 if (pseudoType) {
                     this._buildPseudoElementDOM(info.titleDOM, pseudoType);
@@ skipping 542 matching lines @@
                 treeOutline.rootDOMNode = node;
                 if (!treeOutline.children[0].hasChildren)
                     treeOutline._element.classList.add("single-node");
                 treeOutline.setVisible(true);
                 treeOutline.element.treeElementForTest = treeOutline.children[0];
                 resolve(treeOutline.element);
             }
         }
     }
 }