Delta Between Two Patch Sets: include.preload.js
Issue 29714555:
Issue 6441 - Avoid unnecessary shadow root (Closed)
Base URL: https://hg.adblockplus.org/adblockpluschrome/
Left Patch Set:
Created March 5, 2018, 9:47 a.m.
Right Patch Set: Improve user agent check
Created March 9, 2018, 12:32 a.m.
| Left: | ||
| Right: |
Use n/p to move between diff chunks;
N/P to move between comments.
« no previous file with change/comment
|
« no previous file
|
no next file »
|
no next file with change/comment »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
| 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 |
| (...skipping 323 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 334 disconnect() | 334 disconnect() |
| 335 { | 335 { |
| 336 document.removeEventListener("DOMContentLoaded", this.trace); | 336 document.removeEventListener("DOMContentLoaded", this.trace); |
| 337 this.observer.disconnect(); | 337 this.observer.disconnect(); |
| 338 clearTimeout(this.timeout); | 338 clearTimeout(this.timeout); |
| 339 } | 339 } |
| 340 }; | 340 }; |
| 341 | 341 |
| 342 function ElemHide() | 342 function ElemHide() |
| 343 { | 343 { |
| 344 this.shadow = null; | 344 this.shadow = this.createShadowTree(); |
| 345 this.styles = new Map(); | 345 this.styles = new Map(); |
| 346 this.tracer = null; | 346 this.tracer = null; |
| 347 this.inline = true; | 347 this.inline = true; |
| 348 this.inlineEmulated = true; | 348 this.inlineEmulated = true; |
| 349 this.emulatedPatterns = null; | |
| 350 | 349 |
| 351 this.elemHideEmulation = new ElemHideEmulation( | 350 this.elemHideEmulation = new ElemHideEmulation( |
| 352 this.addSelectors.bind(this), | 351 this.addSelectors.bind(this), |
| 353 this.hideElements.bind(this) | 352 this.hideElements.bind(this) |
| 354 ); | 353 ); |
| 355 } | 354 } |
| 356 ElemHide.prototype = { | 355 ElemHide.prototype = { |
| 357 selectorGroupSize: 1024, | 356 selectorGroupSize: 1024, |
| 358 | 357 |
| 359 createShadowTree() | 358 createShadowTree() |
| 360 { | 359 { |
| 361 // Use Shadow DOM if available as to not mess with with web pages that | 360 // Use Shadow DOM if available as to not mess with with web pages that |
| 362 // rely on the order of their own <style> tags (#309). However, creating | 361 // rely on the order of their own <style> tags (#309). However, creating |
| 363 // a shadow root breaks running CSS transitions. So we have to create | 362 // a shadow root breaks running CSS transitions. So we have to create |
| 364 // the shadow root before transistions might start (#452). | 363 // the shadow root before transistions might start (#452). |
| 365 if (!("createShadowRoot" in document.documentElement)) | 364 if (!("createShadowRoot" in document.documentElement)) |
| 366 return null; | 365 return null; |
| 367 | 366 |
| 367 // Both Firefox and Chrome 66+ support user style sheets, so we can avoid | |
| 368 // creating an unnecessary shadow root on these platforms. | |
| 369 let match = /\bChrome\/(\d+)/.exec(navigator.userAgent); | |
| 370 if (!match || match[1] >= 66) | |
| 371 return null; | |
| 372 | |
| 368 // Using shadow DOM causes issues on some Google websites, | 373 // Using shadow DOM causes issues on some Google websites, |
| 369 // including Google Docs, Gmail and Blogger (#1770, #2602, #2687). | 374 // including Google Docs, Gmail and Blogger (#1770, #2602, #2687). |
| 370 if (/\.(?:google|blogger)\.com$/.test(document.domain)) | 375 if (/\.(?:google|blogger)\.com$/.test(document.domain)) |
| 371 return null; | 376 return null; |
| 372 | 377 |
| 373 // Finally since some users have both AdBlock and Adblock Plus installed we | 378 // Finally since some users have both AdBlock and Adblock Plus installed we |
| 374 // have to consider how the two extensions interact. For example we want to | 379 // have to consider how the two extensions interact. For example we want to |
| 375 // avoid creating the shadowRoot twice. | 380 // avoid creating the shadowRoot twice. |
| 376 let shadow = document.documentElement.shadowRoot || | 381 let shadow = document.documentElement.shadowRoot || |
| 377 document.documentElement.createShadowRoot(); | 382 document.documentElement.createShadowRoot(); |
| 378 shadow.appendChild(document.createElement("shadow")); | 383 shadow.appendChild(document.createElement("content")); |
| 379 | 384 |
| 380 return shadow; | 385 return shadow; |
| 381 }, | 386 }, |
| 382 | 387 |
| 383 addSelectorsInline(selectors, groupName) | 388 addSelectorsInline(selectors, groupName) |
| 384 { | 389 { |
| 385 let style = this.styles.get(groupName); | 390 let style = this.styles.get(groupName); |
| 386 | 391 |
| 387 if (style) | 392 if (style) |
| 388 { | 393 { |
| 389 while (style.sheet.cssRules.length > 0) | 394 while (style.sheet.cssRules.length > 0) |
| 390 style.sheet.deleteRule(0); | 395 style.sheet.deleteRule(0); |
| 391 } | 396 } |
| 392 | 397 |
| 393 if (selectors.length == 0) | 398 if (selectors.length == 0) |
| 394 return; | 399 return; |
| 395 | 400 |
| 396 if (!style) | 401 if (!style) |
| 397 { | 402 { |
| 398 if (!this.shadow) | |
| 399 this.shadow = this.createShadowTree(); | |
| 400 | |
| 401 // Create <style> element lazily, only if we add styles. Add it to | 403 // Create <style> element lazily, only if we add styles. Add it to |
| 402 // the shadow DOM if possible. Otherwise fallback to the <head> or | 404 // the shadow DOM if possible. Otherwise fallback to the <head> or |
| 403 // <html> element. If we have injected a style element before that | 405 // <html> element. If we have injected a style element before that |
| 404 // has been removed (the sheet property is null), create a new one. | 406 // has been removed (the sheet property is null), create a new one. |
| 405 style = document.createElement("style"); | 407 style = document.createElement("style"); |
| 406 (this.shadow || document.head || | 408 (this.shadow || document.head || |
| 407 document.documentElement).appendChild(style); | 409 document.documentElement).appendChild(style); |
| 408 | 410 |
| 409 // It can happen that the frame already navigated to a different | 411 // It can happen that the frame already navigated to a different |
| 410 // document while we were waiting for the background page to respond. | 412 // document while we were waiting for the background page to respond. |
| (...skipping 100 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 511 | 513 |
| 512 this.inline = response.inline; | 514 this.inline = response.inline; |
| 513 this.inlineEmulated = !!response.inlineEmulated; | 515 this.inlineEmulated = !!response.inlineEmulated; |
| 514 | 516 |
| 515 if (this.inline) | 517 if (this.inline) |
| 516 this.addSelectorsInline(response.selectors, "standard"); | 518 this.addSelectorsInline(response.selectors, "standard"); |
| 517 | 519 |
| 518 if (this.tracer) | 520 if (this.tracer) |
| 519 this.tracer.addSelectors(response.selectors); | 521 this.tracer.addSelectors(response.selectors); |
| 520 | 522 |
| 523 // Prefer CSS selectors for -abp-has and -abp-contains unless the | |
| 524 // background page has asked us to use inline styles. | |
| 525 this.elemHideEmulation.useInlineStyles = this.inline || | |
| 526 this.inlineEmulated; | |
| 527 | |
| 521 this.elemHideEmulation.apply(response.emulatedPatterns); | 528 this.elemHideEmulation.apply(response.emulatedPatterns); |
| 522 }); | 529 }); |
| 523 } | 530 } |
| 524 }; | 531 }; |
| 525 | 532 |
| 526 if (document instanceof HTMLDocument) | 533 if (document instanceof HTMLDocument) |
| 527 { | 534 { |
| 528 checkSitekey(); | 535 checkSitekey(); |
| 529 | 536 |
| 530 elemhide = new ElemHide(); | 537 elemhide = new ElemHide(); |
| 531 elemhide.apply(); | 538 elemhide.apply(); |
| 532 | 539 |
| 533 document.addEventListener("error", event => | 540 document.addEventListener("error", event => |
| 534 { | 541 { |
| 535 checkCollapse(event.target); | 542 checkCollapse(event.target); |
| 536 }, true); | 543 }, true); |
| 537 | 544 |
| 538 document.addEventListener("load", event => | 545 document.addEventListener("load", event => |
| 539 { | 546 { |
| 540 let element = event.target; | 547 let element = event.target; |
| 541 if (/^i?frame$/.test(element.localName)) | 548 if (/^i?frame$/.test(element.localName)) |
| 542 checkCollapse(element); | 549 checkCollapse(element); |
| 543 }, true); | 550 }, true); |
| 544 } | 551 } |
| 545 | 552 |
| 546 window.checkCollapse = checkCollapse; | 553 window.checkCollapse = checkCollapse; |
| 547 window.elemhide = elemhide; | 554 window.elemhide = elemhide; |
| 548 window.typeMap = typeMap; | 555 window.typeMap = typeMap; |
| 549 window.getURLsFromElement = getURLsFromElement; | 556 window.getURLsFromElement = getURLsFromElement; |
| LEFT | RIGHT |
« no previous file
|
no next file »
|
Toggle Intra-line Diffs ('i')
|
Expand Comments ('e')
|
Collapse Comments ('c')
|
Toggle Comments ('s')
