Merge pull request #10001 from brave/about-favicons

don’t use data uris for about favicons

app/extensions.js

@@ -136,6 +136,9 @@ let generateBraveManifest = () => {
         ]
       }
     ],
+    web_accessible_resources: [
+      'img/favicon.ico'
+    ],
     permissions: [
       'externally_connectable.all_urls', 'tabs', '<all_urls>', 'contentSettings', 'idle'
     ],

app/extensions/brave/about-about.html

@@ -8,7 +8,7 @@
     <meta name="availableLanguages" content="">
     <meta name="defaultLanguage" content="en-US">
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon" type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="aboutPages"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-adblock.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#4B0082'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="adblockTitle"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-autofill.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#ff5000'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="autofillTitle"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-bookmarks.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#ff5000'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="bookmarkManager"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-brave.html

@@ -8,7 +8,7 @@
     <meta name="availableLanguages" content="">
     <meta name="defaultLanguage" content="en-US">
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="aboutBrave"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-contributions.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#ff5000'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="contributionStatement"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-downloads.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#000080'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="downloads"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-error.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#ff5000'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="error"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-extensions.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#565656'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="extensionsTitle"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-history.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#565656'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="historyTitle"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-passwords.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#ff5000'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="passwordsTitle"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-preferences.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#ff5000'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="preferences"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-styles.html

@@ -9,7 +9,7 @@
     <meta name="defaultLanguage" content="en-US">
     <meta name='theme-color' content='#4B0082'>
     <meta name="referrer" content="no-referrer">
-    <link rel="shortcut icon"type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon"type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="styleGuide"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/about-welcome.html

@@ -8,7 +8,7 @@
     <meta charset="utf-8">
     <meta name="availableLanguages" content="">
     <meta name="defaultLanguage" content="en-US">
-    <link rel="shortcut icon" type="image/x-icon" href="data:image/x-icon;,">
+    <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico">
     <title data-l10n-id="aboutWelcome"></title>
     <script src="ext/l20n.min.js"></script>
     <script src="gen/aboutPages.entry.js" async></script>

app/extensions/brave/index-dev.html

@@ -7,7 +7,7 @@
     <!-- TODO: Don't allow img-src *, needed for favicons -->
     <!-- TODO: Refactor away all unsafe-inline content -->
     <!-- TODO: Replace suggestqueries.google.com and ac.duckduckgo.com and other search engines with a single config search engine -->
-    <meta http-equiv="Content-Security-Policy" content="default-src 'none'; form-action http://localhost:*; script-src 'self' http://localhost:*; connect-src 'self' https://s3.amazonaws.com/adblock-data/ https://s3.amazonaws.com/safe-browsing-data/ https://s3.amazonaws.com/tracking-protection-data/ https://s3.amazonaws.com/https-everywhere-data/ http://localhost:* ws://localhost:* https://suggestqueries.google.com https://ac.duckduckgo.com https://completion.amazon.com https://search.yahoo.com https://api.bing.com https://www.startpage.com https://infogalactic.com https://api.qwant.com https://ac.ecosia.org https://searx.me https://brave-download.global.ssl.fastly.net https://brave-laptop-updates.global.ssl.fastly.net https://brave-download.global.ssl.fastly.net https://laptop-updates-pre.brave.com https://brave-laptop-updates-pre.brave.com; style-src 'unsafe-inline'; font-src 'self' http://localhost:*; img-src 'self' * data: file:; object-src 'self'; plugin-types application/browser-plugin">
+    <meta http-equiv="Content-Security-Policy" content="default-src 'none'; form-action http://localhost:*; script-src 'self' http://localhost:*; connect-src 'self' https://s3.amazonaws.com/adblock-data/ https://s3.amazonaws.com/safe-browsing-data/ https://s3.amazonaws.com/tracking-protection-data/ https://s3.amazonaws.com/https-everywhere-data/ http://localhost:* ws://localhost:* https://suggestqueries.google.com https://ac.duckduckgo.com https://completion.amazon.com https://search.yahoo.com https://api.bing.com https://www.startpage.com https://infogalactic.com https://api.qwant.com https://ac.ecosia.org https://searx.me https://brave-download.global.ssl.fastly.net https://brave-laptop-updates.global.ssl.fastly.net https://brave-download.global.ssl.fastly.net https://laptop-updates-pre.brave.com https://brave-laptop-updates-pre.brave.com; style-src 'unsafe-inline'; font-src 'self' http://localhost:*; img-src 'self' * data: file: chrome-extension:; object-src 'self'; plugin-types application/browser-plugin">
     <meta name="referrer" content="no-referrer">
     <title>Brave</title>
     <script src="ext/l20n.min.js"></script>

