GH-1621: Site-Specific Whitelisting for Unknown Trackers via Anti-Tracking

app/panel/components/Blocking.jsx

@@ -326,11 +326,11 @@ class Blocking extends React.Component {
 					smartBlockActive={smartBlockActive}
 					smartBlock={smartBlock}
 				/>
-				{(disableBlocking && is_expanded) ?
+				{(disableBlocking && is_expanded) ? (
 					<NotScanned />
-					:
+				) : (
 					<div className={`${blockingClasses} blocking-trackers show-warnings`}>
-						{ categories.length > 0 &&
+						{categories.length > 0 && (
 							<Categories
 								expandAll={expand_all_trackers}
 								categories={categories}
@@ -344,9 +344,9 @@ class Blocking extends React.Component {
 								antiTracking={antiTracking}
 								enable_anti_tracking={enable_anti_tracking}
 							/>
-						}
+						)}
 					</div>
-				}
+				)}
 			</div>
 		);
 	}

app/panel/components/Blocking/Category.jsx

@@ -232,8 +232,7 @@ class Category extends React.Component {
 										{ isDataPoint ? ' DATA POINTS' : (category.num_total === 1) ? t('blocking_category_tracker') : t('blocking_category_trackers') }
 									</span>
 								</div>
-								{
-									(!!trackersBlockedCount || isDataPoint) &&
+								{(!!trackersBlockedCount || isDataPoint) && (
 									<div className="blocked-count">
 										<span className="count">
 											{isDataPoint ? category.num_blocked : `${trackersBlockedCount} `}
@@ -242,14 +241,14 @@ class Category extends React.Component {
 											{isDataPoint ? ' ANONYMIZED' : t('blocking_category_blocked') }
 										</span>
 									</div>
-								}
+								)}
 							</div>
 						</div>
 						<div className="columns collapse-left collapse-right shrink align-self-justify">
 							<div className={caretClasses} onClick={this.toggleCategoryTrackers} />
 							{!isDataPoint && (
 								<div className={checkBoxStyle} onClick={this.clickCategoryStatus}>
-									<span className={this.props.index ? 't-tooltip-up-left' : 't-tooltip-down-left'} data-g-tooltip={t('panel_tracker_block_tooltip')} onMouseOver={this.showTooltip} onMouseOut={this.hideTooltip} >
+									<span className={this.props.index ? 't-tooltip-up-left' : 't-tooltip-down-left'} data-g-tooltip={t('panel_tracker_block_tooltip')} onMouseOver={this.showTooltip} onMouseOut={this.hideTooltip}>
 										<svg className="blocking-icons status t-tooltip-up-left" data-g-tooltip={t('panel_tracker_block_tooltip')} onClick={this.clickTrackerStatus} width="20px" height="20px" viewBox="0 0 20 20">
 											<g transform="translate(1 1)" fill="none" fillRule="evenodd">
 												<path className="border" d="M-.5-.5h18.3v18.217H-.5z" />
@@ -292,8 +291,7 @@ class Category extends React.Component {
 						</div>
 					</div>
 				</div>
-				{
-					this.state.isExpanded &&
+				{this.state.isExpanded && (
 					<Trackers
 						globalBlocking={globalBlocking}
 						trackers={category.trackers}
@@ -308,7 +306,7 @@ class Category extends React.Component {
 						smartBlock={this.props.smartBlock}
 						isDataPoint={isDataPoint}
 					/>
-				}
+				)}
 			</div>
 		);
 	}

src/background.js

@@ -49,7 +49,7 @@ import * as common from './utils/common';
 import * as utils from './utils/utils';
 import { _getJSONAPIErrorsObject } from './utils/api';
 import { importCliqzSettings } from './utils/cliqzSettingImport';
-import { sendCliqzModulesData } from './utils/cliqzModulesData';
+import { sendCliqzModuleCounts } from './utils/cliqzModulesData';
 
 // For debug purposes, provide Access to the internals of `browser-core`
 // module from Developer Tools Console.
@@ -825,8 +825,8 @@ function onMessageHandler(request, sender, callback) {
 		metrics.ping('hist_reset_stats');
 		insights.action('clearData');
 		return false;
-	} else if (name === 'setPanelData') {
-		console.log('SET PANEL DATA IS CALLED', message);
+	}
+	if (name === 'setPanelData') {
 		panelData.set(message);
 		callback();
 		return false;
@@ -841,12 +841,12 @@ function onMessageHandler(request, sender, callback) {
 		callback();
 		return false;
 	}
-	if (name === 'getCliqzModuleData') {
+	if (name === 'getCliqzModuleData') { // panel-android only
 		if (message && message.tabId) {
-			sendCliqzModulesData(message.tabId, callback);
+			sendCliqzModuleCounts(message.tabId, callback);
 		} else {
 			utils.getActiveTab((tab) => {
-				sendCliqzModulesData(tab.id, callback);
+				sendCliqzModuleCounts(tab.id, callback);
 			});
 		}
 		return true;

src/classes/BrowserButton.js

@@ -17,7 +17,7 @@ import conf from './Conf';
 import foundBugs from './FoundBugs';
 import rewards from './Rewards';
 import Policy from './Policy';
-import { getCliqzAntitrackingData, getCliqzAdblockingData } from '../utils/cliqzModulesData';
+import { getCliqzAntiTrackingCount, getCliqzAdBlockingCount } from '../utils/cliqzModulesData';
 import { getTab } from '../utils/utils';
 import { log } from '../utils/common';
 import globals from './Globals';
@@ -144,20 +144,19 @@ class BrowserButton {
 			return;
 		}
 
-		getCliqzAntitrackingData(tabId).then((antitrackingData) => {
-			const { appsCount, appsAlertCount } = this._getTrackerCount(tabId);
-			const adBlockingCount = getCliqzAdblockingData(tabId).totalCount;
+		const { appsCount, appsAlertCount } = this._getTrackerCount(tabId);
+		const adBlockingCount = getCliqzAdBlockingCount(tabId).totalCount;
+		const antiTrackingCount = getCliqzAntiTrackingCount(tabId).totalUnsafeCount;
 
-			alert = (appsAlertCount > 0);
-			trackerCount = (appsCount + antitrackingData.totalUnsafeCount + adBlockingCount).toString();
+		alert = (appsAlertCount > 0);
+		trackerCount = (appsCount + antiTrackingCount + adBlockingCount).toString();
 
-			// gray-out the icon when blocking has been disabled for whatever reason
-			if (trackerCount === '') {
-				this._setIcon(false, tabId, trackerCount, alert);
-			} else {
-				this._setIcon(!globals.SESSION.paused_blocking && !this.policy.whitelisted(tab.url), tabId, trackerCount, alert);
-			}
-		});
+		// gray-out the icon when blocking has been disabled for whatever reason
+		if (trackerCount === '') {
+			this._setIcon(false, tabId, trackerCount, alert);
+		} else {
+			this._setIcon(!globals.SESSION.paused_blocking && !this.policy.whitelisted(tab.url), tabId, trackerCount, alert);
+		}
 	}
 
 	/**

src/classes/PanelData.js

@@ -26,7 +26,7 @@ import tabInfo from './TabInfo';
 import rewards from './Rewards';
 import account from './Account';
 import dispatcher from './Dispatcher';
-import { getCliqzGhosteryStats, sendCliqzModulesData } from '../utils/cliqzModulesData';
+import { getCliqzGhosteryBugs, sendCliqzModuleCounts } from '../utils/cliqzModulesData';
 import { getActiveTab, flushChromeMemoryCache, processUrl } from '../utils/utils';
 import { objectEntries, log } from '../utils/common';
 
@@ -206,7 +206,7 @@ class PanelData {
 	}
 
 	/**
-	 * Wrapper helper passed as callback to utils/cliqzModuleData#sendCliqzModulesData
+	 * Wrapper helper passed as callback to utils/cliqzModuleData#sendCliqzModuleCounts
 	 */
 	postMessageToSummary = ((message) => {
 		this._postMessage('summary', message);
@@ -545,12 +545,12 @@ class PanelData {
 	}
 
 	/**
-	 * Retrieves antitracking and adblock Cliqz data and sends it to the panel
+	 * Retrieves antitracking and adblock counts and sends it to the panel
 	 */
 	_postCliqzModulesData() {
 		if (!this._panelPort || !this._activeTab) { return; }
 
-		sendCliqzModulesData(this._activeTab.id, this.postMessageToSummary);
+		sendCliqzModuleCounts(this._activeTab.id, this.postMessageToSummary);
 	}
 
 	/**
@@ -832,23 +832,23 @@ class PanelData {
 
 		this._trackerList = foundBugs.getApps(id, false, url) || [];
 
-		const ghosteryStats = getCliqzGhosteryStats(id);
+		const ghosteryBugs = getCliqzGhosteryBugs(id);
 
-		if (ghosteryStats && ghosteryStats.bugs) {
-			const gsBugs = ghosteryStats.bugs;
-			const bugsIds = Object.keys(gsBugs);
+		if (ghosteryBugs && ghosteryBugs.bugs) {
+			const { bugs } = ghosteryBugs;
+			const bugIds = Object.keys(bugs);
 			const appsById = foundBugs.getAppsById(id);
 
-			bugsIds.forEach((bugsId) => {
+			bugIds.forEach((bugsId) => {
 				const trackerId = conf.bugs.bugs[bugsId];
 				if (!trackerId) return;
 
 				const trackerListIndex = appsById[trackerId.aid];
 				if (!trackerListIndex) return;
 
-				this._trackerList[trackerListIndex].cliqzCookieCount = gsBugs[bugsId].cookies;
-				this._trackerList[trackerListIndex].cliqzFingerprintCount = gsBugs[bugsId].fingerprints;
-				this._trackerList[trackerListIndex].cliqzAdCount = gsBugs[bugsId].ads;
+				this._trackerList[trackerListIndex].cliqzCookieCount = bugs[bugsId].cookies;
+				this._trackerList[trackerListIndex].cliqzFingerprintCount = bugs[bugsId].fingerprints;
+				this._trackerList[trackerListIndex].cliqzAdCount = bugs[bugsId].ads;
 			});
 		}
 

src/utils/cliqzModulesData.js

@@ -12,99 +12,84 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0
  */
 
+import { extend } from 'underscore';
 import conf from '../classes/Conf';
 import cliqz from '../classes/Cliqz';
 
 const { adblocker, antitracking } = cliqz.modules;
 
-export function getCliqzAntitrackingData(tabId) {
-	return new Promise((resolve) => {
-		if (!conf.enable_anti_tracking || !antitracking.background) {
-			resolve({
-				totalUnsafeCount: 0
-			});
-		}
+/**
+ * Get the totalUnsafeCount of trackers found by Anti-Tracking on this tabId
+ * @param  {int} 	tabId
+ * @return {object}	totalUnsafeCount
+ */
+export function getCliqzAntiTrackingCount(tabId) {
+	let count = 0;
+	if (!conf.enable_anti_tracking || !antitracking.background) {
+		return {
+			totalUnsafeCount: count
+		};
+	}
 
-		antitracking.background.actions.aggregatedBlockingStats(tabId).then((antitrackingData) => {
-			let totalUnsafeCount = 0;
-			for (const category in antitrackingData) {
-				if (antitrackingData.hasOwnProperty(category)) {
-					for (const app in antitrackingData[category]) {
-						if (antitrackingData[category][app] === 'unsafe') {
-							totalUnsafeCount++;
-						}
-					}
-				}
-			}
-			antitrackingData.totalUnsafeCount = totalUnsafeCount;
-			console.log('PASSING ANTITRACKING DATA', conf.anti_tracking_whitelist);
-			antitrackingData.whitelistedUrls = conf.anti_tracking_whitelist;
-			resolve(antitrackingData);
-		}).catch(() => {
-			resolve({
-				totalUnsafeCount: 0,
-				whitelistedUrls: conf.anti_tracking_whitelist
-			});
-		});
-	});
+	// Count up number of fingerprints and cookies found
+	const { bugs, others } = antitracking.background.actions.getGhosteryStats(tabId);
+	const allStats = Object.assign({}, bugs, others);
+	const values = Object.values(allStats);
+
+	for (const val of values) {
+		count += val.cookies + val.fingerprints;
+	}
+
+	return {
+		totalUnsafeCount: count
+	};
 }
 
-export function getCliqzAdblockingData(tabId) {
+/**
+ * Get the totalCount of ads found by the Ad Blocker on this tabId
+ * @param  {int} 	tabId
+ * @return {object}
+ */
+export function getCliqzAdBlockingCount(tabId) {
 	if (!conf.enable_ad_block || !adblocker.background) {
 		return {
 			totalCount: 0
 		};
 	}
 
-	const adBlocking = adblocker.background.actions.getAdBlockInfoForTab(tabId);
-	return adBlocking || { totalCount: 0 };
+	const adBlockInfo = adblocker.background.actions.getAdBlockInfoForTab(tabId);
+	return {
+		totalCount: adBlockInfo.totalCount || 0,
+	};
 }
 
 /**
- * TODO: Add a test that verifies the following structure so that we automatically know if Cliqz changes it and we need to updated it
- 	The returned object has the following structure:
-	{
-		bugs: {
-			4147: { cookies: 3, fingerprints: 4, ads: 0 },
-			another_bug_id: { cookies: 2, .....
-			....
-		},
-		others: {
-			CloudFlare: {
-				ads: 0,
-				cat: "cdn",
-				cookies: 3,
-				domains: ["cdnjs.cloudlare.com", ...],
-				fingerprints: 4,
-				name: "CloudFlare",
-				wtm: "cloudflare",
-			},
-			...
-		}
-	}
+ * Get list of matched bug_ids from Anti-Tracking and Ad-Blocking for this
+ * tab, along with list of 'other' trackers found that do not match known bug_ids.
+ * @param  {int} 	tabId
+ * @return {object}
  */
-export function getCliqzGhosteryStats(tabId) {
-	if (!conf.enable_anti_tracking) {
-		return {
-			bugs: {},
-			others: {},
-		};
-	}
+export function getCliqzGhosteryBugs(tabId) {
+	// Merge Ad-Block stats into Anti-Track Stats
+	const antiTrackingStats = (conf.enable_anti_tracking) ? antitracking.background.actions.getGhosteryStats(tabId) : { bugs: {}, others: {} };
+	const adBlockingStats = (conf.enable_ad_block) ? adblocker.background.actions.getGhosteryStats(tabId) : { bugs: {}, others: {} };
 
-	const ghosteryStats = antitracking.background.actions.getGhosteryStats(tabId);
-	return ghosteryStats;
+	return {
+		bugs: extend({}, antiTrackingStats.bugs, adBlockingStats.bugs),
+		others: extend({}, antiTrackingStats.others, adBlockingStats.others),
+	};
 }
 
-export function sendCliqzModulesData(tabId, callback) {
+/**
+ * Send `totalCount` of ads found by Ad Blocker and `totalUnsafeCount`
+ * found by Anti-Tracking
+ * @param  {int}   		tabId
+ * @param  {Function} 	callback
+ */
+export function sendCliqzModuleCounts(tabId, callback) {
 	const modules = { adblock: {}, antitracking: {} };
 
-	modules.adblock = getCliqzAdblockingData(tabId);
-
-	// TODO convert to use finally to avoid duplication (does our Babel transpile it?)
-	getCliqzAntitrackingData(tabId).then((antitrackingData) => {
-		modules.antitracking = antitrackingData;
-		callback(modules);
-	}).catch(() => {
-		callback(modules);
-	});
+	modules.adblock = getCliqzAdBlockingCount(tabId);
+	modules.antitracking = getCliqzAntiTrackingCount(tabId);
+	callback(modules);
 }