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-2016 Eyeo GmbH | 3 * Copyright (C) 2006-2016 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 typeMap = { | 20 const typeMap = { |
21 "img": "IMAGE", | 21 "img": "IMAGE", |
22 "input": "IMAGE", | 22 "input": "IMAGE", |
23 "picture": "IMAGE", | 23 "picture": "IMAGE", |
24 "audio": "MEDIA", | 24 "audio": "MEDIA", |
25 "video": "MEDIA", | 25 "video": "MEDIA", |
26 "frame": "SUBDOCUMENT", | 26 "frame": "SUBDOCUMENT", |
27 "iframe": "SUBDOCUMENT", | 27 "iframe": "SUBDOCUMENT", |
28 "object": "OBJECT", | 28 "object": "OBJECT", |
29 "embed": "OBJECT" | 29 "embed": "OBJECT" |
30 }; | 30 }; |
(...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
75 } | 75 } |
76 | 76 |
77 return urls; | 77 return urls; |
78 } | 78 } |
79 | 79 |
80 function getURLsFromMediaElement(element) | 80 function getURLsFromMediaElement(element) |
81 { | 81 { |
82 let urls = getURLsFromAttributes(element); | 82 let urls = getURLsFromAttributes(element); |
83 | 83 |
84 for (let child of element.children) | 84 for (let child of element.children) |
| 85 { |
85 if (child.localName == "source" || child.localName == "track") | 86 if (child.localName == "source" || child.localName == "track") |
86 urls.push.apply(urls, getURLsFromAttributes(child)); | 87 urls.push.apply(urls, getURLsFromAttributes(child)); |
| 88 } |
87 | 89 |
88 if (element.poster) | 90 if (element.poster) |
89 urls.push(element.poster); | 91 urls.push(element.poster); |
90 | 92 |
91 return urls; | 93 return urls; |
92 } | 94 } |
93 | 95 |
94 function getURLsFromElement(element) | 96 function getURLsFromElement(element) |
95 { | 97 { |
96 let urls; | 98 let urls; |
(...skipping 101 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
198 | 200 |
199 this.observer = new MutationObserver(this.observe.bind(this)); | 201 this.observer = new MutationObserver(this.observe.bind(this)); |
200 this.trace = this.trace.bind(this); | 202 this.trace = this.trace.bind(this); |
201 | 203 |
202 if (document.readyState == "loading") | 204 if (document.readyState == "loading") |
203 document.addEventListener("DOMContentLoaded", this.trace); | 205 document.addEventListener("DOMContentLoaded", this.trace); |
204 else | 206 else |
205 this.trace(); | 207 this.trace(); |
206 } | 208 } |
207 ElementHidingTracer.prototype = { | 209 ElementHidingTracer.prototype = { |
208 checkNodes: nodes => | 210 checkNodes(nodes) |
209 { | 211 { |
210 let matchedSelectors = []; | 212 let matchedSelectors = []; |
211 | 213 |
212 // Find all selectors that match any hidden element inside the given nodes. | 214 // Find all selectors that match any hidden element inside the given nodes. |
213 for (let selector of this.selectors) | 215 for (let selector of this.selectors) |
214 { | 216 { |
215 for (let node of nodes) | 217 for (let node of nodes) |
216 { | 218 { |
217 let elements = node.querySelectorAll(selector); | 219 let elements = node.querySelectorAll(selector); |
218 let matched = false; | 220 let matched = false; |
(...skipping 16 matching lines...) Expand all Loading... |
235 } | 237 } |
236 } | 238 } |
237 | 239 |
238 if (matchedSelectors.length > 0) | 240 if (matchedSelectors.length > 0) |
239 ext.backgroundPage.sendMessage({ | 241 ext.backgroundPage.sendMessage({ |
240 type: "devtools.traceElemHide", | 242 type: "devtools.traceElemHide", |
241 selectors: matchedSelectors | 243 selectors: matchedSelectors |
242 }); | 244 }); |
243 }, | 245 }, |
244 | 246 |
245 onTimeout: function() | 247 onTimeout() |
246 { | 248 { |
247 this.checkNodes(this.changedNodes); | 249 this.checkNodes(this.changedNodes); |
248 this.changedNodes = []; | 250 this.changedNodes = []; |
249 this.timeout = null; | 251 this.timeout = null; |
250 }, | 252 }, |
251 | 253 |
252 observe: function(mutations) | 254 observe(mutations) |
253 { | 255 { |
254 // Forget previously changed nodes that are no longer in the DOM. | 256 // Forget previously changed nodes that are no longer in the DOM. |
255 for (let i = 0; i < this.changedNodes.length; i++) | 257 for (let i = 0; i < this.changedNodes.length; i++) |
256 { | 258 { |
257 if (!document.contains(this.changedNodes[i])) | 259 if (!document.contains(this.changedNodes[i])) |
258 this.changedNodes.splice(i--, 1); | 260 this.changedNodes.splice(i--, 1); |
259 } | 261 } |
260 | 262 |
261 for (let mutation of mutations) | 263 for (let mutation of mutations) |
262 { | 264 { |
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
297 this.changedNodes.push(node); | 299 this.changedNodes.push(node); |
298 } | 300 } |
299 | 301 |
300 // Check only nodes whose descendants have changed, and not more often | 302 // Check only nodes whose descendants have changed, and not more often |
301 // than once a second. Otherwise large pages with a lot of DOM mutations | 303 // than once a second. Otherwise large pages with a lot of DOM mutations |
302 // (like YouTube) freeze when the devtools panel is active. | 304 // (like YouTube) freeze when the devtools panel is active. |
303 if (this.timeout == null) | 305 if (this.timeout == null) |
304 this.timeout = setTimeout(this.onTimeout.bind(this), 1000); | 306 this.timeout = setTimeout(this.onTimeout.bind(this), 1000); |
305 }, | 307 }, |
306 | 308 |
307 trace: function() | 309 trace() |
308 { | 310 { |
309 this.checkNodes([document]); | 311 this.checkNodes([document]); |
310 | 312 |
311 this.observer.observe( | 313 this.observer.observe( |
312 document, | 314 document, |
313 { | 315 { |
314 childList: true, | 316 childList: true, |
315 attributes: true, | 317 attributes: true, |
316 subtree: true | 318 subtree: true |
317 } | 319 } |
318 ); | 320 ); |
319 }, | 321 }, |
320 | 322 |
321 disconnect: function() | 323 disconnect() |
322 { | 324 { |
323 document.removeEventListener("DOMContentLoaded", this.trace); | 325 document.removeEventListener("DOMContentLoaded", this.trace); |
324 this.observer.disconnect(); | 326 this.observer.disconnect(); |
325 clearTimeout(this.timeout); | 327 clearTimeout(this.timeout); |
326 } | 328 } |
327 }; | 329 }; |
328 | 330 |
329 function runInPageContext(fn, arg) | 331 function runInPageContext(fn, arg) |
330 { | 332 { |
331 let script = document.createElement("script"); | 333 let script = document.createElement("script"); |
(...skipping 100 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
432 type: "filters.get", | 434 type: "filters.get", |
433 what: "elemhideemulation" | 435 what: "elemhideemulation" |
434 }, callback); | 436 }, callback); |
435 }, | 437 }, |
436 this.addSelectors.bind(this) | 438 this.addSelectors.bind(this) |
437 ); | 439 ); |
438 } | 440 } |
439 ElemHide.prototype = { | 441 ElemHide.prototype = { |
440 selectorGroupSize: 200, | 442 selectorGroupSize: 200, |
441 | 443 |
442 createShadowTree: () => | 444 createShadowTree() |
443 { | 445 { |
444 // Use Shadow DOM if available as to not mess with with web pages that | 446 // Use Shadow DOM if available as to not mess with with web pages that |
445 // rely on the order of their own <style> tags (#309). However, creating | 447 // rely on the order of their own <style> tags (#309). However, creating |
446 // a shadow root breaks running CSS transitions. So we have to create | 448 // a shadow root breaks running CSS transitions. So we have to create |
447 // the shadow root before transistions might start (#452). | 449 // the shadow root before transistions might start (#452). |
448 if (!("createShadowRoot" in document.documentElement)) | 450 if (!("createShadowRoot" in document.documentElement)) |
449 return null; | 451 return null; |
450 | 452 |
451 // Using shadow DOM causes issues on some Google websites, | 453 // Using shadow DOM causes issues on some Google websites, |
452 // including Google Docs, Gmail and Blogger (#1770, #2602, #2687). | 454 // including Google Docs, Gmail and Blogger (#1770, #2602, #2687). |
(...skipping 12 matching lines...) Expand all Loading... |
465 { | 467 { |
466 runInPageContext(() => | 468 runInPageContext(() => |
467 { | 469 { |
468 let ourShadowRoot = document.documentElement.shadowRoot; | 470 let ourShadowRoot = document.documentElement.shadowRoot; |
469 if (!ourShadowRoot) | 471 if (!ourShadowRoot) |
470 return; | 472 return; |
471 let desc = Object.getOwnPropertyDescriptor(Element.prototype, "shadowRoo
t"); | 473 let desc = Object.getOwnPropertyDescriptor(Element.prototype, "shadowRoo
t"); |
472 let shadowRoot = Function.prototype.call.bind(desc.get); | 474 let shadowRoot = Function.prototype.call.bind(desc.get); |
473 | 475 |
474 Object.defineProperty(Element.prototype, "shadowRoot", { | 476 Object.defineProperty(Element.prototype, "shadowRoot", { |
475 configurable: true, enumerable: true, get: function() | 477 configurable: true, enumerable: true, get() |
476 { | 478 { |
477 let shadow = shadowRoot(this); | 479 let shadow = shadowRoot(this); |
478 return shadow == ourShadowRoot ? null : shadow; | 480 return shadow == ourShadowRoot ? null : shadow; |
479 } | 481 } |
480 }); | 482 }); |
481 }, null); | 483 }, null); |
482 } | 484 } |
483 | 485 |
484 return shadow; | 486 return shadow; |
485 }, | 487 }, |
486 | 488 |
487 addSelectors: function(selectors) | 489 addSelectors(selectors) |
488 { | 490 { |
489 if (selectors.length == 0) | 491 if (selectors.length == 0) |
490 return; | 492 return; |
491 | 493 |
492 if (!this.style) | 494 if (!this.style) |
493 { | 495 { |
494 // Create <style> element lazily, only if we add styles. Add it to | 496 // Create <style> element lazily, only if we add styles. Add it to |
495 // the shadow DOM if possible. Otherwise fallback to the <head> or | 497 // the shadow DOM if possible. Otherwise fallback to the <head> or |
496 // <html> element. If we have injected a style element before that | 498 // <html> element. If we have injected a style element before that |
497 // has been removed (the sheet property is null), create a new one. | 499 // has been removed (the sheet property is null), create a new one. |
(...skipping 30 matching lines...) Expand all Loading... |
528 // is! Edge apparently has no such limit.) | 530 // is! Edge apparently has no such limit.) |
529 // [1] - https://github.com/WebKit/webkit/blob/1cb2227f6b2a1035f7bdc46e5ab69
debb75fc1de/Source/WebCore/css/RuleSet.h#L68 | 531 // [1] - https://github.com/WebKit/webkit/blob/1cb2227f6b2a1035f7bdc46e5ab69
debb75fc1de/Source/WebCore/css/RuleSet.h#L68 |
530 for (let i = 0; i < selectors.length; i += this.selectorGroupSize) | 532 for (let i = 0; i < selectors.length; i += this.selectorGroupSize) |
531 { | 533 { |
532 let selector = selectors.slice(i, i + this.selectorGroupSize).join(", "); | 534 let selector = selectors.slice(i, i + this.selectorGroupSize).join(", "); |
533 this.style.sheet.insertRule(selector + "{display: none !important;}", | 535 this.style.sheet.insertRule(selector + "{display: none !important;}", |
534 this.style.sheet.cssRules.length); | 536 this.style.sheet.cssRules.length); |
535 } | 537 } |
536 }, | 538 }, |
537 | 539 |
538 apply: function() | 540 apply() |
539 { | 541 { |
540 let selectors = null; | 542 let selectors = null; |
541 let elemHideEmulationLoaded = false; | 543 let elemHideEmulationLoaded = false; |
542 | 544 |
543 let checkLoaded = function() | 545 let checkLoaded = function() |
544 { | 546 { |
545 if (!selectors || !elemHideEmulationLoaded) | 547 if (!selectors || !elemHideEmulationLoaded) |
546 return; | 548 return; |
547 | 549 |
548 if (this.tracer) | 550 if (this.tracer) |
(...skipping 23 matching lines...) Expand all Loading... |
572 checkLoaded(); | 574 checkLoaded(); |
573 }); | 575 }); |
574 } | 576 } |
575 }; | 577 }; |
576 | 578 |
577 if (document instanceof HTMLDocument) | 579 if (document instanceof HTMLDocument) |
578 { | 580 { |
579 checkSitekey(); | 581 checkSitekey(); |
580 wrapWebSocket(); | 582 wrapWebSocket(); |
581 | 583 |
582 let elemhide = new ElemHide(); | 584 // This variable is also used by our other content scripts, outside of the |
| 585 // current scope. |
| 586 var elemhide = new ElemHide(); |
583 elemhide.apply(); | 587 elemhide.apply(); |
584 | 588 |
585 document.addEventListener("error", event => | 589 document.addEventListener("error", event => |
586 { | 590 { |
587 checkCollapse(event.target); | 591 checkCollapse(event.target); |
588 }, true); | 592 }, true); |
589 | 593 |
590 document.addEventListener("load", event => | 594 document.addEventListener("load", event => |
591 { | 595 { |
592 let element = event.target; | 596 let element = event.target; |
593 if (/^i?frame$/.test(element.localName)) | 597 if (/^i?frame$/.test(element.localName)) |
594 checkCollapse(element); | 598 checkCollapse(element); |
595 }, true); | 599 }, true); |
596 } | 600 } |
LEFT | RIGHT |