| OLD | NEW |
| 1 <script> | 1 <script> |
| 2 function DOMAgent(delegate) { | 2 class DOMAgent { |
| 3 this.enabled = false; | 3 constructor(delegate) { |
| 4 this.delegate_ = delegate; | 4 this.enabled = false; |
| 5 this.nextNodeId_ = 1; | 5 this.delegate_ = delegate; |
| 6 this.nodeToId_ = new Map(); | 6 this.nextNodeId_ = 1; |
| 7 this.idToNode_ = new Map(); | 7 this.nodeToId_ = new Map(); |
| 8 } | 8 this.idToNode_ = new Map(); |
| 9 | 9 Object.preventExtensions(this); |
| 10 DOMAgent.prototype.getIdForNode_ = function(node) { | |
| 11 if (this.nodeToId_.has(node)) | |
| 12 return this.nodeToId_.get(node); | |
| 13 var id = this.nextNodeId_++; | |
| 14 this.nodeToId_.set(node, id); | |
| 15 this.idToNode_.set(id, node); | |
| 16 return id; | |
| 17 }; | |
| 18 | |
| 19 DOMAgent.prototype.getNodeForId = function(nodeId) { | |
| 20 return this.idToNode_.get(nodeId); | |
| 21 }; | |
| 22 | |
| 23 DOMAgent.prototype.serializeChildren_ = function(node) { | |
| 24 var children = []; | |
| 25 for (var child = node.firstChild; child; child = child.nextSibling) { | |
| 26 var record = this.serializeNode_(child); | |
| 27 if (record) | |
| 28 children.push(record); | |
| 29 } | |
| 30 return children; | |
| 31 }; | |
| 32 | |
| 33 DOMAgent.prototype.serializeAttributes_ = function(element) { | |
| 34 var attributes = []; | |
| 35 var attrs = element.getAttributes(); | |
| 36 for (var i = 0; i < attrs.length; ++i) { | |
| 37 var attr = attrs[i]; | |
| 38 attributes.push(attr.name); | |
| 39 attributes.push(attr.value); | |
| 40 } | |
| 41 return attributes; | |
| 42 }; | |
| 43 | |
| 44 DOMAgent.prototype.serializeNode_ = function(node) { | |
| 45 var id = this.getIdForNode_(node); | |
| 46 | |
| 47 var record = { | |
| 48 nodeId: id, | |
| 49 }; | |
| 50 | |
| 51 var isContainer = false; | |
| 52 | |
| 53 if (node instanceof Element) { | |
| 54 isContainer = true; | |
| 55 record.nodeType = 1; | |
| 56 record.nodeName = node.tagName; | |
| 57 record.localName = node.tagName; | |
| 58 record.nodeValue = ""; | |
| 59 record.attributes = this.serializeAttributes_(node); | |
| 60 } else if (node instanceof Text) { | |
| 61 record.nodeType = 3; | |
| 62 record.nodeName = "#text"; | |
| 63 var nodeValue = node.data; | |
| 64 if (!nodeValue.trim()) | |
| 65 return null; | |
| 66 record.nodeValue = nodeValue; | |
| 67 } else if (node instanceof Document) { | |
| 68 isContainer = true; | |
| 69 record.nodeType = 9; | |
| 70 record.nodeName = "#document"; | |
| 71 record.localName = ""; | |
| 72 record.nodeValue = ""; | |
| 73 record.documentURL = node.URL; | |
| 74 record.baseURL = node.baseURI; | |
| 75 } else if (node instanceof DocumentFragment) { | |
| 76 isContainer = true; | |
| 77 record.nodeType = 11; | |
| 78 record.nodeName = "#document-fragment"; | |
| 79 record.localName = ""; | |
| 80 record.nodeValue = ""; | |
| 81 } else { | |
| 82 console.log("Unknown node type"); | |
| 83 return null; | |
| 84 } | 10 } |
| 85 | 11 |
| 86 if (isContainer) { | 12 getIdForNode_(node) { |
| 87 var children = this.serializeChildren_(node); | 13 if (this.nodeToId_.has(node)) |
| 88 if (children.length) { | 14 return this.nodeToId_.get(node); |
| 89 record.childNodeCount = children.length; | 15 var id = this.nextNodeId_++; |
| 90 record.children = children; | 16 this.nodeToId_.set(node, id); |
| 17 this.idToNode_.set(id, node); |
| 18 return id; |
| 19 } |
| 20 |
| 21 getNodeForId(nodeId) { |
| 22 return this.idToNode_.get(nodeId); |
| 23 } |
| 24 |
| 25 serializeChildren_(node) { |
| 26 var children = []; |
| 27 for (var child = node.firstChild; child; child = child.nextSibling) { |
| 28 var record = this.serializeNode_(child); |
| 29 if (record) |
| 30 children.push(record); |
| 31 } |
| 32 return children; |
| 33 } |
| 34 |
| 35 serializeAttributes_(element) { |
| 36 var attributes = []; |
| 37 var attrs = element.getAttributes(); |
| 38 for (var i = 0; i < attrs.length; ++i) { |
| 39 var attr = attrs[i]; |
| 40 attributes.push(attr.name); |
| 41 attributes.push(attr.value); |
| 42 } |
| 43 return attributes; |
| 44 } |
| 45 |
| 46 serializeNode_(node) { |
| 47 var id = this.getIdForNode_(node); |
| 48 |
| 49 var record = { |
| 50 nodeId: id, |
| 51 }; |
| 52 |
| 53 var isContainer = false; |
| 54 |
| 55 if (node instanceof Element) { |
| 56 isContainer = true; |
| 57 record.nodeType = 1; |
| 58 record.nodeName = node.tagName; |
| 59 record.localName = node.tagName; |
| 60 record.nodeValue = ""; |
| 61 record.attributes = this.serializeAttributes_(node); |
| 62 } else if (node instanceof Text) { |
| 63 record.nodeType = 3; |
| 64 record.nodeName = "#text"; |
| 65 var nodeValue = node.data; |
| 66 if (!nodeValue.trim()) |
| 67 return null; |
| 68 record.nodeValue = nodeValue; |
| 69 } else if (node instanceof Document) { |
| 70 isContainer = true; |
| 71 record.nodeType = 9; |
| 72 record.nodeName = "#document"; |
| 73 record.localName = ""; |
| 74 record.nodeValue = ""; |
| 75 record.documentURL = node.URL; |
| 76 record.baseURL = node.baseURI; |
| 77 } else if (node instanceof DocumentFragment) { |
| 78 isContainer = true; |
| 79 record.nodeType = 11; |
| 80 record.nodeName = "#document-fragment"; |
| 81 record.localName = ""; |
| 82 record.nodeValue = ""; |
| 83 } else { |
| 84 console.log("Unknown node type"); |
| 85 return null; |
| 86 } |
| 87 |
| 88 if (isContainer) { |
| 89 var children = this.serializeChildren_(node); |
| 90 if (children.length) { |
| 91 record.childNodeCount = children.length; |
| 92 record.children = children; |
| 93 } |
| 94 } |
| 95 |
| 96 return record; |
| 97 } |
| 98 |
| 99 enable() { |
| 100 this.enabled = true; |
| 101 this.observer_ = new MutationObserver(this.mutationCallback_.bind(this)); |
| 102 this.observer_.observe(document, { |
| 103 childList: true, |
| 104 attributes: true, |
| 105 characterData: true, |
| 106 subtree : true, |
| 107 }); |
| 108 } |
| 109 |
| 110 getDocument() { |
| 111 return { |
| 112 root: this.serializeNode_(document), |
| 113 }; |
| 114 } |
| 115 |
| 116 hideHighlight() { |
| 117 } |
| 118 |
| 119 highlightNode() { |
| 120 } |
| 121 |
| 122 mutationCallback_(mutationRecords) { |
| 123 for (var i = 0; i < mutationRecords.length; ++i) { |
| 124 var record = mutationRecords[i]; |
| 125 var type = record.type; |
| 126 var target = record.target; |
| 127 var nodeId = this.getIdForNode_(target); |
| 128 if (type == "attributes") { |
| 129 var attributeName = record.attributeName; |
| 130 if (target.hasAttribute(attributeName)) { |
| 131 this.delegate_.sendMessage("DOM.attributeModified", { |
| 132 nodeId: nodeId, |
| 133 name: attributeName, |
| 134 value: target.getAttribute(attributeName), |
| 135 }); |
| 136 } else { |
| 137 this.delegate_.sendMessage("DOM.attributeRemoved", { |
| 138 nodeId: nodeId, |
| 139 name: attributeName, |
| 140 }); |
| 141 } |
| 142 } else if (type == "characterData") { |
| 143 this.delegate_.sendMessage("DOM.characterDataModified", { |
| 144 nodeId: nodeId, |
| 145 characterData: target.data, |
| 146 }); |
| 147 } else if (type == "childList") { |
| 148 // FIXME: If this subtree isn't expanded, we only need to send across th
e |
| 149 // {"method":"DOM.childNodeCountUpdated","params":"nodeId":648,"childNod
eCount":2} |
| 150 |
| 151 Array.prototype.forEach.call(record.removedNodes, function(node) { |
| 152 this.delegate_.sendMessage("DOM.childNodeRemoved", { |
| 153 parentNodeId: nodeId, |
| 154 nodeId: this.getIdForNode_(node), |
| 155 }); |
| 156 }.bind(this)); |
| 157 |
| 158 Array.prototype.forEach.call(record.addedNodes, function(node) { |
| 159 var previousNodeId = node.previousSibling ? this.getIdForNode_(node.pr
eviousSibling) : 0; |
| 160 this.delegate_.sendMessage("DOM.childNodeInserted", { |
| 161 parentNodeId: nodeId, |
| 162 previousNodeId: previousNodeId, |
| 163 node: this.serializeNode_(node), |
| 164 }); |
| 165 }.bind(this)); |
| 166 } |
| 91 } | 167 } |
| 92 } | 168 } |
| 93 | 169 } |
| 94 return record; | |
| 95 }; | |
| 96 | |
| 97 DOMAgent.prototype.enable = function() { | |
| 98 this.enabled = true; | |
| 99 this.observer_ = new MutationObserver(this.mutationCallback_.bind(this)); | |
| 100 this.observer_.observe(document, { | |
| 101 childList: true, | |
| 102 attributes: true, | |
| 103 characterData: true, | |
| 104 subtree : true, | |
| 105 }); | |
| 106 }; | |
| 107 | |
| 108 DOMAgent.prototype.getDocument = function() { | |
| 109 return { | |
| 110 root: this.serializeNode_(document), | |
| 111 }; | |
| 112 }; | |
| 113 | |
| 114 DOMAgent.prototype.hideHighlight = function() { | |
| 115 }; | |
| 116 | |
| 117 DOMAgent.prototype.highlightNode = function() { | |
| 118 }; | |
| 119 | |
| 120 DOMAgent.prototype.mutationCallback_ = function(mutationRecords) { | |
| 121 for (var i = 0; i < mutationRecords.length; ++i) { | |
| 122 var record = mutationRecords[i]; | |
| 123 var type = record.type; | |
| 124 var target = record.target; | |
| 125 var nodeId = this.getIdForNode_(target); | |
| 126 if (type == "attributes") { | |
| 127 var attributeName = record.attributeName; | |
| 128 if (target.hasAttribute(attributeName)) { | |
| 129 this.delegate_.sendMessage("DOM.attributeModified", { | |
| 130 nodeId: nodeId, | |
| 131 name: attributeName, | |
| 132 value: target.getAttribute(attributeName), | |
| 133 }); | |
| 134 } else { | |
| 135 this.delegate_.sendMessage("DOM.attributeRemoved", { | |
| 136 nodeId: nodeId, | |
| 137 name: attributeName, | |
| 138 }); | |
| 139 } | |
| 140 } else if (type == "characterData") { | |
| 141 this.delegate_.sendMessage("DOM.characterDataModified", { | |
| 142 nodeId: nodeId, | |
| 143 characterData: target.data, | |
| 144 }); | |
| 145 } else if (type == "childList") { | |
| 146 // FIXME: If this subtree isn't expanded, we only need to send across the | |
| 147 // {"method":"DOM.childNodeCountUpdated","params":"nodeId":648,"childNodeC
ount":2} | |
| 148 | |
| 149 Array.prototype.forEach.call(record.removedNodes, function(node) { | |
| 150 this.delegate_.sendMessage("DOM.childNodeRemoved", { | |
| 151 parentNodeId: nodeId, | |
| 152 nodeId: this.getIdForNode_(node), | |
| 153 }); | |
| 154 }.bind(this)); | |
| 155 | |
| 156 Array.prototype.forEach.call(record.addedNodes, function(node) { | |
| 157 var previousNodeId = node.previousSibling ? this.getIdForNode_(node.prev
iousSibling) : 0; | |
| 158 this.delegate_.sendMessage("DOM.childNodeInserted", { | |
| 159 parentNodeId: nodeId, | |
| 160 previousNodeId: previousNodeId, | |
| 161 node: this.serializeNode_(node), | |
| 162 }); | |
| 163 }.bind(this)); | |
| 164 } | |
| 165 } | |
| 166 }; | |
| 167 | 170 |
| 168 module.exports = DOMAgent; | 171 module.exports = DOMAgent; |
| 169 </script> | 172 </script> |
| OLD | NEW |