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

Side by Side Diff: include.preload.js

Issue 29331619: Issue 2397 - Integrate CSS property filters into adblockpluschrome (Closed)
Patch Set: Addressed some of Sebastian's feedback Created Dec. 10, 2015, 3:14 p.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View unified diff | Download patch
« dependencies ('K') | « dependencies ('k') | metadata.common » ('j') | 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-2015 Eyeo GmbH 3 * Copyright (C) 2006-2015 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 267 matching lines...) Expand 10 before | Expand all | Expand 10 after
278 } 278 }
279 279
280 return result; 280 return result;
281 } 281 }
282 282
283 function init(document) 283 function init(document)
284 { 284 {
285 var shadow = null; 285 var shadow = null;
286 var style = null; 286 var style = null;
287 var observer = null; 287 var observer = null;
288 var propertyFilters = new CSSPropertyFilters(window, addElemHideSelectors);
Sebastian Noack 2015/12/10 16:35:36 Note that the constructor already calls load() and
kzar 2015/12/10 19:31:06 Acknowledged.
288 289
289 // Use Shadow DOM if available to don't mess with web pages that rely on 290 // Use Shadow DOM if available to don't mess with web pages that rely on
290 // the order of their own <style> tags (#309). 291 // the order of their own <style> tags (#309).
291 // 292 //
292 // However, creating a shadow root breaks running CSS transitions. So we 293 // However, creating a shadow root breaks running CSS transitions. So we
293 // have to create the shadow root before transistions might start (#452). 294 // have to create the shadow root before transistions might start (#452).
294 // 295 //
295 // Also, using shadow DOM causes issues on some Google websites, 296 // Also, using shadow DOM causes issues on some Google websites,
296 // including Google Docs and Gmail (#1770, #2602). 297 // including Google Docs and Gmail (#1770, #2602).
297 if ("createShadowRoot" in document.documentElement && !/\.google\.com$/.test(d ocument.domain)) 298 if ("createShadowRoot" in document.documentElement && !/\.google\.com$/.test(d ocument.domain))
298 { 299 {
299 shadow = document.documentElement.createShadowRoot(); 300 shadow = document.documentElement.createShadowRoot();
300 shadow.appendChild(document.createElement("shadow")); 301 shadow.appendChild(document.createElement("shadow"));
301 } 302 }
302 303
303 var updateStylesheet = function(reinject) 304 function addElemHideSelectors(selectors)
304 { 305 {
305 ext.backgroundPage.sendMessage({type: "get-selectors"}, function(selectors) 306 if (selectors.length == 0)
307 return;
308
309 if (!style)
306 { 310 {
311 // Create <style> element lazily, only if we add styles. Add it to
312 // the shadow DOM if possible. Otherwise fallback to the <head> or
313 // <html> element. If we have injected a style element before that
314 // has been removed (the sheet property is null), create a new one.
315 style = document.createElement("style");
316 (shadow || document.head || document.documentElement).appendChild(style);
317
318 // It can happen that the frame already navigated to a different
319 // document while we were waiting for the background page to respond.
320 // In that case the sheet property will stay null, after addind the
321 // <style> element to the shadow DOM.
322 if (!style.sheet)
323 return;
324
325 observer = reinjectRulesWhenRemoved(document, style);
326 }
327
328 // If using shadow DOM, we have to add the ::content pseudo-element
329 // before each selector, in order to match elements within the
330 // insertion point.
331 if (shadow)
332 selectors = convertSelectorsForShadowDOM(selectors);
333
334 // WebKit (and Blink?) apparently chokes when the selector list in a
335 // CSS rule is huge. So we split the elemhide selectors into groups.
336 while (selectors.length > 0)
337 {
338 var selector = selectors.splice(0, SELECTOR_GROUP_SIZE).join(", ");
339 style.sheet.addRule(selector, "display: none !important;");
340 }
341 };
342
343 var updateStylesheet = function()
344 {
345 var selectors = null;
346 var CSSPropertyFiltersLoaded = false;
347
348 var checkLoaded = function()
349 {
350 if (!selectors || !CSSPropertyFiltersLoaded)
351 return;
352
307 if (observer) 353 if (observer)
308 {
309 observer.disconnect(); 354 observer.disconnect();
310 observer = null; 355 observer = null;
311 }
312 356
313 if (style && style.parentElement) 357 if (style && style.parentElement)
314 {
315 style.parentElement.removeChild(style); 358 style.parentElement.removeChild(style);
316 style = null; 359 style = null;
317 }
318 360
319 if (selectors.length > 0) 361 addElemHideSelectors(selectors);
320 { 362 propertyFilters.apply();
321 // Create <style> element lazily, only if we add styles. Add it to 363 };
322 // the shadow DOM if possible. Otherwise fallback to the <head> or
323 // <html> element. If we have injected a style element before that
324 // has been removed (the sheet property is null), create a new one.
325 style = document.createElement("style");
326 (shadow || document.head || document.documentElement).appendChild(style) ;
327 364
328 // It can happen that the frame already navigated to a different 365 ext.backgroundPage.sendMessage({type: "get-selectors"}, function(response)
329 // document while we were waiting for the background page to respond. 366 {
330 // In that case the sheet property will stay null, after adding the 367 selectors = response;
331 // <style> element to the shadow DOM. 368 checkLoaded();
332 if (style.sheet) 369 });
333 {
334 // If using shadow DOM, we have to add the ::content pseudo-element
335 // before each selector, in order to match elements within the
336 // insertion point.
337 if (shadow)
338 selectors = convertSelectorsForShadowDOM(selectors);
339 370
340 // WebKit (and Blink?) apparently chokes when the selector list in a 371 propertyFilters.load(function()
341 // CSS rule is huge. So we split the elemhide selectors into groups. 372 {
342 for (var i = 0; selectors.length > 0; i++) 373 CSSPropertyFiltersLoaded = true;
343 { 374 checkLoaded();
344 var selector = selectors.splice(0, SELECTOR_GROUP_SIZE).join(", ");
345 style.sheet.insertRule(selector + " { display: none !important; }", i);
346 }
347 }
348
349 observer = reinjectRulesWhenRemoved(document, style);
350 }
351 }); 375 });
352 }; 376 };
353 377
354 updateStylesheet(); 378 updateStylesheet();
355 379
356 document.addEventListener("error", function(event) 380 document.addEventListener("error", function(event)
357 { 381 {
358 checkCollapse(event.target); 382 checkCollapse(event.target);
359 }, true); 383 }, true);
360 384
(...skipping 31 matching lines...) Expand 10 before | Expand all | Expand 10 after
392 }, true); 416 }, true);
393 417
394 return updateStylesheet; 418 return updateStylesheet;
395 } 419 }
396 420
397 if (document instanceof HTMLDocument) 421 if (document instanceof HTMLDocument)
398 { 422 {
399 checkSitekey(); 423 checkSitekey();
400 window.updateStylesheet = init(document); 424 window.updateStylesheet = init(document);
401 } 425 }
OLDNEW
« dependencies ('K') | « dependencies ('k') | metadata.common » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld