@webext-core/messaging

A light-weight, type-safe wrapper around the browser.runtime messaging APIs. Supports all browsers (Chrome, Firefox, Safari).

// ./messaging.ts
import { ProtocolWithReturn, defineExtensionMessaging } from '@webext-core/messaging';

interface ProtocolMap {
  getStringLength: ProtocolWithReturn<string, number>;
}

export const { sendMessage, onMessage } = defineExtensionMessaging<ProtocolMap>();

// ./background.ts
import { onMessage } from './messaging';

onMessage('getStringLength', message => {
  return message.data.length;
});

// ./content-script.js or anywhere else
import { sendMessage } from './messaging';

const length = await sendMessage('getStringLength', 'hello world');

console.log(length); // 11

Get Started

See documentation to get started!