Issue 4101 - Prevent runaway MutationObservers

include.preload.js

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-2016 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 140 matching lines @@
       function collapseElement()
       {
         var propertyName = "display";
         var propertyValue = "none";
         if (element.localName == "frame")
         {
           propertyName = "visibility";
           propertyValue = "hidden";
         }
 
-        if (element.style.getPropertyValue(propertyName) !== propertyValue ||

[Sebastian Noack, 2016/08/10 12:55:57]

Nit: AS per Mozilla's coding practices we perfer != over !==.

[kzar, 2016/08/11 13:53:30]

Done.

-            element.style.getPropertyPriority(propertyName) !== "important")
+        if (element.style.getPropertyValue(propertyName) != propertyValue ||
+            element.style.getPropertyPriority(propertyName) != "important")
           element.style.setProperty(propertyName, propertyValue, "important");
       }
 
-      if (collapse && !element._collapsed)
+      if (collapse)
       {
         collapseElement();
-        element._collapsed = true;
 
         if (MutationObserver)
           new MutationObserver(collapseElement).observe(
             element, {
               attributes: true,
               attributeFilter: ["style"]
             }
           );
       }
     }
   );
 }
 
 function checkSitekey()
 {
   var attr = document.documentElement.getAttribute("data-adblockkey");
   if (attr)
-    ext.backgroundPage.sendMessage({type: "filter.addKey", token: attr});
+    ext.backgroundPage.sendMessage({type: "filters.addKey", token: attr});
 }
 
 function getContentDocument(element)
 {
   try
   {
     return element.contentDocument;
   }
   catch (e)
   {
@@ skipping 135 matching lines @@
   },
 
   disconnect: function()
   {
     this.document.removeEventListener("DOMContentLoaded", this.trace);
     this.observer.disconnect();
     clearTimeout(this.timeout);
   }
 };
 
