From Chrome 132, DevTools Can Now View and Edit Extension Storage
Introduction
As part of my personal projects, I’ve been developing a Chrome extension for tab management called TabTabTab. To enhance my extension, I occasionally check for updates on Chrome extension features. With the release of Chrome 132, a new feature that makes Chrome extension development a bit more convenient has been introduced, so I’d like to share it.
Viewing and Editing Storage from DevTools
Starting with Chrome 132, a new Extension storage
section has been added to the Application > Storage
tab in DevTools. This feature allows you to view and edit the storage contents used by installed extensions. Previously, developers had to rely on debug prints to inspect storage content, but now data verification during development feels much easier and more intuitive.
The extensions displayed in DevTools require the storage
permission and allow developers to inspect the following four types of storage: session
, local
, sync
, and managed
. Additionally, this storage inspection feature is available in the following scenarios:
- Documents where the extension inserts content scripts
- Documents with the
chrome-extension://
scheme (such as popup or options pages) - The extension’s Service Worker
- Manifest V2 background pages
Being able to view and edit storage is not only convenient for developing your own extensions, but it also allows you to check what kind of data other extensions store. While you can also delete data, keep in mind that removing data using methods outside the extension’s provided interfaces might cause unexpected behavior for some extensions.
Conclusion
This new feature makes developing Chrome extensions even easier. Whether you’re currently developing an extension or planning to start, give this feature a try.
I personally check for new features like this one on the following page from time to time. If you know of other good resources, I’d love to hear about them.