IndexedDb version change transaction is running

Question

I'm new to JSON and indexeddb. I'm trying to create a new table and add data to it and i always get this error in the chrome console for indexdb. I've gone through all the stackoverflow stuff for indexdb and i am still unable to make progress. If i change an existing object storecode to replace its data, it works, but when i try to add a new object store and add data it fails. Here is the error:

Uncaught DOMException: Failed to execute 'transaction' on 'IDBDatabase': A version change transaction is running. at populateGHGEF (https://localhost:44364/js/demo/sample.js:437:18) at IDBOpenDBRequest.upgradeNeededFunction (https://localhost:44364/js/demo/sample.js:420:17)

It happens here:

function populateGHGEF(db, data) {
        var transaction = db.transaction(["gHGEF"], "readwrite");

Here is my code:

var tacInputsDb = (function setupIndexDb() {
    var DB_NAME = "TacInputsDb";
    var DB_VERSION = "1";
    var db;

    function init(callback) {
        window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB ||
            window.msIndexedDB;
        window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction ||
            window.msIDBTransaction;

        //always starting fresh...for now.
        //console.log("Deleting current database.");
        //indexedDB.deleteDatabase("InitDB");

        if (!window.indexedDB) {
            window.alert("Your browser doesn't support a stable version of IndexedDB.");
        }

        //console.group("Index DB");

        var openRequest = window.indexedDB.open(DB_NAME, DB_VERSION);

        openRequest.onupgradeneeded = function upgradeNeededFunction(e) {
            //console.log("If upgrade needed");
            var newVersion = e.target.result;


            if (!newVersion.objectStoreNames.contains("GHGEF")) {
                newVersion.createObjectStore("GHGEF", {
                    keyPath: "FuelType"
                    //autoIncrement: true
                }

                );

                var ghgEFdata = [
                    {
                        "FuelType": "Biodiesel",
                        "Energy Density (MJ/unit)": " 126.13 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 34.34 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "1.0",
                        "EER Values Relative to Gasoline": " 1.1 "
                    },
                    {
                        "FuelType": "CNG",
                        "Energy Density (MJ/unit)": " 0.98 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 79.21 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "0.9",
                        "EER Values Relative to Gasoline": " 1.0 "
                    },
                    {
                        "FuelType": "Diesel",
                        "Energy Density (MJ/unit)": " 134.47 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 100.45 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "1.0",
                        "EER Values Relative to Gasoline": " 1.1 "
                    },
                    {
                        "FuelType": "Electric",
                        "Energy Density (MJ/unit)": " 3.60 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 81.49 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "5.0",
                        "EER Values Relative to Gasoline": " 3.4 "
                    },
                    {
                        "FuelType": "Gasoline",
                        "Energy Density (MJ/unit)": " 115.83 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 99.44 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "1.0",
                        "EER Values Relative to Gasoline": " 1.0 "
                    },
                    {
                        "FuelType": "Hydrogen Fuel Cell",
                        "Energy Density (MJ/unit)": " 120.00 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 111.61 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "1.9",
                        "EER Values Relative to Gasoline": " 2.5 "
                    },
                    {
                        "FuelType": "LNG",
                        "Energy Density (MJ/unit)": " 78.83 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 97.77 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "0.9",
                        "EER Values Relative to Gasoline": " 1.0 "
                    },
                    {
                        "FuelType": "Renewable Diesel",
                        "Energy Density (MJ/unit)": " 129.65 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 30.40 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "1.0",
                        "EER Values Relative to Gasoline": " 1.1 "
                    },
                    {
                        "FuelType": "Renewable Natural Gas",
                        "Energy Density (MJ/unit)": " 0.98 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 43.84 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "0.9",
                        "EER Values Relative to Gasoline": " 1.0 "
                    }
                ];
                //populateGHGEF(newVersion);
                populateGHGEF(newVersion, ghgEFdata);
            }
        };

        //openRequest.onerror = openRequest.onblocked = ////console.log("Blocked");
        openRequest.onerror = openRequest.onblocked = function (e) {
            ////console.log("InitDB Blocked.");
        };

        openRequest.onsuccess = function (e) {
            db = e.target.result;
            callback("Tac Inputs Db setup Complete. Database is open.");
        };
    }//END init()

    function populateGHGEF(db, data) {
        var transaction = db.transaction(["gHGEF"], "readwrite");
        console.log("created transaction for ghgef");

        //Do something when all the data is added to the database.
        transaction.oncomplete = function (event) {
            console.log("All done!");
        };

        transaction.onerror = function (event) {
            console.log("Don't forget to handle errors!");
        };

        var objectStore = db.objectStore("gHGEF");
        console.log("accessing object store");

        data.forEach(function (GHGEF) {
            var request = objectStore.add(GHGEF);
            request.onsuccess = function (event) {
                ////console.log("ghgRegion Item Successfully Added.");
            };
        });
    }


        });
    }


    return {
        init: init,

    }
})()

Here is how i call it on another page:

(function ($) {
    $(document).ready(function () {
        var p1 = Promise.resolve();
        p1 = p1.then(_ => new Promise(resolve =>
            tacInputsDb.init(function (msg) {
                console.log(msg);
                });
            })
        ));
        });

Can someone tell me what i'm doing wrong here.

Josh Josh · Accepted Answer · 2020-01-03T02:26:44

The cause of this error is in the line

function populateGHGEF(db, data) {
        var transaction = db.transaction(["gHGEF"], "readwrite");

that you call from within the onupgradeneeded handler.

As as quick fix, if you insist on writing code this way, you can wait for the versionchange transaction to complete before starting a second transaction by changing the line

populateGHGEF(newVersion, ghgEFdata);

to

e.target.transaction.oncomplete = function() {
  populateGHGEF(newVersion, ghgEFdata);
};

However, you could avoid this entirely if you just waited to insert data until the appropriate time, which is when the IDBOpenRequest completes successfully. This is when the database is considered open.

As an informal rule, you should not be storing data from within on onupgradeneeded handler. That functionality is only available to programmers because sometimes upgrading the database requires changing how data is stored. But if you are not upgrading the database (e.g. changing object stores), then you shouldn't be doing inserts in onupgradeneeded.

improvements:

do data changes in the onsuccess handler, then you do not have to upgrade the version every time to change the data.
use promises to help separate the calls entirely

IndexedDb version change transaction is running

1 Answers