Playwright TestとTypeScriptの手順

This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard

Playwright TestとTypeScriptでテストを設定する

Not for use with personal data

  1. テストフォルダのルートレベルで、@axe-core/watcherパッケージとそのすべての依存関係をnpmまたはお好みのパッケージマネージャー（例えば、yarnやpnpm）を使用してインストールします。

    npm install --save-dev @axe-core/watcher

  2. 既存のPlaywright Testのテストの横にfixtures.tsファイルを作成します。このファイルで、@axe-core/watcherからplaywrightTest()関数をインポートします。

    import { playwrightTest } from '@axe-core/watcher/playwright-test'

const ACCESSIBILITY_API_KEY = process.env.ACCESSIBILITY_API_KEY
const PROJECT_ID = process.env.PROJECT_ID
const SERVER_URL = process.env.SERVER_URL

const { test, expect } = playwrightTest({
  axe: {
    apiKey: ACCESSIBILITY_API_KEY,
    projectId: PROJECT_ID,
    serverURL: SERVER_URL
  },
  headless: false
  // Any other Playwright configuration you’d pass to chromium.launchPersistentContext() here
})

export { test, expect }

    ACCESSIBILITY_API_KEYとPROJECT_IDを環境で設定し、個人用APIキー（axeアカウント内の**API KEYS**タブで見つかります）とプロジェクトID（プロジェクト作成時の手順の最上部か、プロジェクトページで**設定**の下にある**プロジェクトを設定**を選択して取得可能）にしてください。組織が地域的、プライベートクラウド、またはオンプレミスのAxe Developer Hubインスタンスを使用している場合は、そのインスタンスのベースURLをSERVER_URLに設定します（例: https://axe-eu.deque.com）。そうでない場合は、SERVER_URLを省略し、デフォルトのhttps://axe.deque.comが使用されます。

  3. テストファイル内では、Playwright Testからtestとexpectのインポートを、あなたのfixtures.tsファイルに置き換えます。

    import { test, expect } from '@playwright/test'

// Becomes:
import { test, expect } from './fixtures';

  4. これで完了です。

Is this page helpful?

Help us improve this page

Still need help?