カスタムプラグインへのプラグインからのモデルまたはコンポーネントのインポート：テスト失敗

開発
1

こんにちは。
Discourse バージョン 3.5.0 を使用しています。
独自のプラグインがあり、Discourse のさまざまな要素をオーバーライドし、独自の機能を追加しています。

このプラグインでは、特にコンポーザーのツールバーにイベント追加アイコンを追加したいと考えています。これを行うには、以下をインポートする必要があります。

  • plugins/discourse-calendar/assets/javascripts/discourse/models/discourse-post-event-event.js にあるモデル DiscoursePostEventEvent

  • plugins/discourse-calendar/assets/javascripts/discourse/components/modal/post-event-builder.js にあるコンポーネント PostEventBuilder

さらに、プラグインの /test ディレクトリの下に機能の統合テストを作成しました。

import { visit } from "@ember/test-helpers";
import { test } from "qunit";
import { acceptance } from "discourse/tests/helpers/qunit-helpers";

acceptance("TOTO", function (needs) {
  test("coopaname integration - composer", async function (assert) {
    await visit("/");
    assert.equal(1, 1, "OK");
  });
});

やりたいことは実現できていますが、インポート方法に関わらずテストが失敗します。

ファイルの先頭でのインポート

ファイルの先頭で import メソッドを使用してモデルとコンポーネントをインポートする場合：

import DiscoursePostEventEvent from "discourse/plugins/discourse-calendar/discourse/models/discourse-post-event-event";
import PostEventBuilder from "discourse/plugins/discourse-calendar/discourse/components/modal/post-event-builder";

実行はすべて問題ありませんが、テストを実行すると実行されません。

image
image967×211 19.2 KB

image
image1070×223 36.8 KB

ファイルの先頭での Require

ファイルの先頭で require メソッドを使用してモデルとコンポーネントをインポートする場合：

const DiscoursePostEventEvent = require("discourse/plugins/discourse-calendar/discourse/models/discourse-post-event-event").default;
const PostEventBuilder = require("discourse/plugins/discourse-calendar/discourse/components/modal/post-event-builder").default;

実行はすべて問題ありませんが、テストを実行すると実行されません。

image
image967×211 19.2 KB

image
image1041×218 29 KB

import の場合と同じ結果になります。

ファイル本文での Require

関数の本文で require メソッドを使用してモデルとコンポーネントをインポートする場合：

import { withPluginApi } from "discourse/lib/plugin-api";

function initializeEventBuilder(api) {
  const DiscoursePostEventEvent =
     require("discourse/plugins/discourse-calendar/discourse/models/discourse-post-event-event").default;
  const PostEventBuilder =
     require("discourse/plugins/discourse-calendar/discourse/components/modal/post-event-builder").default;

  // ... コードの続き
}

export default {
  name: "add-custom-create-event-button",
  initialize(container) {
    withPluginApi(initializeEventBuilder);
  },
};

実行はすべて問題ありませんが、テストを実行すると失敗します。

image
image982×417 65.4 KB

モデルが見つかりませんでした。

要するに、他のプラグインからモデル、コンポーネントなどを正しくインポートする方法を知りたいです。統合テストを実行できるようにしたいのです。
よろしくお願いします！

「いいね！」 2
2

こんにちは @Marine 様

問題は、コードの needs.settings ブロックで間違った設定が使用されていることにあるようです。

acceptance("一部のテスト", function (needs) {
  needs.settings({
    // これでは正しい設定が有効にならず、カレンダープラグインがロードされず、必要なファイルが利用できなくなります
    // discourse_post_event_enabled: true,
    //
    // カレンダーを有効にすると問題が解決します:
    calendar_enabled: true

    our_plugin_enabled: true
  });


  test("テスト", async function (assert) {
    await visit("/");
    assert.equal(1, 1);
  });
});
3

いや、これは真実ではありません。プラグインがイベントフォームをオーバーライドするため、discourse_post_event_enabled を true に設定する必要があります。これにより、プラグインでのインポートが失敗するという最初の状況に戻ります。

何かアイデアはありますか？

4

qunit でプラグインをテストする場合、その特定のプラグインの JS のみが読み込まれます。これにより、複数のプラグインが相互に作用した場合の予期せぬ問題を防ぐことができます。また、プラグインが予期せず他のプラグインに依存することを防ぐのにも役立ちます。

今回のケースでは、その相互作用は意図的なものであり、ユーザーが常に discourse-calendar を有効にすることを期待しているようです。その場合、about.json ファイルに設定を追加することで、独自のプラグインのテストで discourse-calendar の JS を利用できるようになります。以下に例を示します。

^^ この例では discourse-assign を追加しています。あなたのケースでは、discourse-calendar になります。

「いいね！」 4
5

about.json について知らなかったのですが、これで問題が解決しました。あとは、完全に機能するコンテキストを再作成するだけです :wink:

改めて、ありがとうございました！

「いいね！」 2
6

エンドツーエンドテスト用のシステム仕様にも興味があるかもしれません。そうすれば、テストは実際のDiscourseサーバーに対して実行されるため、コアおよび両方のプラグインのすべてのネットワークリクエストを偽装する必要がなくなります。

欠点は、それらがはるかに遅いことです。したがって、可能な限りqunitで単体/コンポーネントテストを維持するのが最善です。

「いいね！」 2
7

ヒントをありがとう！

私はシステム仕様の方がずっと快適です。なぜなら、通常はRSpecやCucumberを使ってRailsアプリをテストしているからです :slight_smile:

テストケースに応じて、QUnitまたはRSpecでテストする価値があるものを確認します。

今のところ、修正したかったフロントエンドのバグを再現できたので、QUnitテストをもう少し掘り下げてみます。

「いいね！」 2