app/extensions/brave/index.html

@@ -7,7 +7,7 @@
     <!-- TODO: Don't allow img-src *, needed for favicons -->
     <!-- TODO: Refactor away all unsafe-inline content -->
     <!-- TODO: Replace suggestqueries.google.com and ac.duckduckgo.com and other search engines with a single config search engine -->
-    <meta http-equiv="Content-Security-Policy" content="default-src 'none'; form-action http://localhost:*; script-src 'self'; img-src * data: file:; style-src 'self' 'unsafe-inline'; font-src 'self'; connect-src 'self' https://s3.amazonaws.com/adblock-data/ https://s3.amazonaws.com/safe-browsing-data/ https://s3.amazonaws.com/tracking-protection-data/ https://s3.amazonaws.com/https-everywhere-data/ https://suggestqueries.google.com https://ac.duckduckgo.com https://completion.amazon.com https://search.yahoo.com https://api.bing.com https://www.startpage.com https://infogalactic.com https://api.qwant.com https://ac.ecosia.org https://searx.me https://brave-download.global.ssl.fastly.net https://brave-laptop-updates.global.ssl.fastly.net https://laptop-updates-pre.brave.com https://brave-laptop-updates-pre.brave.com; object-src 'self'; plugin-types application/browser-plugin"/>
+    <meta http-equiv="Content-Security-Policy" content="default-src 'none'; form-action http://localhost:*; script-src 'self'; img-src * data: file: chrome-extension:; style-src 'self' 'unsafe-inline'; font-src 'self'; connect-src 'self' https://s3.amazonaws.com/adblock-data/ https://s3.amazonaws.com/safe-browsing-data/ https://s3.amazonaws.com/tracking-protection-data/ https://s3.amazonaws.com/https-everywhere-data/ https://suggestqueries.google.com https://ac.duckduckgo.com https://completion.amazon.com https://search.yahoo.com https://api.bing.com https://www.startpage.com https://infogalactic.com https://api.qwant.com https://ac.ecosia.org https://searx.me https://brave-download.global.ssl.fastly.net https://brave-laptop-updates.global.ssl.fastly.net https://laptop-updates-pre.brave.com https://brave-laptop-updates-pre.brave.com; object-src 'self'; plugin-types application/browser-plugin"/>
     <meta name="referrer" content="no-referrer">
     <title>Brave</title>
     <script src="ext/l20n.min.js"></script>

js/about/entry.js

@@ -1,34 +1,3 @@
-var getFavicon = function () {
-  let favicon
-  const nodeList = document.getElementsByTagName('link')
-  for (var i = 0; i < nodeList.length; i++) {
-    if ((nodeList[i].getAttribute('rel') === 'icon') || (nodeList[i].getAttribute('rel') === 'shortcut icon')) {
-      favicon = nodeList[i].getAttribute('href')
-    }
-  }
-  return favicon
-}
-
-// set favicon as a data url because chrome-extension urls don't work correctly
-if (getFavicon()) {
-  let img = new window.Image()
-  img.onload = function () {
-    let canvas = document.createElement('CANVAS')
-    const ctx = canvas.getContext('2d')
-    canvas.height = this.height
-    canvas.width = this.width
-    ctx.drawImage(this, 0, 0)
-    const dataURL = canvas.toDataURL()
-    const docHead = document.getElementsByTagName('head')[0]
-    const newLink = document.createElement('link')
-    newLink.rel = 'shortcut icon'
-    newLink.href = dataURL
-    docHead.appendChild(newLink)
-    canvas = null
-  }
-  img.src = 'img/favicon.ico'
-}
-
 const ReactDOM = require('react-dom')
 const {getSourceAboutUrl, getBaseUrl} = require('../lib/appUrlUtil')
 const {ABOUT_COMPONENT_INITIALIZED} = require('../constants/messages')