| LEFT | RIGHT | 
|---|
| 1 /* | 1 /* | 
| 2  * This file is part of Adblock Plus <https://adblockplus.org/>, | 2  * This file is part of Adblock Plus <https://adblockplus.org/>, | 
| 3  * Copyright (C) 2006-present eyeo GmbH | 3  * Copyright (C) 2006-present eyeo GmbH | 
| 4  * | 4  * | 
| 5  * Adblock Plus is free software: you can redistribute it and/or modify | 5  * Adblock Plus is free software: you can redistribute it and/or modify | 
| 6  * it under the terms of the GNU General Public License version 3 as | 6  * it under the terms of the GNU General Public License version 3 as | 
| 7  * published by the Free Software Foundation. | 7  * published by the Free Software Foundation. | 
| 8  * | 8  * | 
| 9  * Adblock Plus is distributed in the hope that it will be useful, | 9  * Adblock Plus is distributed in the hope that it will be useful, | 
| 10  * but WITHOUT ANY WARRANTY; without even the implied warranty of | 10  * but WITHOUT ANY WARRANTY; without even the implied warranty of | 
| 11  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the | 11  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the | 
| 12  * GNU General Public License for more details. | 12  * GNU General Public License for more details. | 
| 13  * | 13  * | 
| 14  * You should have received a copy of the GNU General Public License | 14  * You should have received a copy of the GNU General Public License | 
| 15  * along with Adblock Plus.  If not, see <http://www.gnu.org/licenses/>. | 15  * along with Adblock Plus.  If not, see <http://www.gnu.org/licenses/>. | 
| 16  */ | 16  */ | 
| 17 | 17 | 
| 18 "use strict"; | 18 "use strict"; | 
| 19 | 19 | 
| 20 let {splitSelector} = require("common"); | 20 let {splitSelector} = require("./adblockpluscore/lib/common"); | 
| 21 let {ElemHideEmulation} = require("content_elemHideEmulation"); | 21 let {ElemHideEmulation} = | 
|  | 22   require("./adblockpluscore/lib/content/elemHideEmulation"); | 
| 22 | 23 | 
| 23 // This variable is also used by our other content scripts. | 24 // This variable is also used by our other content scripts. | 
| 24 let elemhide; | 25 let elemhide; | 
| 25 | 26 | 
| 26 const typeMap = new Map([ | 27 const typeMap = new Map([ | 
| 27   ["img", "IMAGE"], | 28   ["img", "IMAGE"], | 
| 28   ["input", "IMAGE"], | 29   ["input", "IMAGE"], | 
| 29   ["picture", "IMAGE"], | 30   ["picture", "IMAGE"], | 
| 30   ["audio", "MEDIA"], | 31   ["audio", "MEDIA"], | 
| 31   ["video", "MEDIA"], | 32   ["video", "MEDIA"], | 
| 32   ["frame", "SUBDOCUMENT"], | 33   ["frame", "SUBDOCUMENT"], | 
| 33   ["iframe", "SUBDOCUMENT"], | 34   ["iframe", "SUBDOCUMENT"], | 
| 34   ["object", "OBJECT"], | 35   ["object", "OBJECT"], | 
| 35   ["embed", "OBJECT"] | 36   ["embed", "OBJECT"] | 
| 36 ]); | 37 ]); | 
| 37 | 38 | 
|  | 39 let collapsingSelectors = new Set(); | 
|  | 40 | 
| 38 function getURLsFromObjectElement(element) | 41 function getURLsFromObjectElement(element) | 
| 39 { | 42 { | 
| 40   let url = element.getAttribute("data"); | 43   let url = element.getAttribute("data"); | 
| 41   if (url) | 44   if (url) | 
| 42     return [url]; | 45     return [url]; | 
| 43 | 46 | 
| 44   for (let child of element.children) | 47   for (let child of element.children) | 
| 45   { | 48   { | 
| 46     if (child.localName != "param") | 49     if (child.localName != "param") | 
| 47       continue; | 50       continue; | 
| (...skipping 73 matching lines...) Expand 10 before | Expand all | Expand 10 after  Loading... | 
| 121 | 124 | 
| 122   for (let i = 0; i < urls.length; i++) | 125   for (let i = 0; i < urls.length; i++) | 
| 123   { | 126   { | 
| 124     if (/^(?!https?:)[\w-]+:/i.test(urls[i])) | 127     if (/^(?!https?:)[\w-]+:/i.test(urls[i])) | 
| 125       urls.splice(i--, 1); | 128       urls.splice(i--, 1); | 
| 126   } | 129   } | 
| 127 | 130 | 
| 128   return urls; | 131   return urls; | 
| 129 } | 132 } | 
| 130 | 133 | 
|  | 134 function isCollapsibleMediaElement(element, mediatype) | 
|  | 135 { | 
|  | 136   if (mediatype != "MEDIA") | 
|  | 137     return false; | 
|  | 138 | 
|  | 139   if (!element.getAttribute("src")) | 
|  | 140     return false; | 
|  | 141 | 
|  | 142   for (let child of element.children) | 
|  | 143   { | 
|  | 144     // If the <video> or <audio> element contains any <source> or <track> | 
|  | 145     // children, we cannot address it in CSS by the source URL; in that case we | 
|  | 146     // don't "collapse" it using a CSS selector but rather hide it directly by | 
|  | 147     // setting the style="..." attribute. | 
|  | 148     if (child.localName == "source" || child.localName == "track") | 
|  | 149       return false; | 
|  | 150   } | 
|  | 151 | 
|  | 152   return true; | 
|  | 153 } | 
|  | 154 | 
|  | 155 function collapseMediaElement(element, srcValue) | 
|  | 156 { | 
|  | 157   if (!srcValue) | 
|  | 158     return; | 
|  | 159 | 
|  | 160   let selector = element.localName + "[src=" + CSS.escape(srcValue) + "]"; | 
|  | 161 | 
|  | 162   // Adding selectors is expensive so do it only if we really have a new | 
|  | 163   // selector. | 
|  | 164   if (!collapsingSelectors.has(selector)) | 
|  | 165   { | 
|  | 166     collapsingSelectors.add(selector); | 
|  | 167     elemhide.addSelectors([selector], null, "collapsing", true); | 
|  | 168   } | 
|  | 169 } | 
|  | 170 | 
| 131 function hideElement(element) | 171 function hideElement(element) | 
| 132 { | 172 { | 
| 133   function doHide() | 173   function doHide() | 
| 134   { | 174   { | 
| 135     let propertyName = "display"; | 175     let propertyName = "display"; | 
| 136     let propertyValue = "none"; | 176     let propertyValue = "none"; | 
| 137     if (element.localName == "frame") | 177     if (element.localName == "frame") | 
| 138     { | 178     { | 
| 139       propertyName = "visibility"; | 179       propertyName = "visibility"; | 
| 140       propertyValue = "hidden"; | 180       propertyValue = "hidden"; | 
| (...skipping 16 matching lines...) Expand all  Loading... | 
| 157 | 197 | 
| 158 function checkCollapse(element) | 198 function checkCollapse(element) | 
| 159 { | 199 { | 
| 160   let mediatype = typeMap.get(element.localName); | 200   let mediatype = typeMap.get(element.localName); | 
| 161   if (!mediatype) | 201   if (!mediatype) | 
| 162     return; | 202     return; | 
| 163 | 203 | 
| 164   let urls = getURLsFromElement(element); | 204   let urls = getURLsFromElement(element); | 
| 165   if (urls.length == 0) | 205   if (urls.length == 0) | 
| 166     return; | 206     return; | 
|  | 207 | 
|  | 208   let collapsibleMediaElement = isCollapsibleMediaElement(element, mediatype); | 
|  | 209 | 
|  | 210   // Save the value of the src attribute because it can change between now and | 
|  | 211   // when we get the response from the background page. | 
|  | 212   let srcValue = collapsibleMediaElement ? element.getAttribute("src") : null; | 
| 167 | 213 | 
| 168   browser.runtime.sendMessage( | 214   browser.runtime.sendMessage( | 
| 169     { | 215     { | 
| 170       type: "filters.collapse", | 216       type: "filters.collapse", | 
| 171       urls, | 217       urls, | 
| 172       mediatype, | 218       mediatype, | 
| 173       baseURL: document.location.href | 219       baseURL: document.location.href | 
| 174     }, | 220     }, | 
| 175 |  | 
| 176     collapse => | 221     collapse => | 
| 177     { | 222     { | 
| 178       if (collapse) | 223       if (collapse) | 
| 179       { | 224       { | 
| 180         hideElement(element); | 225         if (collapsibleMediaElement) | 
|  | 226           collapseMediaElement(element, srcValue); | 
|  | 227         else | 
|  | 228           hideElement(element); | 
| 181       } | 229       } | 
| 182     } | 230     } | 
| 183   ); | 231   ); | 
| 184 } | 232 } | 
| 185 | 233 | 
| 186 function checkSitekey() | 234 function checkSitekey() | 
| 187 { | 235 { | 
| 188   let attr = document.documentElement.getAttribute("data-adblockkey"); | 236   let attr = document.documentElement.getAttribute("data-adblockkey"); | 
| 189   if (attr) | 237   if (attr) | 
| 190     browser.runtime.sendMessage({type: "filters.addKey", token: attr}); | 238     browser.runtime.sendMessage({type: "filters.addKey", token: attr}); | 
| (...skipping 148 matching lines...) Expand 10 before | Expand all | Expand 10 after  Loading... | 
| 339   } | 387   } | 
| 340 }; | 388 }; | 
| 341 | 389 | 
| 342 function ElemHide() | 390 function ElemHide() | 
| 343 { | 391 { | 
| 344   this.shadow = this.createShadowTree(); | 392   this.shadow = this.createShadowTree(); | 
| 345   this.styles = new Map(); | 393   this.styles = new Map(); | 
| 346   this.tracer = null; | 394   this.tracer = null; | 
| 347   this.inline = true; | 395   this.inline = true; | 
| 348   this.inlineEmulated = true; | 396   this.inlineEmulated = true; | 
| 349   this.emulatedPatterns = null; |  | 
| 350 | 397 | 
| 351   this.elemHideEmulation = new ElemHideEmulation( | 398   this.elemHideEmulation = new ElemHideEmulation( | 
| 352     this.addSelectors.bind(this), | 399     this.addSelectors.bind(this), | 
| 353     this.hideElements.bind(this) | 400     this.hideElements.bind(this) | 
| 354   ); | 401   ); | 
| 355 } | 402 } | 
| 356 ElemHide.prototype = { | 403 ElemHide.prototype = { | 
| 357   selectorGroupSize: 1024, | 404   selectorGroupSize: 1024, | 
| 358 | 405 | 
| 359   createShadowTree() | 406   createShadowTree() | 
| (...skipping 19 matching lines...) Expand all  Loading... | 
| 379     // Finally since some users have both AdBlock and Adblock Plus installed we | 426     // Finally since some users have both AdBlock and Adblock Plus installed we | 
| 380     // have to consider how the two extensions interact. For example we want to | 427     // have to consider how the two extensions interact. For example we want to | 
| 381     // avoid creating the shadowRoot twice. | 428     // avoid creating the shadowRoot twice. | 
| 382     let shadow = document.documentElement.shadowRoot || | 429     let shadow = document.documentElement.shadowRoot || | 
| 383                  document.documentElement.createShadowRoot(); | 430                  document.documentElement.createShadowRoot(); | 
| 384     shadow.appendChild(document.createElement("content")); | 431     shadow.appendChild(document.createElement("content")); | 
| 385 | 432 | 
| 386     return shadow; | 433     return shadow; | 
| 387   }, | 434   }, | 
| 388 | 435 | 
| 389   addSelectorsInline(selectors, groupName) | 436   addSelectorsInline(selectors, groupName, appendOnly = false) | 
| 390   { | 437   { | 
| 391     let style = this.styles.get(groupName); | 438     let style = this.styles.get(groupName); | 
| 392 | 439 | 
| 393     if (style) | 440     if (style && !appendOnly) | 
| 394     { | 441     { | 
| 395       while (style.sheet.cssRules.length > 0) | 442       while (style.sheet.cssRules.length > 0) | 
| 396         style.sheet.deleteRule(0); | 443         style.sheet.deleteRule(0); | 
| 397     } | 444     } | 
| 398 | 445 | 
| 399     if (selectors.length == 0) | 446     if (selectors.length == 0) | 
| 400       return; | 447       return; | 
| 401 | 448 | 
| 402     if (!style) | 449     if (!style) | 
| 403     { | 450     { | 
| (...skipping 47 matching lines...) Expand 10 before | Expand all | Expand 10 after  Loading... | 
| 451     for (let i = 0; i < preparedSelectors.length; i += this.selectorGroupSize) | 498     for (let i = 0; i < preparedSelectors.length; i += this.selectorGroupSize) | 
| 452     { | 499     { | 
| 453       let selector = preparedSelectors.slice( | 500       let selector = preparedSelectors.slice( | 
| 454         i, i + this.selectorGroupSize | 501         i, i + this.selectorGroupSize | 
| 455       ).join(", "); | 502       ).join(", "); | 
| 456       style.sheet.insertRule(selector + "{display: none !important;}", | 503       style.sheet.insertRule(selector + "{display: none !important;}", | 
| 457                              style.sheet.cssRules.length); | 504                              style.sheet.cssRules.length); | 
| 458     } | 505     } | 
| 459   }, | 506   }, | 
| 460 | 507 | 
| 461   addSelectors(selectors, filters) | 508   addSelectors(selectors, filters, groupName = "emulated", appendOnly = false) | 
| 462   { | 509   { | 
| 463     if (this.inline || this.inlineEmulated) | 510     if (this.inline || this.inlineEmulated) | 
| 464     { | 511     { | 
| 465       // Insert the style rules inline if we have been instructed by the | 512       // Insert the style rules inline if we have been instructed by the | 
| 466       // background page to do so. This is usually the case, except on platforms | 513       // background page to do so. This is usually the case, except on platforms | 
| 467       // that do support user stylesheets via the browser.tabs.insertCSS API | 514       // that do support user stylesheets via the browser.tabs.insertCSS API | 
| 468       // (Firefox 53 onwards for now and possibly Chrome in the near future). | 515       // (Firefox 53 onwards for now and possibly Chrome in the near future). | 
| 469       // Once all supported platforms have implemented this API, we can remove | 516       // Once all supported platforms have implemented this API, we can remove | 
| 470       // the code below. See issue #5090. | 517       // the code below. See issue #5090. | 
| 471       // Related Chrome and Firefox issues: | 518       // Related Chrome and Firefox issues: | 
| 472       // https://bugs.chromium.org/p/chromium/issues/detail?id=632009 | 519       // https://bugs.chromium.org/p/chromium/issues/detail?id=632009 | 
| 473       // https://bugzilla.mozilla.org/show_bug.cgi?id=1310026 | 520       // https://bugzilla.mozilla.org/show_bug.cgi?id=1310026 | 
| 474       this.addSelectorsInline(selectors, "emulated"); | 521       this.addSelectorsInline(selectors, groupName, appendOnly); | 
| 475     } | 522     } | 
| 476     else | 523     else | 
| 477     { | 524     { | 
| 478       browser.runtime.sendMessage({ | 525       browser.runtime.sendMessage({ | 
| 479         type: "elemhide.injectSelectors", | 526         type: "elemhide.injectSelectors", | 
| 480         selectors, | 527         selectors, | 
| 481         groupName: "emulated" | 528         groupName, | 
|  | 529         appendOnly | 
| 482       }); | 530       }); | 
| 483     } | 531     } | 
| 484 | 532 | 
| 485     if (this.tracer) | 533     // Only trace selectors that are based directly on hiding filters | 
|  | 534     // (i.e. leave out collapsing selectors). | 
|  | 535     if (this.tracer && groupName != "collapsing") | 
| 486       this.tracer.addSelectors(selectors, filters); | 536       this.tracer.addSelectors(selectors, filters); | 
| 487   }, | 537   }, | 
| 488 | 538 | 
| 489   hideElements(elements, filters) | 539   hideElements(elements, filters) | 
| 490   { | 540   { | 
| 491     for (let element of elements) | 541     for (let element of elements) | 
| 492       hideElement(element); | 542       hideElement(element); | 
| 493 | 543 | 
| 494     if (this.tracer) | 544     if (this.tracer) | 
| 495     { | 545     { | 
| (...skipping 18 matching lines...) Expand all  Loading... | 
| 514 | 564 | 
| 515       this.inline = response.inline; | 565       this.inline = response.inline; | 
| 516       this.inlineEmulated = !!response.inlineEmulated; | 566       this.inlineEmulated = !!response.inlineEmulated; | 
| 517 | 567 | 
| 518       if (this.inline) | 568       if (this.inline) | 
| 519         this.addSelectorsInline(response.selectors, "standard"); | 569         this.addSelectorsInline(response.selectors, "standard"); | 
| 520 | 570 | 
| 521       if (this.tracer) | 571       if (this.tracer) | 
| 522         this.tracer.addSelectors(response.selectors); | 572         this.tracer.addSelectors(response.selectors); | 
| 523 | 573 | 
|  | 574       // Prefer CSS selectors for -abp-has and -abp-contains unless the | 
|  | 575       // background page has asked us to use inline styles. | 
|  | 576       this.elemHideEmulation.useInlineStyles = this.inline || | 
|  | 577                                                this.inlineEmulated; | 
|  | 578 | 
| 524       this.elemHideEmulation.apply(response.emulatedPatterns); | 579       this.elemHideEmulation.apply(response.emulatedPatterns); | 
| 525     }); | 580     }); | 
| 526   } | 581   } | 
| 527 }; | 582 }; | 
| 528 | 583 | 
| 529 if (document instanceof HTMLDocument) | 584 if (document instanceof HTMLDocument) | 
| 530 { | 585 { | 
| 531   checkSitekey(); | 586   checkSitekey(); | 
| 532 | 587 | 
| 533   elemhide = new ElemHide(); | 588   elemhide = new ElemHide(); | 
| 534   elemhide.apply(); | 589   elemhide.apply(); | 
| 535 | 590 | 
| 536   document.addEventListener("error", event => | 591   document.addEventListener("error", event => | 
| 537   { | 592   { | 
| 538     checkCollapse(event.target); | 593     checkCollapse(event.target); | 
| 539   }, true); | 594   }, true); | 
| 540 | 595 | 
| 541   document.addEventListener("load", event => | 596   document.addEventListener("load", event => | 
| 542   { | 597   { | 
| 543     let element = event.target; | 598     let element = event.target; | 
| 544     if (/^i?frame$/.test(element.localName)) | 599     if (/^i?frame$/.test(element.localName)) | 
| 545       checkCollapse(element); | 600       checkCollapse(element); | 
| 546   }, true); | 601   }, true); | 
| 547 } | 602 } | 
| 548 | 603 | 
| 549 window.checkCollapse = checkCollapse; | 604 window.checkCollapse = checkCollapse; | 
| 550 window.elemhide = elemhide; | 605 window.elemhide = elemhide; | 
| 551 window.typeMap = typeMap; | 606 window.typeMap = typeMap; | 
| 552 window.getURLsFromElement = getURLsFromElement; | 607 window.getURLsFromElement = getURLsFromElement; | 
| LEFT | RIGHT | 
|---|