Wondering what’s next for npm?Check out our public roadmap! »

    mocha-vite-puppeteer

    1.4.1 • Public • Published

    mocha-vite-puppeteer

    Build Status

    Run your Mocha front-end tests with the Vite bundler and the Puppeteer browser launcher.

    "mocha-vite-puppeteer" can be used with any existing Vite project and is not specific to Vue, React or any other front-end library. Both JavaScript and TypeScript is supported via Vite.

    Install

    npm install mocha-vite-puppeteer

    Run

    As usually with Mocha, you must first create a test.html next to your index.html. Be sure to configure the glob import to match your test file names:

    <!DOCTYPE html>
    <html lang="en">
      <body>
        <script type="module">
          import "mocha";
          mocha.setup({ ui: "bdd" });
        </script>
        <script type="module">
          const modules = import.meta.globEager("/src/**/*.test.{js,jsx}");
        </script>
      </body>
    </html>

    Then add some test files using Mocha, e.g.

    import { expect } from "chai";
    import React from "react";
    import { render, screen } from "@testing-library/react";
    
    import Counter from "./Counter";
    
    describe("Counter", () => {
      it("should count", () => {
        render(<Counter />);
        const countButton = screen.getByText("count is: 0");
        countButton.click();
        screen.getByText("count is: 1");
      });
    });

    Note: "mocha-vite-puppeteer" is not React specific, and should work just as well with Vue, Preact or any other front-end library supported by Vite.

    Then run your tests, bundled with Vite, in Puppeteer with:

    $ npx mocha-vite-puppeteer

    You can optionally specify a reporter, otherwise "spec" is the default.

    $ npx mocha-vite-puppeteer --reporter spec

    You will see output similar to:

      Counter
        ✓ should count
      1 passing (24ms)
    

    An exit code of 0 indicates that all tests passes. In general, the exit code indicates the number of failed tests, which can be used in CI pipelines.

    For now the following built-in reporters are supported:

    • dot
    • json
    • json-stream
    • list
    • spec
    • tap

    And also the following custom reporter is supported:

    You can optionally specify a JSON file with reporter options:

    $ npx mocha-vite-puppeteer --reporter mocha-junit-reporter --reporter-options mocha-junit-reporter.config.json

    See also

    Develop

    npm test

    Contributions welcome!

    Install

    npm i mocha-vite-puppeteer

    DownloadsWeekly Downloads

    67

    Version

    1.4.1

    License

    MIT

    Unpacked Size

    13.8 kB

    Total Files

    6

    Last publish

    Collaborators

    • avatar