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

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: Use <content> if <shadow> is not supported Created March 5, 2018, 12:47 p.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.
Jump to:
Left: Side by side diff | Download
Right: Side by side diff | Download
« 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') | Show Comments Hide Comments ('s')
LEFTRIGHT
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 328 matching lines...) Expand 10 before | Expand all | Expand 10 after
339 } 339 }
340 }; 340 };
341 341
342 function ElemHide() 342 function ElemHide()
343 { 343 {
344 this.shadow = this.createShadowTree(); 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 383 shadow.appendChild(document.createElement("content"));
379 // Firefox does not support the <shadow> tag (#6441).
380 let contentTagName = typeof HTMLShadowElement != "undefined" ?
381 "shadow" : "content";
Sebastian Noack 2018/03/08 18:34:26 I wonder whether we should just use <content> no m
Manish Jethani 2018/03/08 19:44:54 Are you sure that Chrome 49 supports <content>? I
Manish Jethani 2018/03/08 19:53:57 I checked the Chromium commit log and entries ment
Sebastian Noack 2018/03/08 20:36:16 Yes, I'm pretty sure <content> already existed whe
382 shadow.appendChild(document.createElement(contentTagName));
383 384
384 return shadow; 385 return shadow;
385 }, 386 },
386 387
387 addSelectorsInline(selectors, groupName) 388 addSelectorsInline(selectors, groupName)
388 { 389 {
389 let style = this.styles.get(groupName); 390 let style = this.styles.get(groupName);
390 391
391 if (style) 392 if (style)
392 { 393 {
(...skipping 119 matching lines...) Expand 10 before | Expand all | Expand 10 after
512 513
513 this.inline = response.inline; 514 this.inline = response.inline;
514 this.inlineEmulated = !!response.inlineEmulated; 515 this.inlineEmulated = !!response.inlineEmulated;
515 516
516 if (this.inline) 517 if (this.inline)
517 this.addSelectorsInline(response.selectors, "standard"); 518 this.addSelectorsInline(response.selectors, "standard");
518 519
519 if (this.tracer) 520 if (this.tracer)
520 this.tracer.addSelectors(response.selectors); 521 this.tracer.addSelectors(response.selectors);
521 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
522 this.elemHideEmulation.apply(response.emulatedPatterns); 528 this.elemHideEmulation.apply(response.emulatedPatterns);
523 }); 529 });
524 } 530 }
525 }; 531 };
526 532
527 if (document instanceof HTMLDocument) 533 if (document instanceof HTMLDocument)
528 { 534 {
529 checkSitekey(); 535 checkSitekey();
530 536
531 elemhide = new ElemHide(); 537 elemhide = new ElemHide();
532 elemhide.apply(); 538 elemhide.apply();
533 539
534 document.addEventListener("error", event => 540 document.addEventListener("error", event =>
535 { 541 {
536 checkCollapse(event.target); 542 checkCollapse(event.target);
537 }, true); 543 }, true);
538 544
539 document.addEventListener("load", event => 545 document.addEventListener("load", event =>
540 { 546 {
541 let element = event.target; 547 let element = event.target;
542 if (/^i?frame$/.test(element.localName)) 548 if (/^i?frame$/.test(element.localName))
543 checkCollapse(element); 549 checkCollapse(element);
544 }, true); 550 }, true);
545 } 551 }
546 552
547 window.checkCollapse = checkCollapse; 553 window.checkCollapse = checkCollapse;
548 window.elemhide = elemhide; 554 window.elemhide = elemhide;
549 window.typeMap = typeMap; 555 window.typeMap = typeMap;
550 window.getURLsFromElement = getURLsFromElement; 556 window.getURLsFromElement = getURLsFromElement;
LEFTRIGHT
« no previous file | no next file » | Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Toggle Comments ('s')

Powered by Google App Engine
This is Rietveld