Simplify opening the next queued link by using tabs.update().

Previously we would use messaging to open the next link with either
a loaded content script in the current tab or a new tab if the tab
can't load a content script. This makes it simpler and also has the
added benefit of no longer requiring the permission to access
all websites.

source/background-scripts/browser-action.ts

@@ -1,6 +1,7 @@
 import browser from 'webextension-polyfill';
 
 import {Settings} from '../settings/settings.js';
+import {updateBadge} from '../utilities/badge.js';
 
 let timeoutId: number | undefined;
 
@@ -9,7 +10,6 @@ export async function browserActionClicked(): Promise<void> {
 
   // When the extension icon is initially clicked, create a timeout for 500ms
   // that will open the next queue item when it expires.
-  // If the icon is clicked again in those 500ms, open the options page instead.
   if (timeoutId === undefined) {
     timeoutId = window.setTimeout(async () => {
       timeoutId = undefined;
@@ -21,27 +21,14 @@ export async function browserActionClicked(): Promise<void> {
         return;
       }
 
-      const tabs = await browser.tabs.query({
+      await browser.tabs.update({url: nextItem.url});
-        active: true,
-        currentWindow: true,
-      });
-
-      const message: Queue.Message<Queue.Item> = {
-        action: 'queue open url',
-        data: nextItem,
-      };
-
-      try {
-        await browser.tabs.sendMessage(tabs[0].id!, message);
-      } catch {
-        await browser.tabs.create({active: true, url: nextItem.url});
-      }
-
       await settings.removeQueueItem(nextItem.id);
+      await updateBadge(settings);
     }, 500);
     return;
   }
 
+  // If the icon is clicked again in those 500ms, open the options page instead.
   window.clearTimeout(timeoutId);
   timeoutId = undefined;
   await browser.runtime.openOptionsPage();

source/background-scripts/initialize.ts

@@ -1,7 +1,5 @@
 import browser from 'webextension-polyfill';
 
-import {Settings} from '../settings/settings.js';
-import {updateBadge} from '../utilities/badge.js';
 import {History} from '../utilities/history.js';
 import {browserActionClicked} from './browser-action.js';
 import {initializeContextMenus} from './context-menus.js';
@@ -19,13 +17,4 @@ browser.runtime.onInstalled.addListener(async () => {
   }
 });
 
-browser.runtime.onMessage.addListener(
-  async (request: Queue.Message<unknown>) => {
-    if (request.action === 'queue update badge') {
-      const settings = await Settings.fromSyncStorage();
-      await updateBadge(settings);
-    }
-  },
-);
-
 initializeContextMenus();

source/content-scripts/initialize.ts

@@ -1,8 +0,0 @@
-import {initializeMessaging, sendMessage} from '../utilities/messaging.js';
-
-async function initializeScripts() {
-  initializeMessaging();
-  await sendMessage('queue update badge');
-}
-
-void initializeScripts();

source/manifest.json

@@ -7,8 +7,7 @@
   "permissions": [
     "contextMenus",
     "storage",
-    "tabs",
+    "tabs"
-    "*://*/*"
   ],
   "content_security_policy": "script-src 'self'; object-src 'self'; style-src 'unsafe-inline'",
   "web_accessible_resources": [
@@ -31,17 +30,6 @@
       "background-scripts/initialize.ts"
     ]
   },
-  "content_scripts": [
-    {
-      "matches": [
-        "*://*/*"
-      ],
-      "run_at": "document_end",
-      "js": [
-        "content-scripts/initialize.ts"
-      ]
-    }
-  ],
   "applications": {
     "gecko": {
       "id": "{c3560e6b-00e5-4ab3-b89e-8a54ee5b2c9f}"

source/options/components/page-main.ts

@@ -1,7 +1,7 @@
 import {Component, html} from 'htm/preact';
-import browser from 'webextension-polyfill';
 
 import {Settings} from '../../settings/settings.js';
+import {updateBadge} from '../../utilities/badge.js';
 import {History} from '../../utilities/history.js';
 import {ConfirmButton} from './confirm-button.js';
 import {Link} from './link.js';
@@ -27,7 +27,7 @@ export class PageMain extends Component<Props, State> {
   removeItem = async (id: number) => {
     const {settings} = this.props;
     await settings.removeQueueItem(id);
-    await browser.runtime.sendMessage({action: 'queue update badge'});
+    await updateBadge(settings);
     this.setState({queue: this.props.settings.queue});
   };
 
@@ -77,10 +77,7 @@ export class PageMain extends Component<Props, State> {
 
           <p>Opening the next link from your queue:</p>
           <ul>
-            <li>
+            <li>Click on the extension icon to open it in the current tab.</li>
-              Click on the extension icon to open it in the current tab (when
-              possible).
-            </li>
             <li>
               Right-click the extension icon and click "Open next link in new
               tab".

source/options/index.ts

@@ -2,16 +2,14 @@ import {html} from 'htm/preact';
 import {Component, render} from 'preact';
 
 import {Settings} from '../settings/settings.js';
-import {initializeMessaging, sendMessage} from '../utilities/messaging.js';
+import {updateBadge} from '../utilities/badge.js';
 import {History} from '../utilities/history.js';
 import {PageFooter, PageHeader, PageMain} from './components/components.js';
 
 window.addEventListener('DOMContentLoaded', async () => {
-  initializeMessaging();
-  await sendMessage('queue update badge');
-
   const history = await History.fromLocalStorage();
   const settings = await Settings.fromSyncStorage();
+  await updateBadge(settings);
 
   render(
     html`<${OptionsPage} history=${history} settings=${settings} />`,

source/types.d.ts

@@ -24,12 +24,5 @@ declare global {
       text: string;
       url: string;
     };
-
-    type MessageAction = 'queue open url' | 'queue update badge';
-
-    type Message<T> = {
-      action: MessageAction;
-      data: T;
-    };
   }
 }

source/utilities/messaging.ts

@@ -1,17 +0,0 @@
-import browser from 'webextension-polyfill';
-
-export function initializeMessaging() {
-  browser.runtime.onMessage.addListener((request: Queue.Message<unknown>) => {
-    if (request.action === 'queue open url') {
-      const message = request as Queue.Message<Queue.Item>;
-      window.location.href = message.data.url;
-    }
-  });
-}
-
-export async function sendMessage<T>(
-  action: Queue.MessageAction,
-  data?: T,
-): Promise<void> {
-  await browser.runtime.sendMessage({action, data});
-}