Bug 1570631 - Part 3: implement doorhangers using CFR; r=k88hudson

#   add `OPEN_PROTECTION_PANEL` command
  #   add `type` trigger matching
  #   add `trackingProtection` trigger listener
  #   add socialtracker/fingerprinter/cryptominer doorhangers

Differential Revision: https://phabricator.services.mozilla.com/D43084

--HG--
extra : moz-landing-system : lando
This commit is contained in:
Liang-Heng Chen 2019-09-11 09:16:49 +00:00
parent f4c5daad0c
commit 223988a9dd
11 changed files with 279 additions and 0 deletions

View File

@ -161,6 +161,7 @@ for (const type of [
"SHOW_FIREFOX_ACCOUNTS",
"PIN_CURRENT_TAB",
"ENABLE_FIREFOX_MONITOR",
"OPEN_PROTECTION_PANEL",
]) {
ASRouterActions[type] = type;
}

View File

@ -1844,6 +1844,10 @@ class _ASRouter {
csp: null,
});
break;
case ra.OPEN_PROTECTION_PANEL:
let { gProtectionsHandler } = target.browser.ownerGlobal;
gProtectionsHandler.showProtectionsPopup({});
break;
}
}

View File

@ -488,8 +488,13 @@ this.ASRouterTargeting = {
return (
(candidateMessageTrigger.params &&
trigger.param.host &&
candidateMessageTrigger.params.includes(trigger.param.host)) ||
(candidateMessageTrigger.params &&
trigger.param.type &&
candidateMessageTrigger.params.includes(trigger.param.type)) ||
(candidateMessageTrigger.patterns &&
trigger.param.url &&
new MatchPatternSet(candidateMessageTrigger.patterns).matches(
trigger.param.url
))

View File

@ -429,6 +429,107 @@ this.ASRouterTriggerListeners = new Map([
},
},
],
/**
* Attach listener to count location changes and notify the trigger handler
* on content blocked event
*/
[
"trackingProtection",
{
_initialized: false,
_triggerHandler: null,
_events: [],
_sessionPageLoad: 0,
onLocationChange: null,
async init(triggerHandler, params, patterns) {
params.forEach(p => this._events.push(p));
if (!this._initialized) {
Services.obs.addObserver(this, "SiteProtection:ContentBlockingEvent");
this.onLocationChange = this._onLocationChange.bind(this);
// Add listeners to all existing browser windows
for (let win of Services.wm.getEnumerator("navigator:browser")) {
if (isPrivateWindow(win)) {
continue;
}
await checkStartupFinished(win);
win.gBrowser.addTabsProgressListener(this);
}
this._initialized = true;
}
this._triggerHandler = triggerHandler;
},
uninit() {
if (this._initialized) {
Services.obs.removeObserver(
this,
"SiteProtection:ContentBlockingEvent"
);
for (let win of Services.wm.getEnumerator("navigator:browser")) {
if (isPrivateWindow(win)) {
continue;
}
win.gBrowser.removeTabsProgressListener(this);
}
this.onLocationChange = null;
this._initialized = false;
}
this._triggerHandler = null;
this._events = [];
this._sessionPageLoad = 0;
},
observe(aSubject, aTopic, aData) {
switch (aTopic) {
case "SiteProtection:ContentBlockingEvent":
const { browser, host, event } = aSubject.wrappedJSObject;
if (this._events.includes(event)) {
this._triggerHandler(browser, {
id: "trackingProtection",
param: {
host,
type: event,
},
context: {
pageLoad: this._sessionPageLoad,
},
});
}
break;
}
},
_onLocationChange(
aBrowser,
aWebProgress,
aRequest,
aLocationURI,
aFlags
) {
// Some websites trigger redirect events after they finish loading even
// though the location remains the same. This results in onLocationChange
// events to be fired twice.
const isSameDocument = !!(
aFlags & Ci.nsIWebProgressListener.LOCATION_CHANGE_SAME_DOCUMENT
);
if (
["http", "https"].includes(aLocationURI.scheme) &&
aWebProgress.isTopLevel &&
!isSameDocument
) {
this._sessionPageLoad += 1;
}
},
},
],
]);
const EXPORTED_SYMBOLS = ["ASRouterTriggerListeners"];

View File

