1. Get the source
Clone the repository with Git, or download and extract the ZIP from GitHub. Keep the directory intact: the manifest, workspace, shared modules, and bundled DBOPFS runtime use relative paths inside extension/.
git clone https://github.com/TheWizardNexus/DBOPFS-Studio.git
2. Load the extension
- Open extension management.Use your browser's internal extensions page from the table below.
- Enable Developer mode.The switch is usually at the top-right or in the extensions-page navigation.
- Choose Load unpacked.Select
DBOPFS-Studio/extension/—the folder containingmanifest.json, not the repository root. - Choose an entry path.Pin DBOPFS Studio to open it from the toolbar, or open DevTools and use the DBOPFS Studio panel to launch a dedicated Studio window for the inspected page.
| Browser | Open this address | Support target |
|---|---|---|
| Google Chrome | chrome://extensions | First-class |
| Microsoft Edge | edge://extensions | First-class |
| Brave | brave://extensions | Compatible Chromium |
| Vivaldi | vivaldi://extensions | Compatible Chromium |
| Opera | opera://extensions | Compatible Chromium |
Internal browser addresses are not web links. Copy or type the appropriate address into the browser's address bar.
3. Connect an origin
Open the website whose storage you intend to inspect. The website must itself have access to OPFS—normally that means HTTPS or localhost. Use the toolbar popup to open Studio in a browser tab, or open that page’s DevTools, select the DBOPFS Studio panel, and choose Open Studio window.
The browser grants the extension access to HTTP(S) pages when you install or approve it. A dormant isolated content-script bridge is available on those pages; the Studio sends DBOPFS requests only to the tab you select. On first request, that bridge imports the packaged agent in the same isolated world. Browser storage accessed from a content script remains scoped to the host page's origin, so OPFS resolves to the inspected website rather than the extension.
Check the origin before editing. Protocol, hostname, and port identify the OPFS boundary. https://app.example and https://admin.example do not share one OPFS root.
PDFs and printing
When you open a PDF record from a displayed DBOPFS table, DBOPFS Studio hands it to the Chromium browser's native PDF surface. Viewing and printing do not require a bundled PDF library. Annotation, form, save, and editing controls vary by browser and version, so the Studio reports the document to the browser instead of promising identical PDF tools everywhere.
The Studio print surface supports text, JSON, Markdown, and image records. Audio and video records can be previewed and opened in the browser, but the Studio intentionally reports that they do not have a printable preview.
Update an unpacked install
Pull or download the latest source, then return to the extensions page and choose the reload action on the DBOPFS Studio card. Reload any already-open Studio or inspected-site tabs so every context uses the same version.
git -C DBOPFS-Studio pull --ff-only origin main
Troubleshooting
The site cannot connect
Confirm that the active page is a normal HTTPS or localhost page, that Studio targets that exact tab, and that browser policy permits extensions and content scripts. Built-in browser pages, extension pages, the browser store, and other protected URLs do not allow the isolated bridge.
No files appear
The current origin may not have created OPFS data, may be in a different browser profile, or may be separated by storage partitioning or private-browsing rules. Verify the full origin shown by the Studio.
Load unpacked reports an error
Make sure you selected the repository's extension/ folder and did not move individual files out of it. Reload after replacing source files. The browser's extension card shows the specific manifest or module error when loading fails.
A feature differs in Brave, Vivaldi, or Opera
Those browsers share Chromium foundations but can change privacy behavior, internal pages, enterprise controls, PDF surfaces, and release timing. Try a current stable version and compare in Chrome or Edge before filing a compatibility report.