Inspect extension's chrome.storage in devtools

Question

Chrome DevTools has a handy inspector for Local Storage and Session Storage, but is there nothing to inspect chrome.storage.sync?

chrome://sync-internals/ doesn't seem to display the actual contents of the synchronized storage per extension.

Answer 1

"Local Storage" and "Session Storage" in devtools refers only to the Web platform storage: localStorage API and sessionStorage API, not to chrome.storage.

---

Method 1: the built-in devtools viewer in Chrome 131 or newer

• View/edit/clear/filter in all chrome.storage areas: sync, local, session, managed.
• Usable inside devtools for the extension's service worker.
• Super fast even with big values in storage.

If you don't see it, you can enable it in devtools settings -> Experiments -> Extension storage.

Method 2: Storage Area Viewer extension

• View/edit/clear/search in all chrome.storage areas: sync, local, session, managed.
• Monitor the changes in storage.
• A dark theme.

Method 3: Storage Area Explorer extension

• View/edit/clear/import/export in two chrome.storage areas (sync, local).
• Much slower than Storage Area Viewer when there's a lot of data in storage.
• Development is abandoned many years ago.

Console and other methods

See the other answers.

Warning for methods 2 and 3 for ManifestV3 service worker: since devtools for service worker doesn't show storage, you'll have to open any visible page of your extension like the popup or options, right-click the page, then click "inspect", then go to Storage Explorer. If your extension doesn't have any visible pages, you can open chrome-extension://ID/manifest.json where ID is the id of the extension as shown in chrome://extensions page. Another method is to right-click any script from your extension in devtools (when you inspect the content script or service worker), then click "Open in a new tab". You can add a bookmark for this tab to open it quickly next time.

Answer 2

Starting in Chrome 132, DevTools has built in support for viewing extension storage. You can read more about it here: https://developer.chrome.com/docs/devtools/storage/extensionstorage

This is currently in Chrome beta and will be available in stable early January.

Answer 3

A poor workaround is to call get and obtain all the stored values. Of course, this doesn't let you conveniently edit them:

chrome.storage.sync.get(null, function callback(items) { console.log(items) });

For ManifestV3 in modern Chrome:

await chrome.storage.session.get()

Answer 4

1. Visit chrome://sync-internals/
2. Click Sync Node Browser tab and wait for it to load (may give a blank screen or in progress cursor)
3. Click expansion triangle in the sidebar for Extension settings
4. Click on individual settings in the sidebar to see their values and other metadata