How to use isAsymmetricMatcher method in Jest

I guess you want to check if the correct number of childs of some type was rendered (in Vue).

// import component that you want to count, e.g. Button

const buttons = [
  { name: 'button1' },
  { name: 'button2' }
]

const comp = shallowMount(component, { propsData: { buttons } })

expect(comp.findAll(Button).length).toBe(buttons.length)

https://lmiller1990.github.io/vue-testing-handbook/finding-elements-and-components.html#findall

get the image using testId or role then use fireEvent to call onLoad or OnError functions respectively

const image = getByRole('img')

fireEvent.load(image);

for onError

fireEvent.error(image)

This is a known bug: https://github.com/facebook/jest/issues/11640

Downgrading to @types/node v15.14.0 seems to work around the bug for me.

It looks like this is a known issue with create react app and dependencies that use nullish coalescing. See this GitHub issue for more information https://github.com/facebook/create-react-app/issues/9468

One of the suggested fixes is to change your browserslist config in your package.json to this:

"browserslist": [
   ">0.2%",
  "not dead",
  "not op_mini all"
],

That may fix it for you because it’ll change how Babel is transpiling your code. It looks like it’s not transpiling any nullish coalescing because it’s supported by the browserslist you’re targeting.

First thing I noticed is that you don't have typescript in your package.json. This means you have globally installed typescript compiler, run it from command line, and have .js files generated side by side with .ts files. And when you run node, it runs the .js files.

While this approach may seem convenient, it relies on a globally installed tsc, and it relies on a person manually running tsc. This makes it difficult to run the project for a person not familiar with it (even if it's you an a couple of months). To fix this, you could install typescript locally (adding it to package.json), and run it automatically (npm run start).

Now, about your questions: 1. the distinction between transpiling and pre-processing

it is actually the same thing

2. the meaning of Jest's transform property

   this simplifies test running, you don't have to have typescript globally installed, and manually run. Ts-jest transforms it for you.

You might also want to take a look at https://github.com/TypeStrong/ts-node, which is like node, but you don't need to transpile typescript yourself.

And nodemon supports typescript like this (nodemon.js):

{
  "watch": ["src"],
  "ext": "ts",
  "ignore": ["src/**/*.test.ts"],
  "exec": "ts-node ./src/index.ts"
}

Jest parallelizes test runs and it doesn't know upfront which tests it should run and which it shouldn't run. This means when you use "fit", it will only run one test in that file. But it still runs all other test files in your project.

fit, fdescribe and it.only, describe.only have the same purpose: skip other tests and run only me.

Source: https://github.com/facebook/jest/issues/698#issuecomment-177673281

Use the Jest filtering mechanism. When you run your tests like,

jest --config=jest.config.json --watch

you can filter tests by a testname or filename. Just follow the instructions in the terminal.

Press p, and then type a filename.

Then you can use describe.only and it.only which will skip all other tests from the filtered, tested file.

I figured out that the config file is JSON.

{
  "testPathDirs": ["coredata/src"]
}

Unfortunately I found nowhere in the documentation a hint about this.

Error constructor doesn't expect {status: number} to be passed to it. You can create and use custom error class:

class CustomError extends Error {
    status: number;

    constructor(message: string, { status }: { status: number }) {
        super(message);
        this.status = status
    }
}

// ...

throw new CustomError('Error Message', { status: 403 })

Or you could assign status property to the error after creation:

throw Object.assign(new Error('Error Message'), { status: 403 })

Here’s what you need to do:

// EventEmitter is here to rescue you
const events = require("events");

// Mock the third party library
const lib = require("@third-party/lib");

lib.createClient.mockImplementationOnce(params => {
  const self = new events.EventEmitter();

  self.as = jest.fn().mockImplementation(() => {
    // Since we're calling post on the same object.
    return self;
  });

  self.post = jest.fn().mockImplementation((arg1, _cb) => {
    // Can have a conditional check for arg 1 if so desird
    _cb(null, { data : "foo" });
  });

  // Finally call the required event with delay.
  // Don't know if the delay is necessary or not.
  setInterval(() => {
    self.emit("success");
  }, 10);
  return self;
}).mockImplementationOnce(params => {
  const self = new events.EventEmitter();

  // Can also simulate event based error like so:
  setInterval(() => {
    self.emit("error", {message: "something went wrong."});
  }, 10);
  return self;
}).mockImplementationOnce(params => {
  const self = new events.EventEmitter();
  self.as = jest.fn().mockImplementation(() => {
    return self;
  });

  self.post = jest.fn().mockImplementation((arg1, _cb) => {
    // for negative callback in post I did:
    _cb({mesage: "Something went wrong"}, null);
  });

  setInterval(() => {
    self.emit("success");
  }, 10);
  return self;
});

This is only the mock object that you need to put in your test.js file.

Not sure if this code will work as is, although won’t require a lot of debugging.

If you just want to positive scenario, remove the second mockImplementationOnce and replace the first mockImplementationOnce with just mockImplementation.