在 javascript 中使用 jest 的 IndexedDb 单元测试

问：

'如何在开玩笑单元测试中模拟索引Db？我是开玩笑测试的新手，并试图嘲笑它。这是我的 indexedDb 代码。它从数据库获取数据，并具有创建数据和根据数据库中的ID删除数据的功能。我在索引 db 中也有 dom 元素，我可以用 jsdom 模拟它们。

let db = null;
let objectStore = null;
const DB_PERSONAL_DETAILS = "PersonalDetails";
const PERSONAL_DETAILS_STORE = "PersonalDetailsStore";
const MODE = {readWrite : "readwrite", readOnly : "readonly"};
const name = document.getElementById("name");
const email = document.getElementById("email");
const dob = document.getElementById("dob");
const phoneNumber = document.getElementById("phone");
const formMessageHolder = document.getElementById("form-message");



export function intialiseDb(){
    
    let DBOpenReq = indexedDB.open(DB_PERSONAL_DETAILS, 2);
    
    DBOpenReq.addEventListener('error', (err) => {
      //Error occurred while trying to open DB
      console.warn(err);
    });
    DBOpenReq.addEventListener('success', (ev) => {
      //DB has been opened... after upgradeneeded
      db = ev.target.result;
      getPersonaldetails();
      console.log('success', db);
    });
    DBOpenReq.addEventListener('upgradeneeded', (ev) => {
      //first time opening this DB
      //OR a new version was passed into open()
      db = ev.target.result;
      let oldVersion = ev.oldVersion;
      let newVersion = ev.newVersion || db.version;
      console.log('DB updated from version', oldVersion, 'to', newVersion);
  
      console.log('upgrade', db);
      if (!db.objectStoreNames.contains(PERSONAL_DETAILS_STORE)) {
        objectStore = db.createObjectStore(PERSONAL_DETAILS_STORE, {
          keyPath: 'id',
        });
      }
    });
}

export function getPersonaldetails(){
    const tx = makeTransaction(PERSONAL_DETAILS_STORE, MODE.readOnly);

    tx.oncomplete = () => {

    }

    // this will return an Array on result onsuccess
    const getReq =  tx.objectStore(PERSONAL_DETAILS_STORE).getAll();

    getReq.onsuccess = (ev) => {
        const results = ev.target.result;
        showPersonalDetails(results);
    }

    getReq.onerror = (err) => { console.warn(err)}

}

export function showPersonalDetails(results){
    const listContainerDiv = document.getElementById("listConatinerDiv");
    const listHeader = document.getElementById("listHeader");

    results?.length ?  listHeader.innerHTML = `<h2>Personal details list</h2>` : ""


    listContainerDiv.addEventListener('click', deletePersonalDetail);

    let listItems = results?.length > 0 ? results.map((item) => {

        return `<ul>
        <li data-label='Full name'>${item.name}</li>
        <li data-label='Email'>${item.email}</li> 
        <li data-label='date of birth'>${item.dob}</li>
        <li data-label='Phone number'>${item.phoneNumber}</li>
        <li data-label='Action'><a data-key=${item.id} href = '#'> Delete <span class='visually-hidden'>${item.name}<span></a></li></ul>`
    }) : `<ul><li>No results found. </li></ul>`;

     listItems = results?.length > 0 ? listItems.join(" ") : listItems

    listContainerDiv.innerHTML = `<ul>
    <li>First Name</li>
    <li>Email</li>
    <li>Date of birth</li>
    <li>Phone Number</li>
    <li>Action</li>
  </ul>` + listItems;

}

export function makeTransaction(storeName, mode){
    const tx =  db.transaction(storeName, mode);

    tx.onerror = (err) => {
        console.warn(err)
    };

    return tx

}

export function deletePersonalDetail(ev){
    ev.preventDefault();
    if(ev.target.attributes['data-key']){

    const tx = makeTransaction(PERSONAL_DETAILS_STORE, MODE.readWrite);
    const id = ev.target.attributes['data-key'].value;
    tx.oncomplete = () => {

        formMessageHolder.innerHTML = "Data has been deleted successfully";
        getPersonaldetails();

    };

    const deleteReq = tx.objectStore(PERSONAL_DETAILS_STORE).delete(id);
    deleteReq.onsuccess = (ev) => {console.log("deleted")};
    deleteReq.onerror = (err) => {console.log(err)};
}

}

export function createDetailsinDB(formData){
    let PersonalDetailsData = {     
                                    id : crypto.randomUUID(),
                                    name : formData.nameValue,
                                    email : formData.emailValue,
                                    dob : formData.dobValue,
                                    phoneNumber : formData.phoneNumberValue
                                }

    let tx = makeTransaction(PERSONAL_DETAILS_STORE , MODE.readWrite)

    tx.oncomplete = (ev) => {
        console.log(ev);
        getPersonaldetails()
    }
//make constant for store name and db name 
    let req  = tx.objectStore(PERSONAL_DETAILS_STORE).add(PersonalDetailsData)

    req.onsuccess = (ev) => {
        console.log("successfully added")   ;
    }

    req.onerror = (err) => {
        console.log("error : " + err);
    }

}