-function reinjectStyleSheetWhenRemoved(document, style)
-{
-  if (!MutationObserver)
-    return null;
-
-  var parentNode = style.parentNode;
-  var observer = new MutationObserver(function()
-  {
-    if (style.parentNode != parentNode)
-      parentNode.appendChild(style);
-  });
-
-  observer.observe(parentNode, {childList: true});
-  return observer;
-}
-
-function protectStyleSheet(document, style)
-{
-  var id = Math.random().toString(36).substr(2)
-  style.id = id;
-
-  var code = [
-    "(function()",
-    "{",
-    '  var style = document.getElementById("' + id + '") ||',
-    '              document.documentElement.shadowRoot.getElementById("' + id + '");',
-    '  style.removeAttribute("id");'
-  ];
-
-  var disableables = ["style", "style.sheet"];
-  for (var i = 0; i < disableables.length; i++)
-  {
-    code.push("  Object.defineProperty(" + disableables[i] + ', "disabled", '
-                                         + "{value: false, enumerable: true});");
-  }
-
-  var methods = ["deleteRule", "removeRule"];
-  for (var j = 0; j < methods.length; j++)
-  {
-    var method = methods[j];
-    if (method in CSSStyleSheet.prototype)
-    {
-      var origin = "CSSStyleSheet.prototype." + method;
-      code.push("  var " + method + " = " + origin + ";",
-                "  " + origin + " = function(index)",
-                "  {",
-                "    if (this != style.sheet)",
-                "      " + method + ".call(this, index);",
-                "  }");
-    }
-  }
-
-  code.push("})();");
-
+function runInDocument(document, fn, arg)
+{
   var script = document.createElement("script");
+  script.type = "application/javascript";
   script.async = false;
-  script.textContent = code.join("\n");
+  script.textContent = "(" + fn + ")(" + JSON.stringify(arg) + ");";
   document.documentElement.appendChild(script);
   document.documentElement.removeChild(script);
+}
+
+// Neither Chrome[1] nor Safari allow us to intercept WebSockets, and therefore
+// some ad networks are misusing them as a way to serve adverts and circumvent
+// us. As a workaround we wrap WebSocket, preventing blocked WebSocket
+// connections from being opened.
+// [1] - https://bugs.chromium.org/p/chromium/issues/detail?id=129353
+function wrapWebSocket(document)
+{
+  if (typeof WebSocket == "undefined")
+    return;
+
+  var eventName = "abpws-" + Math.random().toString(36).substr(2);
+
+  document.addEventListener(eventName, function(event)
+  {
+    ext.backgroundPage.sendMessage({
+      type: "websocket-request",
+      url: event.detail.url
+    }, function (block)
+    {
+      document.dispatchEvent(
+        new CustomEvent(eventName + "-" + event.detail.url, {detail: block})
+      );
+    });
+  });
+
+  runInDocument(document, function(eventName)
+  {
+    // As far as possible we must track everything we use that could be
+    // sabotaged by the website later in order to circumvent us.
+    var RealWebSocket = WebSocket;
+    var closeWebSocket = Function.prototype.call.bind(RealWebSocket.prototype.close);
+    var addEventListener = document.addEventListener.bind(document);
+    var removeEventListener = document.removeEventListener.bind(document);
+    var dispatchEvent = document.dispatchEvent.bind(document);
+    var CustomEvent = window.CustomEvent;
+
+    function checkRequest(url, callback)
+    {
+      var incomingEventName = eventName + "-" + url;
+      function listener(event)
+      {
+        callback(event.detail);
+        removeEventListener(incomingEventName, listener);
+      }
+      addEventListener(incomingEventName, listener);
+
+      dispatchEvent(new CustomEvent(eventName, {
+        detail: {url: url}
+      }));
+    }
+
+    WebSocket = function WrappedWebSocket(url, protocols)
+    {
+      // Throw correct exceptions if the constructor is used improperly.
+      if (!(this instanceof WrappedWebSocket)) return RealWebSocket();
+      if (arguments.length < 1) return new RealWebSocket();
+
+      var websocket = new RealWebSocket(url, protocols);
+
+      checkRequest(websocket.url, function(blocked)
+      {
+        if (blocked)
+          closeWebSocket(websocket);
+      });
+
+      return websocket;
+    }.bind();
+
+    Object.defineProperties(WebSocket, {
+      CONNECTING: {value: RealWebSocket.CONNECTING, enumerable: true},
+      OPEN: {value: RealWebSocket.OPEN, enumerable: true},
+      CLOSING: {value: RealWebSocket.CLOSING, enumerable: true},
+      CLOSED: {value: RealWebSocket.CLOSED, enumerable: true},
+      prototype: {value: RealWebSocket.prototype}
+    });
+
+    RealWebSocket.prototype.constructor = WebSocket;
+  }, eventName);
 }
 
 function init(document)
 {
   var shadow = null;
   var style = null;
   var observer = null;
   var tracer = null;
+
+  wrapWebSocket(document);
 
   function getPropertyFilters(callback)
   {
     ext.backgroundPage.sendMessage({
       type: "filters.get",
       what: "cssproperties"
     }, callback);
   }
   var propertyFilters = new CSSPropertyFilters(window, getPropertyFilters,
                                                addElemHideSelectors);
 
   // Use Shadow DOM if available to don't mess 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 the shadow root before transistions might start (#452).
   //
   // Also, using shadow DOM causes issues on some Google websites,
   // including Google Docs, Gmail and Blogger (#1770, #2602, #2687).
   if ("createShadowRoot" in document.documentElement &&
       !/\.(?:google|blogger)\.com$/.test(document.domain))
   {
     shadow = document.documentElement.createShadowRoot();
     shadow.appendChild(document.createElement("shadow"));
+
+    // Stop the website from messing with our shadowRoot
+    runInDocument(document, function()
+    {
+      var ourShadowRoot = document.documentElement.shadowRoot;
+      var desc = Object.getOwnPropertyDescriptor(Element.prototype, "shadowRoot");
+      var shadowRoot = Function.prototype.call.bind(desc.get);
+
+      Object.defineProperty(Element.prototype, "shadowRoot", {
+        conifgurable: true, enumerable: true, get: function()
+        {
+          var shadow = shadowRoot(this);
+          return shadow == ourShadowRoot ? null : shadow;
+        }
+      });
+    }, null);
   }
 
   function addElemHideSelectors(selectors)
   {
     if (selectors.length == 0)
       return;
 
     if (!style)
     {
       // Create <style> element lazily, only if we add styles. Add it to
       // the shadow DOM if possible. Otherwise fallback to the <head> or
       // <html> element. If we have injected a style element before that
       // has been removed (the sheet property is null), create a new one.
       style = document.createElement("style");
       (shadow || document.head || document.documentElement).appendChild(style);
 
       // It can happen that the frame already navigated to a different
       // document while we were waiting for the background page to respond.
       // In that case the sheet property will stay null, after addind the
       // <style> element to the shadow DOM.
       if (!style.sheet)
         return;
-
-      observer = reinjectStyleSheetWhenRemoved(document, style);
-      protectStyleSheet(document, style);
     }
 
     // If using shadow DOM, we have to add the ::content pseudo-element
     // before each selector, in order to match elements within the
     // insertion point.
     if (shadow)
     {
       var preparedSelectors = [];
       for (var i = 0; i < selectors.length; i++)
       {
@@ skipping 102 matching lines @@
   }, true);
 
   return updateStylesheet;
 }
 
 if (document instanceof HTMLDocument)
 {
   checkSitekey();
   window.updateStylesheet = init(document);
 }