DequeのAgoraからNode.js用Axe DevToolsをインストールする

内部アーティファクトリポジトリを持たないお客様で、Axe DevToolsを直接ダウンロードするよりも持続可能でスケーラブルなインストール方法を希望する場合、Dequeは選ばれたお客様に自身のアーティファクトリポジトリを提供しています。このガイドでは、DequeのAgoraアーティファクトリポジトリからAxe DevTools Node.jsパッケージをインストールする方法について説明します。Axe DevToolsをインストールする他の方法についての情報は、アーティファクトリポジトリからのインストールをご覧ください。

前提条件

AgoraからAxe DevToolsをインストールするには、Agoraのログイン情報が必要です。また、Axe DevToolsをインストールするための既存のNode.jsベースのウェブプロジェクトも必要です。お客様のテスト環境の構成によっては、テストライブラリ（例えば、Cypress、Playwright、Puppeteer、WebdriverIO、WebDriverJS）が追加の依存関係として必要になることがあります。

アイデンティティトークンの作成

アイデンティティトークンを作成する最も簡単な方法は、Agoraウェブアプリを使用することです。ログイン後、ヘルプボタンの横にあるトップバーでようこそ あなたのメールアドレスとラベル付けされたボタンをクリックすると、アイデンティティトークンを作成できます。そこから、あなたのアイデンティティトークンを作成してコピーできます。

認証の追加

npmまたはYarnを通じてAxe DevToolsパッケージにアクセスするには、Agora認証情報を~/.npmrcファイルに追加する必要があります。Agoraパッケージへのアクセスを設定するツールは、Agoraのメールアドレスとアイデンティティトークンからこの.npmrcコンテンツを生成できます。それ以外では、手動で行う最も簡単な方法はcurlコマンドを使用することです。

curl -u "your-email:your-identity-token" "https://agora.dequecloud.com/artifactory/api/npm/auth"

このコマンドを実行する際は、your-emailをAgoraのログインメールに置き換え、your-identity-tokenを前のステップでコピーしたアイデンティティトークンに置き換えてください。引用符はそのままにし、置き換えた値の周りに山括弧を追加しないでください。ほとんどのシェルでは、<と>はリダイレクト演算子であるため、これらを残すとコマンドは誤解を招くエラーで失敗します。コマンドの戻りは次のようになります:

_auth = <generated-auth-string>
always-auth = true
email = <your-email>

.npmrcファイルの設定（yarn/npm）

~/.npmrcファイルを開いて編集します。最初にレジストリ情報を追加し、次にcurlコマンドの出力を追加します。最終的な結果は次のようになります:

@axe-devtools:registry=https://agora.dequecloud.com/artifactory/api/npm/devtools-npm/
//agora.dequecloud.com/artifactory/api/npm/devtools-npm/:_auth=<generated-auth-string>
//agora.dequecloud.com/artifactory/api/npm/devtools-npm/:email=<your-email@email.com>
//agora.dequecloud.com/artifactory/api/npm/devtools-npm/:always-auth=true

.yarnrc.ymlファイルの設定（yarn modern）

~/.yarnrc.ymlファイルを開いて編集します。最初にレジストリ情報を追加し、次にcurlコマンドの出力を追加します。最終的な結果は次のようになります:

npmScopes:
  axe-devtools:
    npmRegistryServer: 'https://agora.dequecloud.com/artifactory/api/npm/devtools-npm/'
    npmAlwaysAuth: true
    npmAuthIdent: <generated-auth-string>

curlコマンドを実行できない場合は、Agoraのメールアドレスとアイデンティティトークンをyour-email:your-identity-token形式でbase-64エンコードして認証文字列を生成し、その結果をcurlコマンドで生成したかのように~/.npmrcファイルに追加できます。

インストール

認証が設定されると、テストライブラリ用のパッケージをインストールしてください。

ブラウザ JavaScript (@axe-devtools/browser)

npm install @axe-devtools/browser

インストールが完了したら、パッケージのインポートおよび初期化について説明しているテストの作成をお読みください。

Cypress (@axe-devtools/cypress)

npm install @axe-devtools/cypress

Cypress自体をまだインストールしていない場合は、次のコマンドでインストールできます

npm install cypress

Playwright (@axe-devtools/playwright)

npm install @axe-devtools/playwright

Playwright自体をまだインストールしていない場合は、次のコマンドでインストールできます

npm install playwright

インストールが完了したら、パッケージのインポートおよび初期化について説明しているテストの作成をお読みください。

Puppeteer (@axe-devtools/puppeteer)

npm install @axe-devtools/puppeteer

Puppeteer自体をまだインストールしていない場合は、次のコマンドでインストールできます

npm install puppeteer

インストールが完了したら、パッケージのインポートおよび初期化について説明しているテストの作成をお読みください。

WebdriverIO (@axe-devtools/webdriverio)

npm install @axe-devtools/webdriverio

インストールが完了したら、パッケージのインポートおよび初期化について説明しているテストの作成をお読みください。

WebDriverJS (@axe-devtools/webdriverjs)

npm install @axe-devtools/webdriverjs

インストールが完了したら、パッケージのインポートおよび初期化について説明しているテストの作成をお読みください。

次のステップ

Axe DevToolsのインストールに問題がある場合は、直接Dequeの担当者に連絡するか、当社のサポートデスクでお問い合わせいただくか、メールを送るしてください。スムーズにセットアップできるようお手伝いいたします。