JSFiddle - React, Tailwind, and code Playground

HTML

<button onclick="read()">Read </button>

JavaScript

function read() {

// This works on all devices/browsers, and uses IndexedDBShim as a final fallback 
var indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB || window.shimIndexedDB;

// Open (or create) the database
var open = indexedDB.open("MyDatabase");
/*
// Create the schema
open.onupgradeneeded = function() {
    var db = open.result;
    var store = db.createObjectStore("MyObjectStore", {keyPath: "id"});
    var index = store.createIndex("NameIndex", ["name.last","mail.last", "name.first"]);
};*/

open.onsuccess = function() {
    // Start a new transaction
    var db = open.result;
    var tx = db.transaction("MyObjectStore", "readwrite");
    var store = tx.objectStore("MyObjectStore");
    var index = store.index("NameIndex");

    // Add some data
    store.put({id: 2, name: {first: "John", last: "Doe"}, age: 42});
    store.put({id: 3, name: {first: "Bob", last: "Smith"}, age: 35});
    
    // Query the data
    var request1 = store.get(2);
    var request2 = index.get(["Smith", "Bob"]);




    request1.onsuccess = function() {
       // console.log(request.result.name.first);  // => "John"
        
        alert(request1.result.name.first);
        
    };

    request2.onsuccess = function() {
        console.log(request2.result.name.first);   // => "Bob"
         alert(request2.result.name.first);
        
    };

    // Close the db when the transaction is done
    tx.oncomplete = function() {
        db.close();
    };
}

};