Issue 5899 - Use CSS attribute selectors for collapsing media elements

include.preload.js

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-present 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 17 matching lines @@
   ["input", "IMAGE"],
   ["picture", "IMAGE"],
   ["audio", "MEDIA"],
   ["video", "MEDIA"],
   ["frame", "SUBDOCUMENT"],
   ["iframe", "SUBDOCUMENT"],
   ["object", "OBJECT"],
   ["embed", "OBJECT"]
 ]);
 
+let collapsedElements = new WeakMap();
+
 function getURLsFromObjectElement(element)
 {
   let url = element.getAttribute("data");
   if (url)
     return [url];
 
   for (let child of element.children)
   {
     if (child.localName != "param")
       continue;
@@ skipping 44 matching lines @@
     if (child.localName == "source" || child.localName == "track")
       urls.push(...getURLsFromAttributes(child));
   }
 
   if (element.poster)
     urls.push(element.poster);
 
   return urls;
 }
 
-function getURLsFromElement(element)
+function getURLsFromElement(element, all)
 {
   let urls;
   switch (element.localName)
   {
     case "object":
       urls = getURLsFromObjectElement(element);
       break;
 
     case "video":
     case "audio":
     case "picture":
       urls = getURLsFromMediaElement(element);
       break;
 
     default:
       urls = getURLsFromAttributes(element);
       break;
   }
 
+  if (all)
+    return urls;
+
   for (let i = 0; i < urls.length; i++)
   {
     if (/^(?!https?:)[\w-]+:/i.test(urls[i]))
       urls.splice(i--, 1);
   }
 
   return urls;
 }
 
+function collapseElement(element)
+{
+  let value = element.style.getPropertyValue("display");
+  let priority = element.style.getPropertyPriority("display");
+  if (value != "none" || priority != "important")
+  {
+    element.style.setProperty("display", "none", "important");
+    collapsedElements.set(element, {value, priority});
+  }
+}
+
+function restoreCollapsedElement(element)
+{
+  let display = collapsedElements.get(element);
+  if (display)
+  {
+    element.style.setProperty("display", display.value, display.priority);
+    collapsedElements.delete(element);
+  }
+}
+
 function hideElement(element)
 {
   function doHide()
   {
     let propertyName = "display";
     let propertyValue = "none";
     if (element.localName == "frame")
     {
       propertyName = "visibility";
       propertyValue = "hidden";
@@ skipping 13 matching lines @@
     }
   );
 }
 
 function checkCollapse(element)
 {
   let mediatype = typeMap.get(element.localName);
   if (!mediatype)
     return;
 
-  let urls = getURLsFromElement(element);
+  let urls = getURLsFromElement(element, mediatype == "MEDIA");
   if (urls.length == 0)
     return;
 
   browser.runtime.sendMessage(
     {
       type: "filters.collapse",
       urls,
       mediatype,
       baseURL: document.location.href
     },
 
     collapse =>
     {
-      if (collapse)
+      if (mediatype == "MEDIA")
+      {
+        if (collapse)
+          collapseElement(element);
+        else
+          restoreCollapsedElement(element);
+      }
+      else if (collapse)
       {
         hideElement(element);
       }
     }
   );
 }
 
 function checkSitekey()
 {
   let attr = document.documentElement.getAttribute("data-adblockkey");
@@ skipping 342 matching lines @@
   {
     checkCollapse(event.target);
   }, true);
 
   document.addEventListener("load", event =>
   {
     let element = event.target;
     if (/^i?frame$/.test(element.localName))
       checkCollapse(element);
   }, true);
+
+  document.addEventListener("loadstart", event =>
+  {
+    let element = event.target;
+    if (typeMap.get(element.localName) == "MEDIA")
+      checkCollapse(element);
+  }, true);
 }
 
 window.checkCollapse = checkCollapse;
 window.elemhide = elemhide;
 window.typeMap = typeMap;
 window.getURLsFromElement = getURLsFromElement;