From 255303a956f94aa46a6192f94e13d3083a0a7841 Mon Sep 17 00:00:00 2001 From: "Brian R. Bondy" Date: Mon, 12 Sep 2016 17:34:13 -0400 Subject: [PATCH] Add a basic about:adblock placeholder Fix #3936 Auditors: @bridiver --- app/extensions/brave/about-adblock.html | 20 +++++++ .../brave/locales/en-US/adblock.properties | 5 ++ js/about/adblock.js | 56 +++++++++++++++++++ js/about/entry.js | 3 + js/components/frame.js | 4 ++ js/constants/messages.js | 1 + js/lib/appUrlUtil.js | 1 + less/about/adblock.less | 15 +++++ test/about/adblockTest.js | 27 +++++++++ 9 files changed, 132 insertions(+) create mode 100644 app/extensions/brave/about-adblock.html create mode 100644 app/extensions/brave/locales/en-US/adblock.properties create mode 100644 js/about/adblock.js create mode 100644 less/about/adblock.less create mode 100644 test/about/adblockTest.js diff --git a/app/extensions/brave/about-adblock.html b/app/extensions/brave/about-adblock.html new file mode 100644 index 00000000000..9265966e335 --- /dev/null +++ b/app/extensions/brave/about-adblock.html @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + +
+ + diff --git a/app/extensions/brave/locales/en-US/adblock.properties b/app/extensions/brave/locales/en-US/adblock.properties new file mode 100644 index 00000000000..38f00acd101 --- /dev/null +++ b/app/extensions/brave/locales/en-US/adblock.properties @@ -0,0 +1,5 @@ +adblockTitle=Ad Block +adblock=Ad Block +lastUpdateCheckDateLabel=Last update check: +lastCheckETagLabel=Last check ETag: +blockedCountLabel=Blocked count: diff --git a/js/about/adblock.js b/js/about/adblock.js new file mode 100644 index 00000000000..7e0abbb2066 --- /dev/null +++ b/js/about/adblock.js @@ -0,0 +1,56 @@ +/* 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/. */ + +// Note that these are webpack requires, not CommonJS node requiring requires +const React = require('react') +const Immutable = require('immutable') +const messages = require('../constants/messages') + +const ipc = window.chrome.ipc + +// Stylesheets +require('../../less/about/itemList.less') +require('../../less/about/adblock.less') + +class AboutAdBlock extends React.Component { + constructor () { + super() + this.state = { + adblock: Immutable.Map() + } + ipc.on(messages.ADBLOCK_UPDATED, (e, detail) => { + if (!detail) { + return + } + this.setState({ + adblock: Immutable.fromJS(detail.adblock) + }) + }) + } + render () { + const lastUpdateDate = new Date(this.state.adblock.get('lastCheckDate')) + return
+

+ +
+
+
{this.state.adblock.get('count') || 0}
+ { + Number.isNaN(lastUpdateDate.getTime()) + ? null + :
{lastUpdateDate.toLocaleDateString()}
+ } + { + this.state.adblock.get('etag') + ?
{this.state.adblock.get('etag')}
+ : null + } +
+
+ +

+ } +} + +module.exports = diff --git a/js/about/entry.js b/js/about/entry.js index 3ceec3e9304..4600c886c3d 100644 --- a/js/about/entry.js +++ b/js/about/entry.js @@ -21,6 +21,9 @@ switch (getBaseUrl(getSourceAboutUrl(window.location.href))) { case 'about:extensions': element = require('./extensions') break + case 'about:adblock': + element = require('./adblock') + break case 'about:downloads': element = require('./downloads') break diff --git a/js/components/frame.js b/js/components/frame.js index b307b266f34..3d6f7ea992c 100644 --- a/js/components/frame.js +++ b/js/components/frame.js @@ -96,6 +96,10 @@ class Frame extends ImmutableComponent { this.webview.send(messages.EXTENSIONS_UPDATED, { extensions: this.props.extensions.toJS() }) + } else if (location === 'about:adblock') { + this.webview.send(messages.ADBLOCK_UPDATED, { + adblock: this.props.adblock.toJS() + }) } else if (location === 'about:downloads') { this.webview.send(messages.DOWNLOADS_UPDATED, { downloads: this.props.downloads.toJS() diff --git a/js/constants/messages.js b/js/constants/messages.js index 26288006ed1..37c2fb405fb 100644 --- a/js/constants/messages.js +++ b/js/constants/messages.js @@ -114,6 +114,7 @@ const messages = { BOOKMARKS_UPDATED: _, HISTORY_UPDATED: _, EXTENSIONS_UPDATED: _, + ADBLOCK_UPDATED: _, DOWNLOADS_UPDATED: _, FLASH_UPDATED: _, // About pages from contentScript diff --git a/js/lib/appUrlUtil.js b/js/lib/appUrlUtil.js index c6d1dff552a..1157ffabecf 100644 --- a/js/lib/appUrlUtil.js +++ b/js/lib/appUrlUtil.js @@ -62,6 +62,7 @@ module.exports.aboutUrls = new Immutable.Map({ 'about:bookmarks': module.exports.getAppUrl('about-bookmarks.html'), 'about:downloads': module.exports.getAppUrl('about-downloads.html'), 'about:extensions': module.exports.getAppUrl('about-extensions.html'), + 'about:adblock': module.exports.getAppUrl('about-adblock.html'), 'about:newtab': module.exports.getAppUrl('about-newtab.html'), 'about:preferences': module.exports.getAppUrl('about-preferences.html'), 'about:config': module.exports.getAppUrl('about-config.html'), diff --git a/less/about/adblock.less b/less/about/adblock.less new file mode 100644 index 00000000000..3eca7b44411 --- /dev/null +++ b/less/about/adblock.less @@ -0,0 +1,15 @@ +@import "./itemList.less"; + +.adblockDetailsPage { + margin: 20px; + min-width: 704px; + + h2 { + margin-bottom: 10px; + } + + list .listItem { + display: flex; + -webkit-user-select: text; + } +} diff --git a/test/about/adblockTest.js b/test/about/adblockTest.js new file mode 100644 index 00000000000..d69c0b0f40f --- /dev/null +++ b/test/about/adblockTest.js @@ -0,0 +1,27 @@ +/* global describe, it, before */ + +const Brave = require('../lib/brave') +const {urlInput} = require('../lib/selectors') +const {getTargetAboutUrl} = require('../../js/lib/appUrlUtil') + +describe('about:adblock', function () { + Brave.beforeAll(this) + before(function * () { + const url = getTargetAboutUrl('about:adblock') + yield this.app.client + .waitUntilWindowLoaded() + .waitForUrl(Brave.newTabUrl) + .waitForBrowserWindow() + .waitForVisible('#window') + .waitForVisible(urlInput) + .windowByUrl(Brave.browserWindowUrl) + .waitForExist('.tab[data-frame-key="1"]') + .tabByIndex(0) + .url(url) + }) + + it('lists adblock count', function * () { + yield this.app.client + .getText('.blockedCountTotal').should.eventually.be.equal('0') + }) +})