Reblend Testing Library

Simple and complete ReblendJS DOM testing utilities that encourage good testing practices.

---

Overview

Reblend Testing Library provides lightweight utilities for testing ReblendJS components. It encourages tests that focus on user interactions and DOM output, not implementation details.

Installation

npm install --save-dev reblend-testing-library @testing-library/dom @testing-library/jest-dom

• Requires Node.js >= 20
• Peer dependencies: reblendjs, @testing-library/dom

Usage Example

import { render, fireEvent, screen } from 'reblend-testing-library';
import '@testing-library/jest-dom';

function Counter() {
  const [count, setCount] = Reblend.useState(0);
  return (
    <>
      <button onClick={() => setCount(count + 1)}>{count}</button>
      {count ? 'Clicked!' : 'Click the button!'}
    </>
  );
}

test('increments counter', async () => {
  render(<Counter />);
  const button = screen.getByRole('button');
  expect(button).toHaveTextContent('0');
  fireEvent.click(button);
  expect(button).toHaveTextContent('1');
  expect(screen.getByText('Clicked!')).toBeInTheDocument();
});

Features

• Works with ReblendJS components and hooks
• Encourages user-centric testing
• Integrates with @testing-library/dom and @testing-library/jest-dom
• Supports async utilities like waitFor, findBy*, etc.

API

• render(ui, options): Render a ReblendJS component to the DOM
• fireEvent: Simulate user events
• screen: Global queries for DOM elements
• waitFor, waitForElementToBeRemoved: Async utilities for waiting on DOM changes

See the API docs for more details.

Migration from React

• All React/ReactDOM references have been removed
• Use reblendjs and Reblend Testing Library utilities in your tests
• Most React Testing Library patterns are supported, but use ReblendJS components/hooks

Contributing

See CONTRIBUTING.md for guidelines.

License

MIT © Emmanuel Paul Elom

---

For more examples and advanced usage, see the docs or open an issue if you have questions.