Package Exports

@1024pix/ember-testing-library
@1024pix/ember-testing-library/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@1024pix/ember-testing-library) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@1024pix/ember-testing-library

The Ember Testing Library is a very lightweight solution for testing Ember components. It provides light utility functions on top of Ember built-in helpers, in a way that encourages better testing practices. Its primary guiding principle is:

The more your tests resemble the way your software is used, the more confidence they can give you.

For more info, please visit testing library guiding principles.

Compatibility

Ember.js v4.12 or above
Ember CLI v4.12 or above
Node.js v18 or above

Installation

ember install @1024pix/ember-testing-library

Usage

Ember testing library gives access to dom testing library queries in an Ember app. For more info on dom testing library queries, follow Testing library doc.

The current API methods that can be used are as follows:

getScreen
within
visit
render
clickByName
clickByText
fillByLabel
selectByLabelAndOption
selectOptionInRadioGroup
getByTextWithHtml
getAllByTextWithHtml
queryByTextWithHtml
queryAllByTextWithHtml
findByTextWithHtml
findAllByTextWithHtml

Please note that Ember Testing Library does not include the userEvent package, and that you should therefore use Ember built-in test helpers to interact with components and/or DOM nodes in integration/acceptance tests.

Acceptance test example:

import { visit } from '@1024pix/ember-testing-library';
import { click } from '@ember/test-helpers';

test('it should disable the button when clicked', async function (assert) {
  // given
  const screen = await visit('/home');

  // when
  const button = screen.getByRole('button', { name: 'Send message' });
  await click(button);

  // then
  assert.dom(button).isDisabled();
});

Integration test example:

import { render } from '@1024pix/ember-testing-library';
import { click } from '@ember/test-helpers';

test('it should disable the button when clicked', async function (assert) {
  // given
  const screen = await render(hbs`<LoginForm />`);

  // when
  const button = screen.getByRole('button', { name: 'Login' });
  await click(button);

  // then
  assert.dom(button).isDisabled();
});

Contributing

See the Contributing guide for details.

License

This project is licensed under the MIT License.