core: save HTMLElement.p.matches function to avoid conflict (#6283)

GoogleChrome · Oct 19, 2018 · dcccf6d · dcccf6d
1 parent 42091b2
commit dcccf6d
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 2 deletions.
diff --git a/lighthouse-cli/test/fixtures/dobetterweb/dbw_tester.html b/lighthouse-cli/test/fixtures/dobetterweb/dbw_tester.html
@@ -108,6 +108,23 @@
 </head>
 <body>
 
+<!-- Various sites like to assign HTMLElements a custom `matches` property. See issue #5934 -->
+
+<!-- EmbeddedContent will process these elements -->
+<object id="5934a"></object>
+<object id="5934b"></object>
+
+<script>
+  // Ensure gatherers still work when individual elements override '.matches'
+  document.getElementById("5934a").matches = "blahblah";
+  Object.defineProperty(document.getElementById("5934b"), 'matches', {
+    value: "blahblah"
+  });
+
+  // Ensure gatherers still work when the prototype is messed with
+  HTMLElement.prototype.matches = { value: "blahblah" };
+</script>
+
 <div>
   <h2>Do better web tester page</h2>
   <span>Hi there!</span>

diff --git a/lighthouse-core/gather/driver.js b/lighthouse-core/gather/driver.js
@@ -1191,7 +1191,8 @@ class Driver {
   async cacheNatives() {
     await this.evaluateScriptOnNewDocument(`window.__nativePromise = Promise;
         window.__nativeError = Error;
-        window.__nativeURL = URL;`);
+        window.__nativeURL = URL;
+        window.__ElementMatches = Element.prototype.matches;`);
   }
 
   /**

diff --git a/lighthouse-core/lib/page-functions.js b/lighthouse-core/lib/page-functions.js
@@ -90,7 +90,7 @@ function getElementsInDocument(selector) {
   /** @param {NodeListOf<Element>} nodes */
   const _findAllElements = nodes => {
     for (let i = 0, el; el = nodes[i]; ++i) {
-      if (!selector || el.matches(selector)) {
+      if (!selector || window.__ElementMatches.call(el, selector)) {
         results.push(el);
       }
       // If the element has a shadow root, dig deeper.