DecoExt is our open-source library for implementing SOLID principles in browser extension projects — TypeScript decorators for modules, services, lifecycle and messaging, published on npm under the MIT license

why it exists

Browser extension code spreads across contexts — background, content scripts, popup, options — and the browser APIs it talks to are event-driven callbacks. Left alone, that turns into listener registration scattered through a codebase, with no obvious place for the logic behind each event to live

DecoExt grew out of the decorator toolkit we built for our own extensions: services with dependency injection, lifecycle hooks like install and tab events, cron jobs, and message-handler parameter decorators. It stopped being specific to us, so we published it

install

npm install deco-ext
npm install vite-plugin-swc-transform --save-dev

The decorators are the API, so the build needs to be able to compile them — which is what the SWC transform is for

what it looks like

A service declares itself injectable, and a method declares which browser event it answers. The parameter decorators pull the piece of the event payload the method actually needs:

import { InjectableService, historyItem, onHistoryVisited } from 'deco-ext'

@InjectableService()
class MyHistoryService {
  @onHistoryVisited()
  logPageVisits(@historyItem('url') url: string) {
    console.log(`User visited: ${url}`)
  }
}

undead-voron.github.io/DecoExt

The same pattern covers the rest of the extension surface:

alarms
bookmarks
commands
downloads
idle
management
messaging
omnibox
permissions
runtime
sessions
storage
tabs
webNavigation
windows

where it sits

DecoExt is the top of a stack we built downwards over several years. Underneath it is the messaging layer — our webext-bridge wrapper, which exists because sending an object between extension contexts is not the same operation in every browser

DecoExtdecorators
webext-bridge wrappermessaging
browser APIsnot ours

DecoExt is what that plumbing looks like once you stop wiring it by hand: decorate the method, and the library registers the listener, resolves the service and unpacks the payload

It is used in our own extension projects, including client work we cannot name

where it stands

Published on npm under the MIT license, with documentation and source linked above. It targets Manifest V3 and still supports Manifest V2