@ -605,6 +605,144 @@ const CFR_MESSAGES = [
id: "newSavedLogin",
},
},
{
id: "SOCIAL_TRACKING_PROTECTION",
template: "cfr_doorhanger",
content: {
layout: "icon_and_message",
category: "cfrFeatures",
anchor_id: "tracking-protection-icon-box",
skip_address_bar_notifier: true,
bucket_id: "CFR_SOCIAL_TRACKING_PROTECTION",
heading_text: { string_id: "cfr-doorhanger-socialtracking-heading" },
notification_text: "",
info_icon: {
label: {
string_id: "cfr-doorhanger-extension-sumo-link",
},
sumo_path: "extensionrecommendations",
},
learn_more: "social-media-tracking-report",
text: { string_id: "cfr-doorhanger-socialtracking-description" },
icon: "chrome://browser/skin/notification-icons/block-social.svg",
icon_dark_theme:
"chrome://browser/skin/notification-icons/block-social-dark.svg",
buttons: {
primary: {
label: { string_id: "cfr-doorhanger-socialtracking-ok-button" },
action: { type: "OPEN_PROTECTION_PANEL" },
event: "PROTECTION",
},
secondary: [
{
label: { string_id: "cfr-doorhanger-socialtracking-close-button" },
event: "BLOCK",
},
],
},
},
targeting: "pageLoad >= 4",
frequency: {
lifetime: 2,
custom: [{ period: 2 * 86400 * 1000, cap: 1 }],
},
trigger: {
id: "trackingProtection",
params: [Ci.nsIWebProgressListener.STATE_BLOCKED_SOCIALTRACKING_CONTENT],
},
},
{
id: "FINGERPRINTERS_PROTECTION",
template: "cfr_doorhanger",
content: {
layout: "icon_and_message",
category: "cfrFeatures",
anchor_id: "tracking-protection-icon-box",
skip_address_bar_notifier: true,
bucket_id: "CFR_SOCIAL_TRACKING_PROTECTION",
heading_text: { string_id: "cfr-doorhanger-fingerprinters-heading" },
notification_text: "",
info_icon: {
label: {
string_id: "cfr-doorhanger-extension-sumo-link",
},
sumo_path: "extensionrecommendations",
},
learn_more: "fingerprinters-report",
text: { string_id: "cfr-doorhanger-fingerprinters-description" },
icon: "chrome://browser/skin/notification-icons/block-fingerprinter.svg",
icon_dark_theme:
"chrome://browser/skin/notification-icons/block-fingerprinter-dark.svg",
buttons: {
primary: {
label: { string_id: "cfr-doorhanger-socialtracking-ok-button" },
action: { type: "OPEN_PROTECTION_PANEL" },
event: "PROTECTION",
},
secondary: [
{
label: { string_id: "cfr-doorhanger-socialtracking-close-button" },
event: "BLOCK",
},
],
},
},
targeting: "pageLoad >= 4",
frequency: {
lifetime: 2,
custom: [{ period: 2 * 86400 * 1000, cap: 1 }],
},
trigger: {
id: "trackingProtection",
params: [Ci.nsIWebProgressListener.STATE_BLOCKED_FINGERPRINTING_CONTENT],
},
},
{
id: "CRYPTOMINERS_PROTECTION",
template: "cfr_doorhanger",
content: {
layout: "icon_and_message",
category: "cfrFeatures",
anchor_id: "tracking-protection-icon-box",
skip_address_bar_notifier: true,
bucket_id: "CFR_SOCIAL_TRACKING_PROTECTION",
heading_text: { string_id: "cfr-doorhanger-cryptominers-heading" },
notification_text: "",
info_icon: {
label: {
string_id: "cfr-doorhanger-extension-sumo-link",
},
sumo_path: "extensionrecommendations",
},
learn_more: "cryptominers-report",
text: { string_id: "cfr-doorhanger-cryptominers-description" },
icon: "chrome://browser/skin/notification-icons/block-cryptominer.svg",
icon_dark_theme:
"chrome://browser/skin/notification-icons/block-cryptominer-dark.svg",
buttons: {
primary: {
label: { string_id: "cfr-doorhanger-socialtracking-ok-button" },
action: { type: "OPEN_PROTECTION_PANEL" },
event: "PROTECTION",
},
secondary: [
{
label: { string_id: "cfr-doorhanger-socialtracking-close-button" },
event: "BLOCK",
},
],
},
},
targeting: "pageLoad >= 4",
frequency: {
lifetime: 2,
custom: [{ period: 2 * 86400 * 1000, cap: 1 }],
},
trigger: {
id: "trackingProtection",
params: [Ci.nsIWebProgressListener.STATE_BLOCKED_CRYPTOMINING_CONTENT],
},
},
];
const CFRMessageProvider = {

View File

@ -249,6 +249,10 @@ menupopup::part(drop-indicator) {
width: 343px;
}
#contextual-feature-recommendation-notification[data-notification-bucket="CFR_SOCIAL_TRACKING_PROTECTION"] {
width: 386px;
}
#contextual-feature-recommendation-notification .popup-notification-icon {
margin-inline-end: 4px;
}
@ -259,6 +263,7 @@ menupopup::part(drop-indicator) {
}
#contextual-feature-recommendation-notification .popup-notification-body-container {
width: 100%;
padding-bottom: 0;
}
@ -306,6 +311,10 @@ menupopup::part(drop-indicator) {
padding-bottom: 20px;
}
#contextual-feature-recommendation-notification[data-notification-bucket="CFR_SOCIAL_TRACKING_PROTECTION"] .popup-notification-description {
font-size: 13px;
}
#cfr-notification-feature-steps {
display: flex;
flex-direction: column;
@ -338,6 +347,7 @@ menupopup::part(drop-indicator) {
margin: 0;
}
#contextual-feature-recommendation-notification .popup-notification-learnmore-link,
#cfr-notification-footer-users,
#cfr-notification-footer-learn-more-link {
font-size: 12px;

