testing-library-selector

testing-library-selector 是一个用于 @testing-library 的库，提供可重用的选择器。用 typescript 编写。

npm
Yarn

npm install --save-dev testing-library-selector

yarn add --dev testing-library-selector

import {byLabelText, byRole, byTestId} from './selector'

// define reusable selectors
const ui = {
  container: byTestId('my-container'),
  submitButton: byRole('button', {name: 'Submit'}),
  usernameInput: byLabelText('Username:'),

  // can encode more specific html element type
  passwordInput: byLabelText<HTMLInputElement>('Password:'),
}

// reuse them in the same test or across multiple tests by calling
// .get(), .getAll(), .find(), .findAll(), .query(), .queryAll()
it('example test', async () => {
  // by default elements will be queried against screen
  await ui.submitButton.find()
  expect(ui.submitButton.query()).not.toBeInDocument()
  expect(ui.submitButton.get()).toBeInDocument()

  const containers = ui.container.getAll()
  expect(containers).toHaveLength(3)

  // provide a container as first param to query element inside that container
  const username = ui.usernameInput.get(containers[0])
})

GitHub 上的 testing-library-selector