Side by Side Diff: include.preload.js
Issue 29893559:
Issue 6999 - Generate style sheets in background page (Closed)
Base URL: https://hg.adblockplus.org/adblockpluschrome/
Patch Set: Generate collapsing style sheet also in background page
Created Sept. 29, 2018, 10:38 a.m.
| Left: | ||
| Right: |
Use n/p to move between diff chunks;
N/P to move between comments.
« no previous file with comments
|
« dependencies ('k')
|
lib/contentFiltering.js » ('j')
|
no next file with comments »
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')
| OLD | NEW |
|---|---|
| 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 207 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 218 }, | 218 }, |
| 219 collapse => | 219 collapse => |
| 220 { | 220 { |
| 221 if (collapse) | 221 if (collapse) |
| 222 { | 222 { |
| 223 if (selector) | 223 if (selector) |
| 224 { | 224 { |
| 225 if (!collapsingSelectors.has(selector)) | 225 if (!collapsingSelectors.has(selector)) |
| 226 { | 226 { |
| 227 collapsingSelectors.add(selector); | 227 collapsingSelectors.add(selector); |
| 228 contentFiltering.addSelectors([selector], null, "collapsing", true); | 228 contentFiltering.addSelectors([selector], "collapsing", true); |
| 229 } | 229 } |
| 230 } | 230 } |
| 231 else | 231 else |
| 232 { | 232 { |
| 233 hideElement(element); | 233 hideElement(element); |
| 234 } | 234 } |
| 235 } | 235 } |
| 236 } | 236 } |
| 237 ); | 237 ); |
| 238 } | 238 } |
| (...skipping 151 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 390 document.removeEventListener("DOMContentLoaded", this.trace); | 390 document.removeEventListener("DOMContentLoaded", this.trace); |
| 391 this.observer.disconnect(); | 391 this.observer.disconnect(); |
| 392 clearTimeout(this.timeout); | 392 clearTimeout(this.timeout); |
| 393 } | 393 } |
| 394 }; | 394 }; |
| 395 | 395 |
| 396 function ContentFiltering() | 396 function ContentFiltering() |
| 397 { | 397 { |
| 398 this.styles = new Map(); | 398 this.styles = new Map(); |
| 399 this.tracer = null; | 399 this.tracer = null; |
| 400 this.inline = true; | |
| 401 | 400 |
| 402 this.elemHideEmulation = new ElemHideEmulation( | 401 this.elemHideEmulation = new ElemHideEmulation(this.hideElements.bind(this)); |
| 403 () => {}, | |
| 404 this.hideElements.bind(this) | |
| 405 ); | |
| 406 } | 402 } |
| 407 ContentFiltering.prototype = { | 403 ContentFiltering.prototype = { |
| 408 selectorGroupSize: 1024, | 404 addStyleSheetInline(styleSheet, groupName = "standard", appendOnly = false) |
| 409 | |
| 410 addSelectorsInline(selectors, groupName, appendOnly = false) | |
| 411 { | 405 { |
| 412 let style = this.styles.get(groupName); | 406 let style = this.styles.get(groupName); |
| 413 | 407 |
| 414 if (style && !appendOnly) | |
| 415 { | |
| 416 while (style.sheet.cssRules.length > 0) | |
| 417 style.sheet.deleteRule(0); | |
| 418 } | |
| 419 | |
| 420 if (selectors.length == 0) | |
| 421 return; | |
| 422 | |
| 423 if (!style) | 408 if (!style) |
| 424 { | 409 { |
| 425 // Create <style> element lazily, only if we add styles. Add it to | 410 // Create <style> element lazily, only if we add styles. Add it to |
| 426 // the <head> or <html> element. If we have injected a style element | 411 // the <head> or <html> element. If we have injected a style element |
| 427 // before that has been removed (the sheet property is null), create a | 412 // before that has been removed (the sheet property is null), create a |
| 428 // new one. | 413 // new one. |
| 429 style = document.createElement("style"); | 414 style = document.createElement("style"); |
| 430 (document.head || document.documentElement).appendChild(style); | 415 (document.head || document.documentElement).appendChild(style); |
| 431 | 416 |
| 432 // It can happen that the frame already navigated to a different | 417 // It can happen that the frame already navigated to a different |
| 433 // document while we were waiting for the background page to respond. | 418 // document while we were waiting for the background page to respond. |
| 434 // In that case the sheet property may stay null, after adding the | 419 // In that case the sheet property may stay null, after adding the |
| 435 // <style> element. | 420 // <style> element. |
| 436 if (!style.sheet) | 421 if (!style.sheet) |
| 437 return; | 422 return; |
| 438 | 423 |
| 439 this.styles.set(groupName, style); | 424 this.styles.set(groupName, style); |
| 440 } | 425 } |
| 441 | 426 |
| 442 // Chromium's Blink engine supports only up to 8,192 simple selectors, and | 427 if (appendOnly) |
| 443 // even fewer compound selectors, in a rule. The exact number of selectors | 428 style.textContent += styleSheet; |
| 444 // that would work depends on their sizes (e.g. "#foo .bar" has a | 429 else |
| 445 // size of 2). Since we don't know the sizes of the selectors here, we | 430 style.textContent = styleSheet; |
| 446 // simply split them into groups of 1,024, based on the reasonable | |
| 447 // assumption that the average selector won't have a size greater than 8. | |
| 448 // The alternative would be to calculate the sizes of the selectors and | |
| 449 // divide them up accordingly, but this approach is more efficient and has | |
| 450 // worked well in practice. In theory this could still lead to some | |
| 451 // selectors not working on Chromium, but it is highly unlikely. | |
| 452 // See issue #6298 and https://crbug.com/804179 | |
| 453 for (let i = 0; i < selectors.length; i += this.selectorGroupSize) | |
| 454 { | |
| 455 let selector = selectors.slice(i, i + this.selectorGroupSize).join(", "); | |
| 456 style.sheet.insertRule(selector + "{display: none !important;}", | |
| 457 style.sheet.cssRules.length); | |
| 458 } | |
| 459 }, | 431 }, |
| 460 | 432 |
| 461 addSelectors(selectors, filters, groupName = "emulated", appendOnly = false) | 433 addSelectors(selectors, groupName = "standard", appendOnly = false) |
| 462 { | 434 { |
| 463 if (this.inline) | 435 browser.runtime.sendMessage({ |
| 436 type: "content.injectSelectors", | |
| 437 selectors, | |
| 438 groupName, | |
| 439 appendOnly | |
| 440 }, | |
| 441 styleSheet => | |
| 464 { | 442 { |
| 465 // Insert the style rules inline if we have been instructed by the | 443 if (styleSheet) |
| 466 // background page to do so. This is usually the case, except on platforms | 444 { |
| 467 // that do support user stylesheets via the browser.tabs.insertCSS API | 445 // Insert the style sheet inline if we have been instructed by the |
| 468 // (Firefox 53 onwards for now and possibly Chrome in the near future). | 446 // background page to do so. This is rarely the case, except on platform s |
| 469 // Once all supported platforms have implemented this API, we can remove | 447 // that do not support user stylesheets via the browser.tabs.insertCSS A PI |
| 470 // the code below. See issue #5090. | 448 // (Firefox <53, Chrome <66, and Edge). |
| 471 // Related Chrome and Firefox issues: | 449 // Once all supported platforms have implemented this API, we can remove |
| 472 // https://bugs.chromium.org/p/chromium/issues/detail?id=632009 | 450 // the code below. See issue #5090. |
| 473 // https://bugzilla.mozilla.org/show_bug.cgi?id=1310026 | 451 // Related Chrome and Firefox issues: |
| 474 this.addSelectorsInline(selectors, groupName, appendOnly); | 452 // https://bugs.chromium.org/p/chromium/issues/detail?id=632009 |
| 475 } | 453 // https://bugzilla.mozilla.org/show_bug.cgi?id=1310026 |
| 476 else | 454 this.addStyleSheetInline(styleSheet, groupName, appendOnly); |
| 477 { | 455 } |
| 478 browser.runtime.sendMessage({ | 456 }); |
| 479 type: "content.injectSelectors", | |
| 480 selectors, | |
| 481 groupName, | |
| 482 appendOnly | |
| 483 }); | |
| 484 } | |
| 485 | |
| 486 // Only trace selectors that are based directly on hiding filters | |
| 487 // (i.e. leave out collapsing selectors). | |
| 488 if (this.tracer && groupName != "collapsing") | |
| 489 this.tracer.addSelectors(selectors, filters); | |
| 490 }, | 457 }, |
| 491 | 458 |
| 492 hideElements(elements, filters) | 459 hideElements(elements, filters) |
| 493 { | 460 { |
| 494 for (let element of elements) | 461 for (let element of elements) |
| 495 hideElement(element); | 462 hideElement(element); |
| 496 | 463 |
| 497 if (this.tracer) | 464 if (this.tracer) |
| 498 { | 465 { |
| 499 browser.runtime.sendMessage({ | 466 browser.runtime.sendMessage({ |
| (...skipping 12 matching lines...) Expand all Loading... | |
| 512 }, | 479 }, |
| 513 response => | 480 response => |
| 514 { | 481 { |
| 515 if (this.tracer) | 482 if (this.tracer) |
| 516 this.tracer.disconnect(); | 483 this.tracer.disconnect(); |
| 517 this.tracer = null; | 484 this.tracer = null; |
| 518 | 485 |
| 519 if (response.trace) | 486 if (response.trace) |
| 520 this.tracer = new ElementHidingTracer(); | 487 this.tracer = new ElementHidingTracer(); |
| 521 | 488 |
| 522 this.inline = response.inline; | 489 if (response.inline) |
| 523 | 490 this.addStyleSheetInline(response.styleSheet.code); |
| 524 if (this.inline) | |
| 525 this.addSelectorsInline(response.selectors, "standard"); | |
| 526 | 491 |
| 527 if (this.tracer) | 492 if (this.tracer) |
| 528 this.tracer.addSelectors(response.selectors); | 493 this.tracer.addSelectors(response.styleSheet.selectors); |
| 529 | 494 |
| 530 this.elemHideEmulation.apply(response.emulatedPatterns); | 495 this.elemHideEmulation.apply(response.emulatedPatterns); |
| 531 }); | 496 }); |
| 532 } | 497 } |
| 533 }; | 498 }; |
| 534 | 499 |
| 535 if (document instanceof HTMLDocument) | 500 if (document instanceof HTMLDocument) |
| 536 { | 501 { |
| 537 checkSitekey(); | 502 checkSitekey(); |
| 538 | 503 |
| (...skipping 10 matching lines...) Expand all Loading... | |
| 549 let element = event.target; | 514 let element = event.target; |
| 550 if (/^i?frame$/.test(element.localName)) | 515 if (/^i?frame$/.test(element.localName)) |
| 551 checkCollapse(element); | 516 checkCollapse(element); |
| 552 }, true); | 517 }, true); |
| 553 } | 518 } |
| 554 | 519 |
| 555 window.checkCollapse = checkCollapse; | 520 window.checkCollapse = checkCollapse; |
| 556 window.contentFiltering = contentFiltering; | 521 window.contentFiltering = contentFiltering; |
| 557 window.typeMap = typeMap; | 522 window.typeMap = typeMap; |
| 558 window.getURLsFromElement = getURLsFromElement; | 523 window.getURLsFromElement = getURLsFromElement; |
| OLD | NEW |
« no previous file with comments
|
« dependencies ('k')
|
lib/contentFiltering.js » ('j')
|
no next file with comments »
