How to test with Jest?

Hi,

I’m trying to figure out how to write tests using this library. I looked at fake-indexeddb/auto and while this seems to work partly I end up with an instance of idb that doesn’t have a put method. I looked at the mocha tests included in the lib… but I didn’t understand them – they seem to have been written without mocking IndexedDB at all?

Here’s what I tried:

import actions from "../actions";
import IndexedDB from "fake-indexeddb/auto";
import { openDB } from "idb/with-async-ittr-cjs"; 

class DbService {
  instance = void 0;
  async initialize() {
    this.instance = await openDB("MNR", 2, {
    ...
    })
  }
};
const db = new DbService();
db.initialize();
test("IDB_resetBusy to call put", async () => {
    await db.initialize();
    db.instance.put = jest.fn();
    await actions.IDB_resetBusy("blah");
    expect(db.instance.put).toHaveBeenCalledTimes(1);
  });

I get the error:

TypeError: Cannot read property 'put' of undefined

[jakearchibald]

Mocha runs in the browser

[taxilian]

While it would be good to do real tests with karma or similar, there are definitely advantages to testing with something like jest or mocha as well using mocks. I have unit tests working with jest, fake-indexeddb, and idb by doing the following:

• Make sure you’re using the cjs import if you are using async iterators – i.e. import * as idb from 'idb/with-async-ittr-cjs'; because with-async-ittrdoesn’t work in node, at least not from normal files (probably is a way, I’m too lazy to track it down)
• In your jest.config.js add "fake-indexeddb/auto" to the setupFiles, e.g.:

module.exports = {
  preset: '@vue/cli-plugin-unit-jest/presets/typescript-and-babel',
  transform: {
    '^.+\\.vue$': 'vue-jest'
  },
  setupFiles: [
    "fake-indexeddb/auto"
  ]
}

Beyond that things Just Work so far. Remember it’s a mock so you should do real integration tests as well, but for checking application logic this runs much faster than something requiring a browser, even a headless one.