Skip to content
Go to file
2 contributors

Users who have contributed to this file

@dfahlander @npmcdn-to-unpkg-bot
127 lines (122 sloc) 6.19 KB
<!DOCTYPE html>
<html xmlns="">
<title>Database Dump Sample</title>
width: 100%;
height: 1000px;
<script src=""></script>
// To make the sample more visible - replace window.console with one that shows the content on page
function Console() {
this.textarea = document.createElement('textarea');
this.log = function (txt, type) {
if (type) this.textarea.value += type + " ";
this.textarea.value += txt + "\n";
this.error = function (txt) {
this.log(txt, "ERROR!");
window.console = new Console();
document.addEventListener('DOMContentLoaded', function () {
// This sample shows how to iterate all databases at current origin and dump the version and schemas of each database.
// If you run this sample on Chrome or Opera it will also be able to dump databases not created by Dexie. On IE and FF,
// there is no native API to list existing databases, but Dexie is still capable of dumping the version and schema in
// case you know the database names.
// The console output will be displayed in the form of javascript code, as how the database would be defined with Dexie.
// The code could be extended to also dump the objects from the database (see comment in code). Another posibility that would be
// doable is to monitor the database live. That is possible if using the Dexie.Observable addon but it will only be capable
// of monitoring other databases used with the Dexie.Observable addon applied. It would be possible to create a dynamic
// view of the contents in DB that would automatically update the page directly as soon as an object is added, changed or
// deleted.
// It is also possible to get notified when a database is added, deleted or upgraded. This is actually possible without
// the Dexie.Observable addon. To get notified when databases are added or deleted, just listen to the window.onstorage
// event and when the key "Dexie.DatabaseNames" changes. To listen to upgrades, just listen to Dexie event
// db.on('versionchange'). The default behavior of that event is to close the database and reload the page. To override
// this, return false from your subscriber function and instead do db.close();; Then the database will reopen
// to the new schema.
console.log("Dumping Databases");
Dexie.getDatabaseNames(function (databaseNames) {
if (databaseNames.length === 0) {
// No databases at this origin as we know of.
console.log("Could not find databases on current origin.");
console.log("Was your database created without using Dexie? Try the [Add database] button above!");
} else {
// At least one database to dump
function dump(databaseNames) {
if (databaseNames.length > 0) {
var db = new Dexie(databaseNames[0]);
// Now, open database without specifying any version. This will make the database open any existing database and read its schema automatically. () {
console.log("var db = new Dexie('" + + "');");
console.log("db.version(" + db.verno + ").stores({");
db.tables.forEach(function (table, i) {
var primKeyAndIndexes = [table.schema.primKey].concat(table.schema.indexes);
var schemaSyntax = (index) { return index.src; }).join(',');
console.log(" " + + ": " + "'" + schemaSyntax + "'" + (i < db.tables.length - 1 ? "," : ""));
// Note: We could also dump the objects here if we'd like to:
// table.each(function (object) {
// console.log(JSON.stringify(object));
// });
}).finally(function () {
} else {
console.log("Finished dumping databases");
console.log("Hint: Is your DB not listed? Try using the [Add database] button above!");
function addDatabase(ev) {
const dbname = prompt("Enter name of a database on this origin (" + + ")");
if (!dbname) return; // User cancelled dialog
console.log("Trying to open " + dbname);
return new Dexie(dbname, {addons: []}).open().then(function (db) {
console.log("Database " + dbname + " found. Adding it to __dbnames db");
}).then(function () {
return new Dexie ("__dbnames", {addons: []}).open();
}).then(function (db) {
return db.table("dbnames").put({name: dbname}).then(function() {
console.log("Succcessfully added " + dbname + ". Please reload page to dump it!");
}).catch(function (error) {
<div class="buttons">
<button onclick="addDatabase(event);">Add database</button>
<div id="consoleArea"></div>
You can’t perform that action at this time.