Tools for Building Browser Extensions with Deno. Supports Chromium and Firefox browsers.
- examples/preact_app is our canonical usage example
- Bext powers Favioli
- [if you make an app, lmk and I can add it here!]
Bundler:
> deno install --name=bext --allow-read --allow-write --allow-run --allow-env https://deno.land/x/bext/main.ts
> cd ./my_project
> bext # both
> bext chrome # only chrome
> bext firefox # only ff
> bext --watch # build again on change
> bext chrome -w # variations can be used for single-platform
> bext firefox --watch
Types and Cross-Platform API Handling:
// Import the direct npm:@types/chrome import used to define browserAPI in Bext
// Alternatively, `import { Tab, TabChangeInfo } from npm:@types/chrome`
import type Chrome from 'https://deno.land/x/bext/types/chrome.ts';
/**
* browserAPI resolves to:
* - globalThis.chrome in Chromium browsers
* - globalThis.browser in Firefox browsers
* - Bext's mock_browser in Deno context (for unit testing)
*/
import browserAPI from 'https://deno.land/x/bext/mod.ts';
browserAPI.tabs.onUpdated.addListener(
(tabId: number, _: Chrome.TabChangeInfo, tab: Chrome.Tab) => {
// do stuff
},
);
Tasks are defined in deno.json, but basically:
deno task dev
: Run the example app in watch-modedeno task test
: Makes sure it all works. Use this before committing!- runs fmt, lint, type-checks, unit tests for source and example apps
- builds example apps using local bext copy