Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code
Issues
All Issues

Side by Side Diff: include.preload.js

Issue 29894561: Issue 6998 - Stop using Shadow DOM v0 (Closed) Base URL: https://hg.adblockplus.org/adblockpluschrome/
Patch Set: Created Sept. 28, 2018, 11:14 a.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
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("./adblockpluscore/lib/common"); 20 let {splitSelector} = require("./adblockpluscore/lib/common");
Sebastian Noack 2018/09/28 12:38:16 It seems this import is redundant now.
Manish Jethani 2018/09/28 12:40:39 Done.
21 let {ElemHideEmulation} = 21 let {ElemHideEmulation} =
22 require("./adblockpluscore/lib/content/elemHideEmulation"); 22 require("./adblockpluscore/lib/content/elemHideEmulation");
23 23
24 // This variable is also used by our other content scripts. 24 // This variable is also used by our other content scripts.
25 let contentFiltering; 25 let contentFiltering;
26 26
27 const typeMap = new Map([ 27 const typeMap = new Map([
28 ["img", "IMAGE"], 28 ["img", "IMAGE"],
29 ["input", "IMAGE"], 29 ["input", "IMAGE"],
30 ["picture", "IMAGE"], 30 ["picture", "IMAGE"],
(...skipping 358 matching lines...) Expand 10 before | Expand all | Expand 10 after
389 disconnect() 389 disconnect()
390 { 390 {
391 document.removeEventListener("DOMContentLoaded", this.trace); 391 document.removeEventListener("DOMContentLoaded", this.trace);
392 this.observer.disconnect(); 392 this.observer.disconnect();
393 clearTimeout(this.timeout); 393 clearTimeout(this.timeout);
394 } 394 }
395 }; 395 };
396 396
397 function ContentFiltering() 397 function ContentFiltering()
398 { 398 {
399 this.shadow = this.createShadowTree();
400 this.styles = new Map(); 399 this.styles = new Map();
401 this.tracer = null; 400 this.tracer = null;
402 this.inline = true; 401 this.inline = true;
403 this.inlineEmulated = true; 402 this.inlineEmulated = true;
404 403
405 this.elemHideEmulation = new ElemHideEmulation( 404 this.elemHideEmulation = new ElemHideEmulation(
406 this.addSelectors.bind(this), 405 this.addSelectors.bind(this),
407 this.hideElements.bind(this) 406 this.hideElements.bind(this)
408 ); 407 );
409 } 408 }
410 ContentFiltering.prototype = { 409 ContentFiltering.prototype = {
411 selectorGroupSize: 1024, 410 selectorGroupSize: 1024,
412 411
413 createShadowTree()
414 {
415 // Use Shadow DOM if available as to not mess with with web pages that
416 // rely on the order of their own <style> tags (#309). However, creating
417 // a shadow root breaks running CSS transitions. So we have to create
418 // the shadow root before transistions might start (#452).
419 if (!("createShadowRoot" in document.documentElement))
420 return null;
421
422 // Both Firefox and Chrome 66+ support user style sheets, so we can avoid
423 // creating an unnecessary shadow root on these platforms.
424 let match = /\bChrome\/(\d+)/.exec(navigator.userAgent);
425 if (!match || match[1] >= 66)
426 return null;
427
428 // Using shadow DOM causes issues on some Google websites,
429 // including Google Docs, Gmail and Blogger (#1770, #2602, #2687).
430 if (/\.(?:google|blogger)\.com$/.test(document.domain))
431 return null;
432
433 // Finally since some users have both AdBlock and Adblock Plus installed we
434 // have to consider how the two extensions interact. For example we want to
435 // avoid creating the shadowRoot twice.
436 let shadow = document.documentElement.shadowRoot ||
437 document.documentElement.createShadowRoot();
438 shadow.appendChild(document.createElement("content"));
439
440 return shadow;
441 },
442
443 addSelectorsInline(selectors, groupName, appendOnly = false) 412 addSelectorsInline(selectors, groupName, appendOnly = false)
444 { 413 {
445 let style = this.styles.get(groupName); 414 let style = this.styles.get(groupName);
446 415
447 if (style && !appendOnly) 416 if (style && !appendOnly)
448 { 417 {
449 while (style.sheet.cssRules.length > 0) 418 while (style.sheet.cssRules.length > 0)
450 style.sheet.deleteRule(0); 419 style.sheet.deleteRule(0);
451 } 420 }
452 421
453 if (selectors.length == 0) 422 if (selectors.length == 0)
454 return; 423 return;
455 424
456 if (!style) 425 if (!style)
457 { 426 {
458 // Create <style> element lazily, only if we add styles. Add it to 427 // Create <style> element lazily, only if we add styles. Add it to
459 // the shadow DOM if possible. Otherwise fallback to the <head> or 428 // the <head> or <html> element. If we have injected a style element
460 // <html> element. If we have injected a style element before that 429 // before that has been removed (the sheet property is null), create a
461 // has been removed (the sheet property is null), create a new one. 430 // new one.
462 style = document.createElement("style"); 431 style = document.createElement("style");
463 (this.shadow || document.head || 432 (document.head || document.documentElement).appendChild(style);
464 document.documentElement).appendChild(style);
465 433
466 // It can happen that the frame already navigated to a different 434 // It can happen that the frame already navigated to a different
467 // document while we were waiting for the background page to respond. 435 // document while we were waiting for the background page to respond.
468 // In that case the sheet property will stay null, after addind the 436 // In that case the sheet property may stay null, after adding the
469 // <style> element to the shadow DOM. 437 // <style> element.
470 if (!style.sheet) 438 if (!style.sheet)
471 return; 439 return;
472 440
473 this.styles.set(groupName, style); 441 this.styles.set(groupName, style);
474 } 442 }
475 443
476 // If using shadow DOM, we have to add the ::content pseudo-element
477 // before each selector, in order to match elements within the
478 // insertion point.
479 let preparedSelectors = [];
480 if (this.shadow)
481 {
482 for (let selector of selectors)
483 {
484 let subSelectors = splitSelector(selector);
485 for (let subSelector of subSelectors)
486 preparedSelectors.push("::content " + subSelector);
487 }
488 }
489 else
490 {
491 preparedSelectors = selectors;
492 }
493
494 // Chromium's Blink engine supports only up to 8,192 simple selectors, and 444 // Chromium's Blink engine supports only up to 8,192 simple selectors, and
495 // even fewer compound selectors, in a rule. The exact number of selectors 445 // even fewer compound selectors, in a rule. The exact number of selectors
496 // that would work depends on their sizes (e.g. "#foo .bar" has a 446 // that would work depends on their sizes (e.g. "#foo .bar" has a
497 // size of 2). Since we don't know the sizes of the selectors here, we 447 // size of 2). Since we don't know the sizes of the selectors here, we
498 // simply split them into groups of 1,024, based on the reasonable 448 // simply split them into groups of 1,024, based on the reasonable
499 // assumption that the average selector won't have a size greater than 8. 449 // assumption that the average selector won't have a size greater than 8.
500 // The alternative would be to calculate the sizes of the selectors and 450 // The alternative would be to calculate the sizes of the selectors and
501 // divide them up accordingly, but this approach is more efficient and has 451 // divide them up accordingly, but this approach is more efficient and has
502 // worked well in practice. In theory this could still lead to some 452 // worked well in practice. In theory this could still lead to some
503 // selectors not working on Chromium, but it is highly unlikely. 453 // selectors not working on Chromium, but it is highly unlikely.
504 // See issue #6298 and https://crbug.com/804179 454 // See issue #6298 and https://crbug.com/804179
505 for (let i = 0; i < preparedSelectors.length; i += this.selectorGroupSize) 455 for (let i = 0; i < selectors.length; i += this.selectorGroupSize)
506 { 456 {
507 let selector = preparedSelectors.slice( 457 let selector = selectors.slice(i, i + this.selectorGroupSize).join(", ");
508 i, i + this.selectorGroupSize
509 ).join(", ");
510 style.sheet.insertRule(selector + "{display: none !important;}", 458 style.sheet.insertRule(selector + "{display: none !important;}",
511 style.sheet.cssRules.length); 459 style.sheet.cssRules.length);
512 } 460 }
513 }, 461 },
514 462
515 addSelectors(selectors, filters, groupName = "emulated", appendOnly = false) 463 addSelectors(selectors, filters, groupName = "emulated", appendOnly = false)
516 { 464 {
517 if (this.inline || this.inlineEmulated) 465 if (this.inline || this.inlineEmulated)
518 { 466 {
519 // Insert the style rules inline if we have been instructed by the 467 // Insert the style rules inline if we have been instructed by the
(...skipping 89 matching lines...) Expand 10 before | Expand all | Expand 10 after
609 let element = event.target; 557 let element = event.target;
610 if (/^i?frame$/.test(element.localName)) 558 if (/^i?frame$/.test(element.localName))
611 checkCollapse(element); 559 checkCollapse(element);
612 }, true); 560 }, true);
613 } 561 }
614 562
615 window.checkCollapse = checkCollapse; 563 window.checkCollapse = checkCollapse;
616 window.contentFiltering = contentFiltering; 564 window.contentFiltering = contentFiltering;
617 window.typeMap = typeMap; 565 window.typeMap = typeMap;
618 window.getURLsFromElement = getURLsFromElement; 566 window.getURLsFromElement = getURLsFromElement;
OLDNEW
« no previous file with comments | « no previous file | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld