Chrome Extension - How to Fix the "Active but Sleeping" Loop

To prevent the service worker from falling asleep while your user might need it, or to force a reconnection, you have two options:

Option A: The "Heartbeat" (Keep it awake)

If you want to prevent Chrome from putting your service worker to sleep in the first place, you can implement a heartbeat ping inside your background script to keep it alive indefinitely.

Inside your src-bex/background.js:

JavaScript


// A simple interval that forces the service worker to stay awake
setInterval(() => {
  console.log("Heartbeat: Keeping service worker alive...");
  // Accessing a chrome API periodically resets Chrome's 30-second idle timer
  chrome.runtime.getPlatformInfo(() => {});
}, 20000); // Pins every 20 seconds


Option B: Force Re-initialization on Popup Open

If you don't want to waste the user's system memory with a persistent heartbeat, you can tell your Quasar popup to force-reset the bridge connection every single time the popup is opened.

Inside your Quasar component (App.vue or your main popup layout):

JavaScript


import { onMounted } from 'vue'
import { useQuasar } from 'quasar'

export default {
  setup () {
    const $q = useQuasar()

    onMounted(() => {
      // If the bridge thinks it's connected but isn't responding, 
      // you can manually trigger Quasar's internal reconnect if needed,
      // or send a native message to kickstart the service worker listener.
      chrome.runtime.sendMessage({ type: 'PING_WAKEUP' }, (response) => {
        // This native event bypasses Quasar and wakes up the underlying Chrome channel
        console.log("Native wake-up call sent.")
      })
    })
  }
}