Working on a Chrome Extension, which needs to integrate with IndexedDB. Trying to figure out how to use Dexie.JS. Found a bunch of samples. Those don't look too plicated. There is one specific example particularly interesting for exploring IndexedDB with Dexie at .js/blob/master/samples/open-existing-db/dump-databases.html

However, when I run the one above - the "dump utility," it does not see IndexedDB databases, telling me: There are databases at the current origin.

From the developer tools Application tab, under Storage, I see my IndexedDB database.

Is this some sort of a permissions issue? Can any indexedDB database be accessed by any tab/user?

What should I be looking at?

Thank you

Working on a Chrome Extension, which needs to integrate with IndexedDB. Trying to figure out how to use Dexie.JS. Found a bunch of samples. Those don't look too plicated. There is one specific example particularly interesting for exploring IndexedDB with Dexie at https://github./dfahlander/Dexie.js/blob/master/samples/open-existing-db/dump-databases.html

However, when I run the one above - the "dump utility," it does not see IndexedDB databases, telling me: There are databases at the current origin.

From the developer tools Application tab, under Storage, I see my IndexedDB database.

Is this some sort of a permissions issue? Can any indexedDB database be accessed by any tab/user?

What should I be looking at?

Thank you

• javascript
• google-chrome-extension
• indexeddb
• dexie

• 2 Own pages of an extension have their own origin. Content scripts use a web page origin. – woxxom Commented Sep 3, 2017 at 19:50

2 Answers 2

In chrome/opera, there is a non-standard API webkitGetDatabaseNames() that Dexie.js uses to retrieve the list of database names on current origin. For other browsers, Dexie emulates this API by keeping an up-to-date database of database-names for each origin, so:

For chromium browsers, Dexie.getDatabaseNames() will list all databases at current origin, but for non-chromium browsers, only databases created with Dexie will be shown.

If you need to dump the contents of each database, have a look at this issue, that basically gives:

interface TableDump {
    table: string
    rows: any[]
}

function export(db: Dexie): TableDump[] {
    return db.transaction('r', db.tables, ()=>{
        return Promise.all(
            db.tables.map(table => table.toArray()
                .then(rows => ({table: table.name, rows: rows})));
    });
}

function import(data: TableDump[], db: Dexie) {
    return db.transaction('rw', db.tables, () => {
        return Promise.all(data.map (t =>
            db.table(t.table).clear()
              .then(()=>db.table(t.table).bulkAdd(t.rows)));
    });
}

Combine the functions with JSON.stringify() and JSON.parse() to fully serialize the data.

const db = new Dexie('mydb');
db.version(1).stores({friends: '++id,name,age'});

(async ()=>{
    // Export
    const allData = await export (db);
    const serialized = JSON.stringify(allData);

    // Import
    const jsonToImport = '[{"table": "friends", "rows": [{id:1,name:"foo",age:33}]}]';
    const dataToImport = JSON.parse(jsonToImport);
    await import(dataToImport, db);
})();

A working example for dumping data to a JSON file using the current indexedDB API as described at:

• https://developers.google./web/ilt/pwa/working-with-indexeddb
• https://developer.mozilla/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB

The snippet below will dump recent messages from a gmail account with the Offline Mode enabled in the gmail settings.

var dbPromise = indexedDB.open("[email protected]_xdb", 109, function (db) {
  console.log(db);
});

dbPromise.onerror = (event) => {
  console.log("oh no!");
};
dbPromise.onsuccess = (event) => {
  console.log(event);
  var transaction = db.transaction(["item_messages"]);
  var objectStore = transaction.objectStore("item_messages");
  var allItemsRequest = objectStore.getAll();

  allItemsRequest.onsuccess = function () {
    var all_items = allItemsRequest.result;
    console.log(all_items);

    // save items as JSON file
    var bb = new Blob([JSON.stringify(all_items)], { type: "text/plain" });
    var a = document.createElement("a");
    a.download = "gmail_messages.json";
    a.href = window.URL.createObjectURL(bb);
    a.click();
  };
};

Running the code above from DevTools > Sources > Snippets will also let you set breakpoints and debug and inspect the objects.

Make sure you set the right version of the database as the second parameter to indexedDB.open(...). To peek at the value used by your browser the following code can be used:

indexedDB.databases().then(
    function(r){
        console.log(r);
    }
);