前回のチュートリアル: Developing Discourse Plugins - Part 5 - Add an admin interface
Discourseには、コードベース用の大規模なテストスイートが2つあることをご存知ですか？サーバー側では、Rubyコードにrspecを使用したテストスイートがあります。ブラウザアプリケーションでは、ember-testingを含むqunitスイートを使用しています。
開発環境が設定されていると仮定すると、http://localhost:3000/testsというURLにアクセスすると、ブラウザでJavaScriptのテストスイートを実行し始めます。面白い点の一つは、右下のミニチュアウィンドウでアプリケーションのテストが実行されているのを見ることができることです：
Discourseアプリケーションは、/tests URLにアクセスすると実行を開始する大量のテストで構築されています。そのため、作業中のプラグインでテストをフィルタリングすると役立つかもしれません。インターフェースでプラグインドロップダウンをクリックし、プラグインを選択することで、これを行うことができます：
プラグインに受け入れテストを追加する
まず、Discourseの最新バージョンをチェックアウトしていることを確認してください。プラグインから受け入れテストを実行できるのは比較的最近の機能であり、最新バージョンをチェックアウトしないとテストが表示されません。
この記事では、このシリーズの第5部で作成したpurple-tentacleプラグインの受け入れテストを作成します。
受け入れテストを追加するのは、プラグインに1つのファイルを追加するだけです。以下を作成します：
test/javascripts/acceptance/purple-tentacle-test.js
import { acceptance, exists } from "discourse/tests/helpers/qunit-helpers";
import { click, visit } from "@ember/test-helpers";
import { test } from "qunit";
acceptance("Purple Tentacle", function (needs) {
needs.settings({ purple_tentacle_enabled: true });
needs.user();
test("Purple tentacle button works", async function (assert) {
await visit("/admin/plugins/purple-tentacle");
assert.ok(exists("#show-tentacle"), "it shows the purple tentacle button");
assert.ok(!exists(".tentacle"), "the tentacle is not shown yet");
await click("#show-tentacle");
assert.ok(exists(".tentacle"), "the tentacle wants to rule the world!");
});
});
テストを明確に書くように努めましたが、受け入れテストを書いたことがない人には少し混乱するかもしれません。受け入れテストについて多くの優れた情報があるので、Emberのドキュメントを読むことを強くお勧めします。
各テストで、何かをassertする必要があります。私たちのテストでは、触手が最初に隠されており、ボタンをクリックした後に表示されるかどうかを確認するためにいくつかの断言を行います。
断言を行う前に実行する一連のアクションを定義する必要があります。これを行うためにawaitキーワードを使用します。このキーワードを使用すると、各非同期ヘルパーの実行が完了するのを待ちます。
最初の重要なアクションは：await visit("/admin/plugins/purple-tentacle");です。これは、テストにアプリケーション内のそのURLに移動するように指示します。そのURLは触手を表示するものでした。
紫色の触手ボタンが表示されるページを訪れた後、ページにボタンが存在し、触手の画像はまだ存在しないことを確認します。
これは以下の断言によって行われます：
assert.ok(exists("#show-tentacle"), "it shows the purple tentacle button");
assert.ok(!exists(".tentacle"), "the tentacle is not shown yet");
P.S. 以前のバージョンのpurple-tentacleプラグインには、handlebarsテンプレートに#show-tentacle要素IDがありませんでした。追従するには最新バージョンをチェックアウトしてください！
これらのテストがパスしたら、インタラクションをテストする時間です。
次のコマンドはawait click('#show-tentacle');で、これはテストフレームワークにボタンをクリックして触手を表示したいことを伝えます。
ボタンをクリックをシミュレートした後、触手が表示されるかどうかを次のように断言して確認できます：
assert.ok(exists(".tentacle"), "the tentacle wants to rule the world!");
それほど悪くないでしょう？開発マシンでhttp://localhost:3000/tests?qunit_single_plugin=purple-tentacle&qunit_skip_core=1にアクセスして、自分でテストを試すことができます。すぐに紫色の触手が表示され、すべてのテストがパスするはずです。
PhantomJSを使用してコマンドラインでプラグインのqunitテストを実行したい場合は、以下を実行できます：
rake plugin:qunit['purple-tentacle']
（purple-tentacleはプラグインのフォルダ名です）
テストのデバッグ
プラグインを作成する際に、テストはプラグイン内の問題を特定するのに役立ちます。テストを開発している間や、プラグインのコードを変更すると、テストが失敗する可能性があります。その理由を理解するために、Emberにはいくつかの便利なヘルパーがあります：pauseTest()とresumeTest()。
これらを利用するには、テストを一時停止したい箇所にawait pauseTest()を追加します。これで、ブラウザでテストを実行すると、pauseTest()を追加した箇所でテストが自動的に一時停止します。これにより、ページを検査したり、エラーを表示したりして、問題をデバッグするための機会が得られます。
从这里开始
繰り返しになりますが、Emberのドキュメントのテストに関する内容は優れています。また、javascriptテストディレクトリのテストを閲覧して、Discourseがどのようにしてさまざまな機能をテストしているかを確認することもできます。そこには学ぶことができる多くの例があります。
楽しいテストを！
シリーズの続き
Part 1: Plugin Basics
Part 2: Plugin Outlets
Part 3: Site Settings
Part 4: git setup
Part 5: Admin interfaces
Part 6: This topic
Part 7: Publish your plugin
このドキュメントはバージョン管理されています - 変更をgithubで提案してください。
it is an Admin page
)