From 7d871c21708899a069e329442e4ae32e319861be Mon Sep 17 00:00:00 2001 From: Cezar Augusto Date: Mon, 8 Oct 2018 21:10:54 -0300 Subject: [PATCH 01/20] add support for image and font loading in webpack --- package-lock.json | 112 +++++++++++++++++++++++++++++++++++++++++ package.json | 2 + webpack/dev.config.js | 8 +++ webpack/prod.config.js | 8 +++ 4 files changed, 130 insertions(+) diff --git a/package-lock.json b/package-lock.json index d9f71a0..78a7fa2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -432,6 +432,12 @@ "uri-js": "^4.2.2" } }, + "ajv-errors": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/ajv-errors/-/ajv-errors-1.0.0.tgz", + "integrity": "sha1-7PAh+hCP0X37Xms4Py3SM+Mf/Fk=", + "dev": true + }, "ajv-keywords": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.2.0.tgz", @@ -4139,6 +4145,44 @@ "pend": "~1.2.0" } }, + "figures": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/figures/-/figures-2.0.0.tgz", + "integrity": "sha1-OrGi0qYsi/tDGgyUy3l6L84nyWI=", + "dev": true, + "requires": { + "escape-string-regexp": "^1.0.5" + } + }, + "file-loader": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-2.0.0.tgz", + "integrity": "sha512-YCsBfd1ZGCyonOKLxPiKPdu+8ld9HAaMEvJewzz+b2eTF7uL5Zm/HdBF6FjCrpCMRq25Mi0U1gl4pwn2TlH7hQ==", + "dev": true, + "requires": { + "loader-utils": "^1.0.2", + "schema-utils": "^1.0.0" + }, + "dependencies": { + "schema-utils": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz", + "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==", + "dev": true, + "requires": { + "ajv": "^6.1.0", + "ajv-errors": "^1.0.0", + "ajv-keywords": "^3.1.0" + } + } + } + }, + "filename-regex": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz", + "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=", + "dev": true + }, "fill-range": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz", @@ -9908,6 +9952,74 @@ } } }, + "url-join": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/url-join/-/url-join-4.0.0.tgz", + "integrity": "sha1-TTNA6AfTdzvamZH4MFrNzCpmXSo=", + "dev": true + }, + "url-loader": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/url-loader/-/url-loader-1.1.1.tgz", + "integrity": "sha512-vugEeXjyYFBCUOpX+ZuaunbK3QXMKaQ3zUnRfIpRBlGkY7QizCnzyyn2ASfcxsvyU3ef+CJppVywnl3Kgf13Gg==", + "dev": true, + "requires": { + "loader-utils": "^1.1.0", + "mime": "^2.0.3", + "schema-utils": "^1.0.0" + }, + "dependencies": { + "mime": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/mime/-/mime-2.3.1.tgz", + "integrity": "sha512-OEUllcVoydBHGN1z84yfQDimn58pZNNNXgZlHXSboxMlFvgI6MXSWpWKpFRra7H1HxpVhHTkrghfRW49k6yjeg==", + "dev": true + }, + "schema-utils": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz", + "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==", + "dev": true, + "requires": { + "ajv": "^6.1.0", + "ajv-errors": "^1.0.0", + "ajv-keywords": "^3.1.0" + } + } + } + }, + "url-parse-lax": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-3.0.0.tgz", + "integrity": "sha1-FrXK/Afb42dsGxmZF3gj1lA6yww=", + "dev": true, + "requires": { + "prepend-http": "^2.0.0" + }, + "dependencies": { + "prepend-http": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-2.0.0.tgz", + "integrity": "sha1-6SQ0v6XqjBn0HN/UAddBo8gZ2Jc=", + "dev": true + } + } + }, + "url-to-options": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/url-to-options/-/url-to-options-1.0.1.tgz", + "integrity": "sha1-FQWgOiiaSMvXpDTvuu7FBV9WM6k=", + "dev": true + }, + "use": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/use/-/use-3.1.0.tgz", + "integrity": "sha512-6UJEQM/L+mzC3ZJNM56Q4DFGLX/evKGRg15UJHGB9X5j5Z3AFbgZvjUh2yq/UJUY4U5dh7Fal++XbNg1uzpRAw==", + "dev": true, + "requires": { + "kind-of": "^6.0.2" + } + }, "use": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz", diff --git a/package.json b/package.json index 1134f42..26bdfd9 100644 --- a/package.json +++ b/package.json @@ -67,6 +67,7 @@ "css-loader": "^0.28.7", "css-modules-require-hook": "^4.2.2", "extract-text-webpack-plugin": "^3.0.2", + "file-loader": "^2.0.0", "ignore-styles": "^5.0.1", "jsdom": "^11.4.0", "minimist": "^1.2.0", @@ -84,6 +85,7 @@ "tslint-config-standard": "^7.0.0", "tslint-react": "^3.2.0", "typescript": "^2.8.1", + "url-loader": "^1.1.1", "webpack": "^4.16.1", "webpack-cli": "^3.1.2", "webpack-hot-middleware": "^2.22.3", diff --git a/webpack/dev.config.js b/webpack/dev.config.js index aeed4a5..676e471 100644 --- a/webpack/dev.config.js +++ b/webpack/dev.config.js @@ -68,6 +68,14 @@ const baseDevConfig = () => ({ 'css-loader?modules&sourceMap&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]', {loader: 'postcss-loader', options: postCSSConfig} ] + }, + { + test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, + loader: 'url-loader?limit=13000&minetype=application/font-woff' + }, + { + test: /\.(ttf|eot|svg|ico|png|jpg|jpeg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, + loader: 'file-loader' } ] } diff --git a/webpack/prod.config.js b/webpack/prod.config.js index 03af0a5..1548c39 100644 --- a/webpack/prod.config.js +++ b/webpack/prod.config.js @@ -61,6 +61,14 @@ module.exports = { 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]', { loader: 'postcss-loader', options: postCSSConfig } ] + }, + { + test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, + loader: 'url-loader?limit=13000&minetype=application/font-woff' + }, + { + test: /\.(ttf|eot|svg|ico|png|jpg|jpeg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, + loader: 'file-loader' }] } } From 03f93e6e2a28132723cd1615cab4b7f5f2fdc6e6 Mon Sep 17 00:00:00 2001 From: Cezar Augusto Date: Mon, 8 Oct 2018 21:31:31 -0300 Subject: [PATCH 02/20] update brave-ui to 0.30.x --- app/components/braveShields/braveShields.tsx | 15 +- .../braveShields/braveShieldsControls.tsx | 308 ++++++------ .../braveShields/braveShieldsFooter.tsx | 94 ++-- .../braveShields/braveShieldsHeader.tsx | 140 +++--- .../braveShields/braveShieldsStats.tsx | 384 +++++++-------- app/components/noScript/noScript.tsx | 128 ++--- package-lock.json | 215 ++++----- package.json | 2 +- .../braveShields/braveShieldsControlsTest.tsx | 420 ++++++++-------- .../braveShields/braveShieldsFooterTest.tsx | 116 ++--- .../braveShields/braveShieldsHeaderTest.tsx | 136 +++--- .../braveShields/braveShieldsStatsTest.tsx | 448 +++++++++--------- test/app/components/noScript/noScriptTest.tsx | 96 ++-- 13 files changed, 1225 insertions(+), 1277 deletions(-) diff --git a/app/components/braveShields/braveShields.tsx b/app/components/braveShields/braveShields.tsx index 33b9204..f22c3c5 100644 --- a/app/components/braveShields/braveShields.tsx +++ b/app/components/braveShields/braveShields.tsx @@ -3,10 +3,10 @@ * You can obtain one at http://mozilla.org/MPL/2.0/. */ import * as React from 'react' -import BraveShieldsHeader from './braveShieldsHeader' -import BraveShieldsStats from './braveShieldsStats' -import BraveShieldsControls from './braveShieldsControls' -import BraveShieldsFooter from './braveShieldsFooter' +// import BraveShieldsHeader from './braveShieldsHeader' +// import BraveShieldsStats from './braveShieldsStats' +// import BraveShieldsControls from './braveShieldsControls' +// import BraveShieldsFooter from './braveShieldsFooter' import * as shieldActions from '../../types/actions/shieldsPanelActions' import { Tab } from '../../types/state/shieldsPannelState' @@ -27,7 +27,7 @@ interface BraveShieldsProps { export default class BraveShields extends React.Component { render () { - const { shieldsPanelTabData, actions } = this.props + const { shieldsPanelTabData /*, actions */ } = this.props if (!shieldsPanelTabData) { return null @@ -35,7 +35,8 @@ export default class BraveShields extends React.Component return (
- allowScriptOriginsOnce={actions.allowScriptOriginsOnce} changeNoScriptSettings={actions.changeNoScriptSettings} /> - + */}
) } diff --git a/app/components/braveShields/braveShieldsControls.tsx b/app/components/braveShields/braveShieldsControls.tsx index 7306632..e9238de 100644 --- a/app/components/braveShields/braveShieldsControls.tsx +++ b/app/components/braveShields/braveShieldsControls.tsx @@ -1,169 +1,169 @@ -/* 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/. */ +// /* 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/. */ -import * as React from 'react' -import { Grid, Column } from 'brave-ui/gridSystem' -import SwitchButton from 'brave-ui/switchButton' -import SelectOption from 'brave-ui/selectOption' -import ContentToggleArrow from 'brave-ui/contentToggleArrow' -import BoxedContent from 'brave-ui/boxedContent' -import * as shieldActions from '../../types/actions/shieldsPanelActions' -import { BlockOptions, BlockFPOptions, BlockCookiesOptions } from '../../types/other/blockTypes' -import { getMessage } from '../../background/api/localeAPI' -import { NoScriptInfo } from '../../types/other/noScriptInfo' -import NoScript from '../noScript/noScript' -import theme from '../../theme' +// import * as React from 'react' +// import { Grid, Column } from 'brave-ui/gridSystem' +// import SwitchButton from 'brave-ui/switchButton' +// import SelectOption from 'brave-ui/selectOption' +// import ContentToggleArrow from 'brave-ui/contentToggleArrow' +// import BoxedContent from 'brave-ui/boxedContent' +// import * as shieldActions from '../../types/actions/shieldsPanelActions' +// import { BlockOptions, BlockFPOptions, BlockCookiesOptions } from '../../types/other/blockTypes' +// import { getMessage } from '../../background/api/localeAPI' +// import { NoScriptInfo } from '../../types/other/noScriptInfo' +// import NoScript from '../noScript/noScript' +// import theme from '../../theme' -export interface BraveShieldsControlsProps { - controlsOpen: boolean - braveShields: BlockOptions - httpUpgradableResources: BlockOptions - ads: BlockOptions - trackers: BlockOptions - javascript: BlockOptions - fingerprinting: BlockFPOptions - cookies: BlockCookiesOptions - blockAdsTrackers: shieldActions.BlockAdsTrackers - controlsToggled: shieldActions.ControlsToggled - httpsEverywhereToggled: shieldActions.HttpsEverywhereToggled - javascriptToggled: shieldActions.JavascriptToggled - blockFingerprinting: shieldActions.BlockFingerprinting - blockCookies: shieldActions.BlockCookies - noScriptInfo: NoScriptInfo - allowScriptOriginsOnce: shieldActions.AllowScriptOriginsOnce - changeNoScriptSettings: shieldActions.ChangeNoScriptSettings -} +// export interface BraveShieldsControlsProps { +// controlsOpen: boolean +// braveShields: BlockOptions +// httpUpgradableResources: BlockOptions +// ads: BlockOptions +// trackers: BlockOptions +// javascript: BlockOptions +// fingerprinting: BlockFPOptions +// cookies: BlockCookiesOptions +// blockAdsTrackers: shieldActions.BlockAdsTrackers +// controlsToggled: shieldActions.ControlsToggled +// httpsEverywhereToggled: shieldActions.HttpsEverywhereToggled +// javascriptToggled: shieldActions.JavascriptToggled +// blockFingerprinting: shieldActions.BlockFingerprinting +// blockCookies: shieldActions.BlockCookies +// noScriptInfo: NoScriptInfo +// allowScriptOriginsOnce: shieldActions.AllowScriptOriginsOnce +// changeNoScriptSettings: shieldActions.ChangeNoScriptSettings +// } -export default class BraveShieldsControls extends React.Component { - constructor (props: BraveShieldsControlsProps) { - super(props) - this.onChangeAdControl = this.onChangeAdControl.bind(this) - this.onToggleControls = this.onToggleControls.bind(this) - this.onToggleHTTPSEverywhere = this.onToggleHTTPSEverywhere.bind(this) - this.onToggleJavaScript = this.onToggleJavaScript.bind(this) - this.onChangeFingerprintingProtection = this.onChangeFingerprintingProtection.bind(this) - this.onChangeCookiesProtection = this.onChangeCookiesProtection.bind(this) - this.onAllowScriptOriginsOnce = this.onAllowScriptOriginsOnce.bind(this) - this.onChangeNoScriptSettings = this.onChangeNoScriptSettings.bind(this) - } +// export default class BraveShieldsControls extends React.Component { +// constructor (props: BraveShieldsControlsProps) { +// super(props) +// this.onChangeAdControl = this.onChangeAdControl.bind(this) +// this.onToggleControls = this.onToggleControls.bind(this) +// this.onToggleHTTPSEverywhere = this.onToggleHTTPSEverywhere.bind(this) +// this.onToggleJavaScript = this.onToggleJavaScript.bind(this) +// this.onChangeFingerprintingProtection = this.onChangeFingerprintingProtection.bind(this) +// this.onChangeCookiesProtection = this.onChangeCookiesProtection.bind(this) +// this.onAllowScriptOriginsOnce = this.onAllowScriptOriginsOnce.bind(this) +// this.onChangeNoScriptSettings = this.onChangeNoScriptSettings.bind(this) +// } - onChangeAdControl (e: HTMLSelectElement) { - this.props.blockAdsTrackers(e.target.value) - } +// onChangeAdControl (e: HTMLSelectElement) { +// this.props.blockAdsTrackers(e.target.value) +// } - onToggleControls () { - this.props.controlsToggled(!this.props.controlsOpen) - } +// onToggleControls () { +// this.props.controlsToggled(!this.props.controlsOpen) +// } - onToggleHTTPSEverywhere () { - this.props.httpsEverywhereToggled() - } +// onToggleHTTPSEverywhere () { +// this.props.httpsEverywhereToggled() +// } - onToggleJavaScript () { - this.props.javascriptToggled() - } +// onToggleJavaScript () { +// this.props.javascriptToggled() +// } - onChangeFingerprintingProtection (e: HTMLSelectElement) { - this.props.blockFingerprinting(e.target.value) - } +// onChangeFingerprintingProtection (e: HTMLSelectElement) { +// this.props.blockFingerprinting(e.target.value) +// } - onChangeCookiesProtection (e: HTMLSelectElement) { - this.props.blockCookies(e.target.value) - } +// onChangeCookiesProtection (e: HTMLSelectElement) { +// this.props.blockCookies(e.target.value) +// } - onAllowScriptOriginsOnce (origins: string[]) { - this.props.allowScriptOriginsOnce(origins) - } +// onAllowScriptOriginsOnce (origins: string[]) { +// this.props.allowScriptOriginsOnce(origins) +// } - onChangeNoScriptSettings (origin: string) { - this.props.changeNoScriptSettings(origin) - } +// onChangeNoScriptSettings (origin: string) { +// this.props.changeNoScriptSettings(origin) +// } - render () { - const { braveShields, ads, trackers, controlsOpen, httpUpgradableResources, javascript, fingerprinting, cookies, noScriptInfo } = this.props - return ( - - - - - - {/* TODO needs "show brave ads" */} - - - +// render () { +// const { braveShields, ads, trackers, controlsOpen, httpUpgradableResources, javascript, fingerprinting, cookies, noScriptInfo } = this.props +// return ( +// +// +// +// +// +// {/* TODO needs "show brave ads" */} +// +// +// - - - - - +// +// +// +// +// - - - - - +// +// +// +// +// - - - - - - - - -