View File

@ -95,6 +95,10 @@
skin/classic/browser/notification-icons/webauthn.svg (../shared/notification-icons/webauthn.svg)
skin/classic/browser/notification-icons/images.svg (../shared/notification-icons/images.svg)
skin/classic/browser/notification-icons/images-blocked.svg (../shared/notification-icons/images-blocked.svg)
skin/classic/browser/notification-icons/block-cryptominer-dark.svg (../shared/notification-icons/block-cryptominer-dark.svg)
skin/classic/browser/notification-icons/block-cryptominer.svg (../shared/notification-icons/block-cryptominer.svg)
skin/classic/browser/notification-icons/block-fingerprinter-dark.svg (../shared/notification-icons/block-fingerprinter-dark.svg)
skin/classic/browser/notification-icons/block-fingerprinter.svg (../shared/notification-icons/block-fingerprinter.svg)
skin/classic/browser/notification-icons/block-social-dark.svg (../shared/notification-icons/block-social-dark.svg)
skin/classic/browser/notification-icons/block-social.svg (../shared/notification-icons/block-social.svg)

View File

@ -0,0 +1,4 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path d="M.5.5h16v16H.5V.5zm12 16a4 4 0 1 0 0-8 4 4 0 0 0 0 8z" id="a"/><linearGradient x1="57.737%" y1="0%" x2="19.133%" y2="110.029%" id="c"><stop stop-color="#AB71FF" offset="0%"/><stop stop-color="#00B3F4" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd"><g transform="translate(-.5 -.5)"><mask id="b" fill="#fff"><use xlink:href="#a"/></mask><g mask="url(#b)" fill="url(#c)" fill-rule="nonzero"><path d="M13.5 2.5h-4V2a.5.5 0 0 0-.5-.5H8a.5.5 0 0 0-.5.5v.5h-2a2 2 0 0 0-1.6.8L2.7 4.9a1 1 0 0 0 .8 1.6h4V15a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5V6.5h4v-4z"/></g></g><path d="M12 14.188c-.364 0-.702-.098-1.005-.256l2.937-2.937c.158.303.255.64.255 1.005 0 1.208-.979 2.188-2.187 2.188m0-4.376c.364 0 .702.098 1.005.256l-2.937 2.937A2.163 2.163 0 0 1 9.813 12c0-1.208.979-2.188 2.187-2.188M12 8.5a3.5 3.5 0 1 0 0 7 3.5 3.5 0 0 0 0-7" fill="#ED1C24"/></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1,4 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path d="M.5.5h16v16H.5V.5zm12 16a4 4 0 1 0 0-8 4 4 0 0 0 0 8z" id="a"/><linearGradient x1="52.089%" y1="0%" x2="19.133%" y2="114.055%" id="c"><stop stop-color="#7542E5" offset="0%"/><stop stop-color="#0060DF" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd"><g transform="translate(-.5 -.5)"><mask id="b" fill="#fff"><use xlink:href="#a"/></mask><g mask="url(#b)" fill="url(#c)" fill-rule="nonzero"><path d="M13.5 2.5h-4V2a.5.5 0 0 0-.5-.5H8a.5.5 0 0 0-.5.5v.5h-2a2 2 0 0 0-1.6.8L2.7 4.9a1 1 0 0 0 .8 1.6h4V15a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5V6.5h4v-4z"/></g></g><path d="M12 14.188c-.364 0-.702-.098-1.005-.256l2.937-2.937c.158.303.255.64.255 1.005 0 1.208-.979 2.188-2.187 2.188m0-4.376c.364 0 .702.098 1.005.256l-2.937 2.937A2.163 2.163 0 0 1 9.813 12c0-1.208.979-2.188 2.187-2.188M12 8.5a3.5 3.5 0 1 0 0 7 3.5 3.5 0 0 0 0-7" fill="#ED1C24"/></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1,4 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path d="M.5.5h16v16H.5V.5zm12 8a4 4 0 1 0 0-8 4 4 0 0 0 0 8z" id="a"/><linearGradient x1="60.908%" y1="0%" x2="6.481%" y2="110.029%" id="c"><stop stop-color="#AB71FF" offset="0%"/><stop stop-color="#00B3F4" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd"><g transform="translate(-.5 -.5)"><mask id="b" fill="#fff"><use xlink:href="#a"/></mask><g mask="url(#b)" fill="url(#c)" fill-rule="nonzero"><path d="M8 1a7 7 0 0 1 7 7 10.18 10.18 0 0 1-1.37 5.21A3.91 3.91 0 0 0 13 15a1 1 0 0 1-2 0c.054-.965.35-1.9.86-2.72A8.24 8.24 0 0 0 13 8 5 5 0 0 0 3 8a1 1 0 1 1-2 0 7 7 0 0 1 7-7zm0 3a4 4 0 0 1 4 4 8.84 8.84 0 0 1-2.11 6.01 9.74 9.74 0 0 0-1 1.44A1 1 0 0 1 8 16a.93.93 0 0 1-.45-.11 1 1 0 0 1-.44-1.34 11 11 0 0 1 1.15-1.75A6.88 6.88 0 0 0 10 8a2 2 0 1 0-4 0 4 4 0 0 1-4 4 1 1 0 0 1 0-2 2 2 0 0 0 2-2 4 4 0 0 1 4-4zm0 3a1 1 0 0 1 1 1c0 5.66-6.41 7.86-6.68 8A1.25 1.25 0 0 1 2 16a1 1 0 0 1-.32-1.95C1.74 14 7 12.21 7 8a1 1 0 0 1 1-1z"/></g></g><path d="M12 6.188c-.364 0-.702-.098-1.005-.256l2.937-2.937c.158.303.255.64.255 1.005 0 1.208-.979 2.188-2.187 2.188m0-4.375c.364 0 .702.097 1.005.255l-2.937 2.937A2.163 2.163 0 0 1 9.813 4c0-1.208.979-2.188 2.187-2.188M12 .5a3.5 3.5 0 1 0 0 7 3.5 3.5 0 0 0 0-7" fill="#ED1C24"/></g></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1,4 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path d="M.5.5h16v16H.5V.5zm12 8a4 4 0 1 0 0-8 4 4 0 0 0 0 8z" id="a"/><linearGradient x1="52.946%" y1="0%" x2="6.481%" y2="114.055%" id="c"><stop stop-color="#7542E5" offset="0%"/><stop stop-color="#0060DF" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd"><g transform="translate(-.5 -.5)"><mask id="b" fill="#fff"><use xlink:href="#a"/></mask><g mask="url(#b)" fill="url(#c)" fill-rule="nonzero"><path d="M8 1a7 7 0 0 1 7 7 10.18 10.18 0 0 1-1.37 5.21A3.91 3.91 0 0 0 13 15a1 1 0 0 1-2 0c.054-.965.35-1.9.86-2.72A8.24 8.24 0 0 0 13 8 5 5 0 0 0 3 8a1 1 0 1 1-2 0 7 7 0 0 1 7-7zm0 3a4 4 0 0 1 4 4 8.84 8.84 0 0 1-2.11 6.01 9.74 9.74 0 0 0-1 1.44A1 1 0 0 1 8 16a.93.93 0 0 1-.45-.11 1 1 0 0 1-.44-1.34 11 11 0 0 1 1.15-1.75A6.88 6.88 0 0 0 10 8a2 2 0 1 0-4 0 4 4 0 0 1-4 4 1 1 0 0 1 0-2 2 2 0 0 0 2-2 4 4 0 0 1 4-4zm0 3a1 1 0 0 1 1 1c0 5.66-6.41 7.86-6.68 8A1.25 1.25 0 0 1 2 16a1 1 0 0 1-.32-1.95C1.74 14 7 12.21 7 8a1 1 0 0 1 1-1z"/></g></g><path d="M12 6.188c-.364 0-.702-.098-1.005-.256l2.937-2.937c.158.303.255.64.255 1.005 0 1.208-.979 2.188-2.187 2.188m0-4.375c.364 0 .702.097 1.005.255l-2.937 2.937A2.163 2.163 0 0 1 9.813 4c0-1.208.979-2.188 2.187-2.188M12 .5a3.5 3.5 0 1 0 0 7 3.5 3.5 0 0 0 0-7" fill="#ED1C24"/></g></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB