メインコンテンツにスキップ

設定オプション

はじめに​

ライブラリは `configure` 関数で設定できます。この関数は以下の引数を受け取ります。

  • プレーンな JS オブジェクト：既存の設定にマージされます。例： `configure({testIdAttribute: 'not-data-testid'})`
  • 関数：関数は既存の設定を受け取り、上記のようにマージされるプレーンな JS オブジェクトを返します。例： `configure(existingConfig => ({something: [...existingConfig.something, 'something 配列に追加する値']}))`

注意

React Testing Library のようなフレームワーク固有のラッパーは、以下に示すオプションに加えて、さらにオプションを追加する場合があります。

setup-tests.js
import {configure} from '@testing-library/dom'
import serialize from 'my-custom-dom-serializer'

configure({
  testIdAttribute: 'data-my-test-id',
  getElementError: (message, container) => {
    const customMessage = [message, serialize(container.firstChild)].join(
      '\n\n',
    )
    return new Error(customMessage)
  },
})

オプション​

`computedStyleSupportsPseudoElements`​

`window.getComputedStyle` が擬似要素（つまり、2 番目の引数）をサポートしている場合は、`true` に設定します。ブラウザで testing-library を使用している場合は、ほとんどの場合、これを `true` に設定する必要があります。非常に古いブラウザ（IE 8 以前など）のみがこのプロパティをサポートしていません。ただし、`jsdom` は現在、2 番目の引数をサポートしていません。これには、`16.4.0` より前のバージョンの `jsdom` と、2 番目の引数を指定して `getComputedStyle` を呼び出したときに `not implemented` 警告をログに記録するバージョン（例：`window.getComputedStyle(document.createElement('div'), '::after')`）が含まれます。デフォルトは `false` です。

`defaultHidden`​

`getByRole` で使用される `hidden` オプションのデフォルト値。デフォルトは `false` です。

`defaultIgnore`​

`getByText` で使用される `ignore` オプション のデフォルト値。エラーが出力される際に無視されるノードも決定します。

デフォルトは `script, style` です。

`showOriginalStackTrace`​

デフォルトでは、`waitFor` は、Testing Library によってスローされたエラーのスタックトレースがクリーンアップされ、短縮されるため、エラーの原因となったコードの部分を簡単に特定できます（非同期スタックトレースはデバッグが困難です）。これを無効にする場合は、`showOriginalStackTrace` を `false` に設定します。 `waitFor` に渡すオプションで、特定の呼び出しに対してこれを無効にすることもできます。

`throwSuggestions` (実験的)​

有効にすると、より適切なクエリ が使用可能な場合、テストは失敗し、代わりに使用するクエリが提案されます。デフォルトは `false` です。

単一のクエリの提案を無効にするには、オプションとして `{suggest:false}` を追加します。

screen.getByTestId('foo', {suggest: false}) // will not throw a suggestion
注意

このオプションが有効になっている場合、直感的な実装が不足している提案が提供される場合があります。通常、これは名前を付けることができないロール、特に段落で発生します。たとえば、`getByText` を使用しようとすると、次のエラーが発生する可能性があります。

TestingLibraryElementError: A better query is available, try this:
    getByRole('paragraph')

ただし、`getByRole('paragraph', { name: 'Hello World' })` のように、config オブジェクトパラメータを使用して段落をクエリする直接的な方法はありません。

この問題に対処するには、以下の例に示すように、カスタム関数を利用して要素の構造を検証できます。詳細については、GitHub の issue を参照してください。

getByRole('paragraph', {
  name: (_, element) => element.textContent === 'Hello world',
})

`testIdAttribute`​

`getByTestId` および関連クエリで使用される属性。デフォルトは `data-testid` です。

`getElementError`​

get または find クエリ が失敗した場合に使用されるエラーを返す関数。エラーメッセージとコンテナオブジェクトを引数として取ります。

`asyncUtilTimeout`​

`waitFor` ユーティリティで使用されるグローバルタイムアウト値（ミリ秒）。デフォルトは 1000ms です。