How to Inspect Storage and Cookies in DevTools
· Category: VS Code & Developer Tools
Short answer
The Application panel in DevTools provides access to cookies, localStorage, sessionStorage, IndexedDB, and cache storage for the current origin.
Steps
- Open DevTools and click the Application tab.
- Expand the Storage section to view Cookies, Local Storage, and Session Storage.
- Click a domain to see its key-value pairs.
- Double-click a value to edit it directly in DevTools.
- Use the "Clear storage" button to wipe all data for the origin.
Tips
- Filter cookies by name or value using the search box.
- Inspect service worker caches under Cache Storage.
- View IndexedDB object stores for complex client-side data.
Common issues
- Third-party cookies may be hidden depending on browser privacy settings.
- Storage quotas vary by browser and can cause silent write failures.