react/vitest-component

Template for a react-based vitest test suite file for testing a component.

Usage

npx @lukasbach/scripts react/vitest-component

You can call the script directly if you have installed it globally:

npm i -g @lukasbach/scripts
ldo react/vitest-component

There is a default shortcut for this script: ldo vitc

You can customize shortcuts with ldo edit-shortcuts.

Arguments

• [0]: Name of the tested component

Options

• -v, --verbose: Verbose logging

You can also omit options, and will be asked for them interactively.

Add --yes to skip all confirmations.

Script source

View Source on GitHub

/** Template for a react-based vitest test suite file for testing a component. */

const testName = await ask.text("_", "Name of the tested component", "MyComponent");

const pascal = utils.changeCase.pascalCase(testName);
const kebab = utils.changeCase.kebabCase(testName);

const content = utils.noindent(`
  import { describe, expect, it } from "vitest";
  import { render } from "@testing-library/react";
  import { ${pascal} } from "./${kebab}";
  
  describe("${kebab}", () => {
    it("should render", () => {
      const { getByText } = render(<${pascal} />);
      expect(getByText("hello")).toBeInTheDocument();
    });
  });`);

await fs.writeFile(path.join(process.cwd(), `${kebab}.spec.tsx`), content);