How to fix 'Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist.'

Question

I have the following error in the Chrome Dev Tools console on every page-load of my Node/Express/React application:

Unchecked runtime.lastError: Could not es

Answer 1

You just need to handle window.chrome.runtime.lastError in the runtime.sendMessage callback. It's as simple as that, nothing fancy. I had spent lots of time figuring it out before realizing that this error just needs to be handled. Below is my code:

window.chrome.runtime.sendMessage(
      EXTENSION_ID,
      { message:"---" }, // jsonable message
      (result) => {
        if (!window.chrome.runtime.lastError) {
          // do you work, that's it. No more unchecked error
        }
      }
    );
  });