Issue 5094 - Implement support for :has() in chrome extension

include.preload.js

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-2017 eyeo GmbH
  *
  * Adblock Plus is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License version 3 as
  * published by the Free Software Foundation.
  *
  * Adblock Plus is distributed in the hope that it will be useful,
  * but WITHOUT ANY WARRANTY; without even the implied warranty of
@@ skipping 412 matching lines @@
 
   this.elemHideEmulation = new ElemHideEmulation(
     window,
     callback =>
     {
       ext.backgroundPage.sendMessage({
         type: "filters.get",
         what: "elemhideemulation"
       }, callback);
     },
-    this.addSelectors.bind(this)
+    this.addSelectors.bind(this),
+    this.hideElements.bind(this)
   );
 }
 ElemHide.prototype = {
   selectorGroupSize: 200,
 
   createShadowTree()
   {
     // Use Shadow DOM if available as to not mess with with web pages that
     // rely on the order of their own <style> tags (#309). However, creating
     // a shadow root breaks running CSS transitions. So we have to create
@@ skipping 90 matching lines @@
         i, i + this.selectorGroupSize
       ).join(", ");
       this.style.sheet.insertRule(selector + "{display: none !important;}",
                                   this.style.sheet.cssRules.length);
     }
 
     if (this.tracer)
       this.tracer.addSelectors(selectors, filters || selectors);
   },
 
+  hideElements(elements, filters)
+  {
+    for (let element of elements)
+    {
+      element.style.display = "none";

[Sebastian Noack, 2017/04/04 10:14:45]

We should use the same logic as we have in checkCollapse(), i.e. "display: none
!important" + MutationObserver preventing the web page from changing that style.
In order to avoid duplication, that logic should be moved to a separate function
that is called both, here and in checkCollapse().

[hub, 2017/04/05 09:05:53]

Done.

+    }
+    // XXX first arg is supposed to be selectors
+    if (this.tracer)
+      this.tracer.addSelectors(filters, filters);

[Sebastian Noack, 2017/04/04 10:14:45]

ElementHidingTracer.addSelectors() will search for hidden elements that match
the given selectors (now and on DOM mutation) and reports the corresponding
filters to the devtools panel if it found any match.

This step is unnecessary in the scenario here, as the elements just got hidden
there is no need to confirm that, and in fact we don't even have any selectors
that we could rely on for this purpose.

Instead we should add a method to ElementHidingTracer that reports a list of
filters to the devtools panel no matter what, and use this method here instead.

[hub, 2017/04/05 09:05:53]

Done.

+  },
+
   apply()
   {
     ext.backgroundPage.sendMessage({type: "get-selectors"}, response =>
     {
       if (this.tracer)
         this.tracer.disconnect();
       this.tracer = null;
 
       if (this.style && this.style.parentElement)
         this.style.parentElement.removeChild(this.style);
@@ skipping 21 matching lines @@
     checkCollapse(event.target);
   }, true);
 
   document.addEventListener("load", event =>
   {
     let element = event.target;
     if (/^i?frame$/.test(element.localName))
       checkCollapse(element);
   }, true);
 }