Server Next

A library to easily create a modern Node.js server. Handles HTTP, Websockets and all the small details:

npm install @server/next

Getting Started Documentation

import server from "@server/next";

export default server()
  .get("/", () => "Hello world")
  .post("/users", ctx => {
    console.log(ctx.body);
    return { id: 100 };
  });

Batteries on

All the basics work as expected by default. Just write your app!

Modern ES7+

Use the clean syntax async, await, import, export, etc.

Websockets

Fully managed websockets with channels, reconnect, etc.

Documented

Extensive docs, tutorials and videos make it easy to learn.

Secure

Safe by default while fully configurable CORS, CSRF, JWT, etc.

Extensible

Compatible with thousands of existing Express.js libraries.

🚂 Render and assert

Allows you to render React components and make assertions against it with Jest or other testing libraries.

You can use the library methods to read values like .text(), or get a node with .get(index) and then use the native DOM API.

import $ from "react-test";

it("renders a simple title", () => {
  const title = $(<h1>Hello</h1>);
  expect(title.text()).toBe("Hello");
  expect(title.attr("id")).toBe(null);
  expect(title.get(0).nodeName).toBe("H1");
  // ...
});

Clear Jest Matchers

We've also created a series of Jest Matchers (included by default if you use Jest) that makes the tests more readable and the error messages when a test fails very clear.

They can be used in single elements and for a set of elements, both in the affirmative and negative form.

import $ from "react-test";

it("renders a simple title", () => {
  const title = $(<h1>Hello</h1>);
  expect(title).toHaveText("Hello");
  expect(title).not.toHaveAttribute("id");
  expect(title).toMatchSelector("h1");
  // ...
});

👆 Simulate user actions

This is where this library gets really valuable! Emulating user interactions is as easy as it could ever be. There's multiple event helpers available.

For example, to test a Counter that increments when clicked: render and assert the initial status, then await for a user click, and finally make more assertions.

import $ from "react-test";
import Counter from "./Counter";

it("Can increment a counter", async () => {
  const counter = $(<Counter />);
  expect(counter).toHaveText("0");
  await counter.click();
  await counter.click();
  expect(counter).toHaveText("2");
});

⏱ Timers, async, etc.

There's other helpers for common React workflows: waiting for a network call, for a specific DOM element, or for fixed amount of time before doing assertions.

You can use .delay() for a simple timer or until() for more complex DOM behavior.

import $, {until } from "react-test";
import UserList from "./UserList";

it("waits for a DOM change", async () => {
  const users = $(<UserList />);
  expect(users.find("li")).toHaveLength(0);
  await until(users).find("li");
  expect(users.find("li")).toHaveLength(10);
});

✨ Magic Autocomplete

Added jsdocs so the expected parameters and return value will be clearly defined in your IDE/Code Editor.

We added the description, a representative example and even a link for more information for every one of the methods available! We want you to have the best development experience possible with React Test!

Created by Francisco and other contributors.

Need help? Book a call.