Indexeddb not showing in Chrome Dev Tools

Question

I want to create a Chrome Extension (manifest v3) which creates a indexeddb for data storage. The console shows the data, but i can not see the indexeddb in the dev tools (in the service worker view). the manifest includes the "storage" permission. Am I missing something?

The db is created in the service-worker script.

// Specify the database
   var dbName = "mySampleDB";
   var storeName = "mySampleStore";

// Open a connection to the database
var openRequest = indexedDB.open(dbName, 1); // 1 is the version of the database

openRequest.onupgradeneeded = function (e) {
 var db = e.target.result;

// Create an object store if it doesn't exist
if (!db.objectStoreNames.contains(storeName)) {
    var store = db.createObjectStore(storeName, {
        keyPath: "id",
        autoIncrement: true,
    });

    // Define some indexes, if necessary
    // store.createIndex('name', 'name', { unique: false });

    // Add sample data
    store.transaction.oncomplete = function (event) {
        var transaction = db.transaction(storeName, "readwrite");
        var sampleStore = transaction.objectStore(storeName);

        var sampleData = [
            { id: 1, name: "Item 1", value: "Value 1" },
            { id: 2, name: "Item 2", value: "Value 2" },
            { id: 3, name: "Item 3", value: "Value 3" },
        ];

        sampleData.forEach(function (item) {
            sampleStore.add(item);
        });
    };
}
};
openRequest.onsuccess = function (e) {
    console.log("Database opened successfully");
    // Further operations like reading or adding data can be done here
    var db = e.target.result;

// Start a new transaction
var transaction = db.transaction(["mySampleStore"], "readonly");
var store = transaction.objectStore("mySampleStore");

// Open a cursor to traverse all items in the store
var cursorRequest = store.openCursor();

cursorRequest.onsuccess = function (e) {
    var cursor = e.target.result;
    if (cursor) {
        // Log the current item
        console.log(
            "ID: " +
                cursor.key +
                ", Name: " +
                cursor.value.name +
                ", Value: " +
                cursor.value.value
        );
        cursor.continue(); // Move to the next item
    } else {
        console.log("No more entries!");
    }
};

cursorRequest.onerror = function (e) {
    console.error("Error reading data:", e.target.errorCode);
};
};

openRequest.onerror = function (e) {
    console.error("Error opening database:", e.target.errorCode);
};

console-log:

Database opened successfully
service-worker.js:57 ID: 1, Name: Item 1, Value: Value 1
service-worker.js:57 ID: 2, Name: Item 2, Value: Value 2
service-worker.js:57 ID: 3, Name: Item 3, Value: Value 3
service-worker.js:67 No more entries!