Detecting Chrome Extension Installation in JavaScript

In building a Chrome extension, it might become necessary to determine whether the extension is installed from within an external JavaScript script. This aids in customizing web content based on the presence of the extension.

According to the Chrome documentation, it's possible to achieve this through message passing from the website to the extension.

Code Implementation

In the extension's background.js (or any other non-content script) file, add a message listener:

chrome.runtime.onMessageExternal.addListener(
  function(request, sender, sendResponse) {
    if (request) {
      if (request.message) {
        if (request.message == "version") {
          sendResponse({version: 1.0});
        }
      }
    }
    return true;
  }
);

This listener will receive messages from the website.

From the website's script, send a message to the extension's ID:

var hasExtension = false;

chrome.runtime.sendMessage(extensionId, { message: "version" },
  function (reply) {
    if (reply) {
      if (reply.version) {
        if (reply.version >= requiredVersion) {
          hasExtension = true;
        }
      }
    } else {
      hasExtension = false;
    }
  }
);

Check the hasExtension variable to determine if the extension is installed.

Manifest Configuration

Remember to add an entry to the manifest.json file, specifying the domains that are allowed to send messages to the extension:

"externally_connectable": {
  "matches": ["http://mylocalhostextensiontest/*", "http://*:*/*"]
},

Asynchronous Nature and Error Handling

Note that the message-passing mechanism is asynchronous, so you may need to handle this in your code.

Furthermore, if the extension is not installed or disabled, chrome.runtime.sendMessage will throw an exception. In such cases, check for chrome.runtime.lastError after sending the message:

if (chrome.runtime.lastError) {
  // Handle the error here...
}