Can I improve the test output?

[hornta]

I would like to have an improved test output where I can see how many tests did run and what the error output is of all failed tests. Now it's quite hard to know why a test failed and how many tests failed/succeded.

I just tried to switch from jest to vitest for our CRA 2 based app and compared to Jest this output is not verbose enough for me.

PS C:\Users\hornta\Documents\exopen\admin-portal> npx vitest

 DEV  v0.12.7 C:/Users/hornta/Documents/exopen/admin-portal

 ❯ src/features/sum-rows-and-kpis/miscHelper.test.ts (5)
 ❯ src/features/sum-rows-and-kpis/miscHelper.test.ts (5)
   × miscHelper - should return correct data
   ↓ Given account 111, 21, 3 is selected in balance misc and account 41 and 13 are selected in the result misc, when a ❯ src/features/sum-rows-and-kpis/miscHelper.test.ts (5)
 ❯ src/features/sum-rows-and-kpis/miscHelper.test.ts (5)
   × miscHelper - should return correct data
 ❯ src/features/sum-rows-and-kpis/miscHelper.test.ts (5)
   × miscHelper - should return correct data
 ❯ src/features/sum-rows-and-kpis/miscHelper.test.ts (5)
   × miscHelper - should return correct data
   ↓ Given account 111, 21, 3 is selected in balance misc and account 41 and 13 are selected in the result misc, when a ❯ src/features/sum-rows-and-kpis/miscHelper.test.ts (5)
   × miscHelper - should return correct data
   ↓ Given account 111, 21, 3 is selected in balance misc and account 41 and 13 are selected in the result misc, when a ❯ src/features/sum-rows-and-kpis/miscHelper.test.ts (5)
   × miscHelper - should return correct data
   ↓ Given account 111, 21, 3 is selected in balance misc and account 41 and 13 are selected in the result misc, when adding new account, then accounts 112, 113, 12, 121, 122, 22 should be available [skipped]
     - [ beforeEach ]
     - [ afterEach ]
   × If there is a queued pipline and a inProgress pipeline, show in progress pipeline progress
     - [ beforeEach ]
     - [ afterEach ]
 ❯ src/features/sidebar/__tests__/SidebarMenu.test.tsx (0)
 √ src/features/sum-rows-and-kpis/__tests__/miscData.test.ts (7)
 ❯ src/features/sidebar/__tests__/SidebarMenuItem.test.tsx (0)
 √ src/features/usersAndGroups/__tests__/AccessGroupsMobile.test.tsx (4) 2540ms
 ❯ src/features/usersAndGroups/__tests__/Users.test.tsx (0)
 · src/features/usersAndGroups/__tests__/UsersMobile.test.tsx (2)
 ❯ src/features/usersAndGroups/__tests__/UsersAndGroupsPage.test.tsx (3)
   √ UsersAndGroupsPage should display a spinner when no companyInfo
   / should display users tab first
   · should display groups tab when clicked

// vitest.config.ts

/// <reference types="vitest" />
/// <reference types="vite/client" />

import react from "@vitejs/plugin-react";
import { defineConfig } from "vite";

export default defineConfig({
  plugins: [react()],
  test: {
    globals: true,
    environment: "jsdom",
    setupFiles: ["./src/setupTests.ts"],
  },
});

setupTests.ts

import "dotenv/config";
import "whatwg-fetch";
import "@testing-library/jest-dom";
import { setLogger } from "react-query";
// import "whatwg-fetch";
import { server } from "./tests/mocks/server";

// mocking for powerbi-client
// @ts-ignore
window.crypto = {
  // @ts-ignore
  getRandomValues() {
    return [1];
  },
};

vi.mock("react-i18next", () => {
  const t = (str: string) => {
    return str;
  };
  return {
    // this mock makes sure any components using the translate hook can use it without a warning being shown
    useTranslation: () => {
      return {
        t,
        i18n: {
          changeLanguage: () => {
            return Promise.resolve();
          },
        },
      };
    },
  };
});

// https://react-query.tanstack.com/guides/testing#turn-off-network-error-logging
setLogger({
  log: console.log,
  warn: console.warn,
  error: vi.fn(),
});

beforeAll(() => {
  server.listen({
    onUnhandledRequest: "error",
  });
});

afterEach(() => {
  server.resetHandlers();
});

afterAll(() => {
  server.close();
});

[sheremet-va]

You can try --reporter=verbose

[hornta]

I will test it but don't you agree the default output could be improved? Some type of summary after all tests ran would suffice.

[sheremet-va]

There is a summary after all tests.

[hornta]

Ok so then something isn't working for me, the whole process just stops after · should display groups tab when clicked, but then I know this isn't intended so I will look into why that happens 👍