noodl-ui-test-utils

0.0.47 verified Sat Apr 25 auth: no javascript

Test utilities for the noodl-ui component library, version 0.0.47. This package provides helpers for unit testing noodl-ui components, including mock providers, test renderers, and assertion utilities. It is part of the AITMED ecosystem and complements the main noodl-ui library. The package ships TypeScript declarations. As a pre-1.0.0 release, its API is unstable and may change. Alternatives include @testing-library/react for general React testing.

Common errors

error TypeError: Cannot read properties of undefined (reading 'Provider') ↓

cause mockProvider was not imported correctly or noodl-ui context not set up.

fix

Ensure mockProvider is imported from 'noodl-test-utils' and wrapped around your component.

error Attempted to log. This is a bug in React Testing Library. ↓

cause Incorrect usage of fireEvent or render outside of test environment.

fix

Make sure you are using render from noodl-test-utils, not from @testing-library/react.

error Warning: Each child in a list should have a unique 'key' prop. ↓

cause Component under test is missing key props in a list.

fix

Add a unique key prop to each list item in your rendered component.

Warnings

breaking API changes frequently; breaking changes may occur in minor versions prior to 1.0.0. ↓

fix Pin to exact version or use version ranges with caution.

deprecated CJS require pattern is deprecated; use ESM imports for full TypeScript support. ↓

fix Use import syntax instead of require.

gotcha mockProvider does not reset between tests automatically; you must call cleanup() in afterEach. ↓

fix Call mockProvider.cleanup() in your test teardown.

Install

npm install noodl-test-utils

yarn add noodl-test-utils

pnpm add noodl-test-utils

Imports

render

wrong

const { render } = require('noodl-test-utils')

correct

import { render } from 'noodl-test-utils'

ESM-only when using TypeScript; CJS require may work but is deprecated.

mockProvider

wrong

import { MockProvider } from 'noodl-test-utils'

correct

import { mockProvider } from 'noodl-test-utils'

The export is camelCase, not PascalCase.

fireEvent

wrong

import fireEvent from 'noodl-test-utils'

correct

import { fireEvent } from 'noodl-test-utils'

fireEvent is a named export, not default.

Quickstart

Renders a Button component from noodl-ui and simulates a click event using fireEvent.

import { render, fireEvent } from 'noodl-test-utils';
import { Button } from 'noodl-ui';

const { getByText } = render(<Button>Click me</Button>);
const button = getByText('Click me');
fireEvent.click(button);
console.log('Button tested');