How to debug jest test cases(React)?

Adding test cases to your code always helps in the long run, today we’re going to talk about how to debug test cases.

Do something today that your future self will thank you for

  1. Using our all time favourite Console.log
     it('should call touch & asyncValidate methods', () => {
          const component = shallow(
            <TrialRegistrationForm handleSubmit={mockHandleSubmit} pristine />,
          );
    
          const mockFunction = jest.fn();
          console.log(mockFunction);
          component.instance().touchAndAsyncValidate('test', '1');
    
          expect(mockFunction).toBeCalledWith('test');
        });
  2. Using the Jest recommend way by using node
      1. Add debugger; where we want to break our test case
      2. Run the command in terminal
        node --inspect-brk node_modules/.bin/jest --runInBand
        Debugger listening on ws://127.0.0.1:9229/c5ce34bb-64f3-4a59-8246-e21168ba8e26
        For help see https://nodejs.org/en/docs/inspector
      3. Open the link in chrome chrome://inspect
      4. Click on Open Dedicated DevTools for NodeDebug jest test cases
      5. Our script will break at the debugger

    debugger test cases react