Show a distinct toolbar icon until filtering engines are fully initialized

Related discussion:
- https://github.com/uBlockOrigin/uAssets/discussions/16939

Until uBO's filtering engines are properly initialized, there will
be a distinct toolbar icon to help users understand that uBO may
not be fully initialized when a webpage is loaded -- often the
cause of improper filtering of trackers/ads at browser launch.

platform/common/vapi-background.js

@@ -808,6 +808,16 @@ if ( webext.browserAction instanceof Object ) {
             vAPI.contextMenu.onMustUpdate(tabId);
         }
     };
+
+    vAPI.setDefaultIcon = function(flavor) {
+        if ( browserAction.setIcon === undefined ) { return; }
+        browserAction.setIcon({
+            path: {
+                '16': `img/icon_16${flavor}.png`,
+                '32': `img/icon_32${flavor}.png`,
+            }
+        });
+    };
 }
 
 browser.browserAction.onClicked.addListener(function(tab) {

src/js/start.js

@@ -29,6 +29,10 @@ import './vapi-common.js';
 import './vapi-background.js';
 import './vapi-background-ext.js';
 
+vAPI.setDefaultIcon('-loading'); // Do this as soon as possible
+
+/******************************************************************************/
+
 // The following modules are loaded here until their content is better organized
 import './commands.js';
 import './messaging.js';
@@ -67,7 +71,7 @@ import {
 
 /******************************************************************************/
 
-vAPI.app.onShutdown = function() {
+vAPI.app.onShutdown = ( ) => {
     staticFilteringReverseLookup.shutdown();
     io.updateStop();
     staticNetFilteringEngine.reset();
@@ -90,7 +94,7 @@ vAPI.app.onShutdown = function() {
 // https://bugzilla.mozilla.org/show_bug.cgi?id=1652925#c19
 //   Mind discarded tabs.
 
-const initializeTabs = async function() {
+const initializeTabs = async ( ) => {
     const manifest = browser.runtime.getManifest();
     if ( manifest instanceof Object === false ) { return; }
 
@@ -140,7 +144,7 @@ const initializeTabs = async function() {
 // https://www.reddit.com/r/uBlockOrigin/comments/s7c9go/
 //   Abort suspending network requests when uBO is merely being installed.
 
-const onVersionReady = function(lastVersion) {
+const onVersionReady = lastVersion => {
     if ( lastVersion === vAPI.app.version ) { return; }
 
     vAPI.storage.set({ version: vAPI.app.version });
@@ -179,7 +183,7 @@ const onVersionReady = function(lastVersion) {
 // https://github.com/uBlockOrigin/uBlock-issues/issues/1433
 //   Allow admins to add their own trusted-site directives.
 
-const onNetWhitelistReady = function(netWhitelistRaw, adminExtra) {
+const onNetWhitelistReady = (netWhitelistRaw, adminExtra) => {
     if ( typeof netWhitelistRaw === 'string' ) {
         netWhitelistRaw = netWhitelistRaw.split('\n');
     }
@@ -201,7 +205,7 @@ const onNetWhitelistReady = function(netWhitelistRaw, adminExtra) {
 
 // User settings are in memory
 
-const onUserSettingsReady = function(fetched) {
+const onUserSettingsReady = fetched => {
     // Terminate suspended state?
     const tnow = Date.now() - vAPI.T0;
     if (
@@ -271,7 +275,7 @@ const onUserSettingsReady = function(fetched) {
 // https://github.com/uBlockOrigin/uBlock-issues/issues/1365
 //   Wait for removal of invalid cached data to be completed.
 
-const onCacheSettingsReady = async function(fetched) {
+const onCacheSettingsReady = async fetched => {
     if ( fetched.compiledMagic !== µb.systemSettings.compiledMagic ) {
         µb.compiledFormatChanged = true;
         µb.selfieIsInvalid = true;
@@ -289,7 +293,7 @@ const onCacheSettingsReady = async function(fetched) {
 
 /******************************************************************************/
 
-const onHiddenSettingsReady = async function() {
+const onHiddenSettingsReady = async ( ) => {
     // Maybe customize webext flavor
     if ( µb.hiddenSettings.modifyWebextFlavor !== 'unset' ) {
         const tokens = µb.hiddenSettings.modifyWebextFlavor.split(/\s+/);
@@ -333,7 +337,7 @@ const onHiddenSettingsReady = async function() {
 
 /******************************************************************************/
 
-const onFirstFetchReady = function(fetched, adminExtra) {
+const onFirstFetchReady = (fetched, adminExtra) => {
     // https://github.com/uBlockOrigin/uBlock-issues/issues/507
     //   Firefox-specific: somehow `fetched` is undefined under certain
     //   circumstances even though we asked to load with default values.
@@ -358,14 +362,14 @@ const onFirstFetchReady = function(fetched, adminExtra) {
 
 /******************************************************************************/
 
-const toFetch = function(from, fetched) {
+const toFetch = (from, fetched) => {
     for ( const k in from ) {
         if ( from.hasOwnProperty(k) === false ) { continue; }
         fetched[k] = from[k];
     }
 };
 
-const fromFetch = function(to, fetched) {
+const fromFetch = (to, fetched) => {
     for ( const k in to ) {
         if ( to.hasOwnProperty(k) === false ) { continue; }
         if ( fetched.hasOwnProperty(k) === false ) { continue; }
@@ -373,7 +377,7 @@ const fromFetch = function(to, fetched) {
     }
 };
 
-const createDefaultProps = function() {
+const createDefaultProps = ( ) => {
     const fetchableProps = {
         'dynamicFilteringString': µb.dynamicFilteringDefault.join('\n'),
         'urlFilteringString': '',
@@ -469,6 +473,8 @@ if ( selfieIsValid !== true ) {
 //   This can be used to defer filtering decision-making.
 µb.readyToFilter = true;
 
+vAPI.setDefaultIcon('');
+
 // Start network observers.
 webRequest.start();
 

src/js/tab.js

@@ -1119,6 +1119,7 @@ vAPI.tabs = new vAPI.Tabs();
     //        bit 3 = hide badge
 
     µb.updateToolbarIcon = function(tabId, newParts = 0b0111) {
+        if ( this.readyToFilter === false ) { return; }
         if ( typeof tabId !== 'number' ) { return; }
         if ( vAPI.isBehindTheSceneTabId(tabId) ) { return; }
         const currentParts = tabIdToDetails.get(tabId);