テーマとテーマコンポーネントのエンドツーエンドシステムテスト

ドキュメント 開発者ガイド
,
1

テーマの自動テストを作成することは、テーマ開発プロセスにおいて重要な部分であり、テーマによって導入された機能がコアのDiscourse機能と時間の経過とともにうまく機能し続けることを保証するのに役立ちます。

現在、Discourseはテーマの回帰テストを作成するために2つの方法をサポートしています。1つ目は主にEmberJSの方法に従い、クライアント側のコードのテストのみを含みます。2つ目の方法は、サーバー側とクライアント側の両方のコードを同時にテストできるRailsシステムテストを作成することです。このドキュメントでは、テーマのRailsシステムテストの作成に焦点を当て、テーマ作成者がテーマのテストを作成する際に注力することを推奨するものです。

テーマのRailsシステムテスト

内部的には、DiscourseはRSpecとCapybaraテストフレームワークを使用してRailsシステムテストを実行します。開始するにはRSpecとCapybaraに関する基本的な知識が必要であり、開始する前に以下のリンクを確認することを推奨します。

テーマシステムテスト作成のためのガイドラインとヒント

システムテストを作成する際には、以下のガイドラインに従ってください。

  • システムテストは、テーマディレクトリ内のspec/systemディレクトリに配置されることが想定されています。

  • spec/systemディレクトリ内の各ファイルは、\u003cdescription_of_system_test\u003e_spec.rb形式に従うことが想定されています。

  • トップレベルのRSpec describeブロックには、system: trueメタデータが存在する必要があります。例：

    RSpec.describe "Testing A Theme or Theme Component", system: true do
  it "displays the component" do
    ...
  end
end

  • upload_themeおよびupload_theme_componentヘルパーメソッドが利用可能であり、テストが実行される前に呼び出す必要があります。例：

    RSpec.describe "Testing A Theme or Theme Component", system: true do
  let!(:theme) do
    upload_theme
  end

  # or `upload_theme_component` if your theme is a component
  #
  # let!(:theme_component) do
  #   upload_theme_component
  # end

  it "displays the component" do
    ...
  end
end

  • システムテスト内でthemeオブジェクトに対してupdate_settingメソッドを呼び出し、その後テーマを保存することで、テーマの設定を変更できます。

    例：

    RSpec.describe "Testing A Theme", system: true do
  let!(:theme) do
    upload_theme
  end

  it "does not display the theme when `should_render` theme setting is false" do
    theme.update_setting(:should_render, false)
    theme.save!

    expect(page).not_to have_css("#some-identifier")
  end
end

  • Discourseは、各テストに必要なテストデータを簡単にセットアップできるfabrication gemを使用しています。Discourseコアで利用可能なfabricatorの完全なリストは、テーマのシステムテストでも使用できます。

    例：

    RSpec.describe "Testing A Theme", system: true do
  let!(:theme) do
    upload_theme
  end

  it "displays the theme" do
    user = Fabricate(:user)
    category = Fabricate(:category)
    topic = Fabricate(:topic)
    topic_2 = Fabricate(:topic, title: "This is topic number 2")

    ...
  end
end

  • sign_inヘルパーメソッドを使用して、異なるユーザープロファイルに対してテストを行います。

    例：

    RSpec.describe "Testing A Theme", system: true do
  let!(:theme) do
    upload_theme
  end

  it "does not display the theme for a regular user" do
    user = Fabricate(:user)
    sign_in(user)

    ...
  end

  it "displays the theme for a staff user" do
    admin = Fabricate(:admin)
    sign_in(admin)

    ...
  end
end

  • ページの一部に対するクエリと検査をシステムテストでより簡単かつ再利用可能にしたい場合があります。そのためには、コアで頻繁に見られるPageObjectsの概念を使用できます。

    例：

    # frozen_string_literal: true

module PageObjects
  module Components
    class MyCustomComponent < PageObjects::Components::Base
      COMPONENT_SELECTOR = ".my-custom-component"

      def click_action_button
        find("#{COMPONENT_SELECTOR} .action-button").click
      end

      def has_content?(content)
        has_css?("#{COMPONENT_SELECTOR} .content", text: content)
      end
    end
  end
end

    そして、システムテストファイルの先頭でRubyの組み込みのrequire_relativeを使用してインポートすることで使用できます。

    require_relative "page_objects/components/my_custom_component"

テーマシステムテストの実行

テーマシステムテストは、discourse_theme CLI rubygemを使用して実行でき、これらの手順でインストールできます。

discourse_theme CLIをインストールしたら、テーマディレクトリ内のすべてのシステムテストを次のコマンドで実行できます。

discourse_theme rspec .

新しいテーマのrspecコマンドを初めて実行すると、ローカルのDiscourse開発環境を使用するか、開発環境が設定されたDockerコンテナを使用するかを尋ねられます。経験豊富なDiscourseプラグインまたはテーマ開発者でない限り、すべてがすぐに動作するため、nを選択し、Dockerコンテナを使用してテストを実行することを推奨します。

discourse_theme rspecコマンドは、単一のspecディレクトリ、ファイル、および行番号付きのファイルを実行する機能もサポートしています。

discourse_theme rspec /path/to/theme/spec/system
discourse_theme rspec /path/to/theme/spec/system/my_system_spec.rb
discourse_theme rspec /path/to/theme/spec/system/my_system_spec.rb:12

Headfulモード

デフォルトでは、テーマシステムテストはGoogle Chromeのヘッドレスモードで実行されます。これはブラウザが画面に何も描画しないモードであり、テスト実行をより速く完了させることができます。しかし、作成したシステムテストが何をしているかを確認するために、Google Chromeをヘッドフルモードで使用できると便利な場合があります。このモードを有効にするには、discourse_theme rspecコマンドに--headfulオプションを渡します。

discourse_theme rspec . --headful

上記のコマンドは、テストの実行を視覚的に確認できるヘッドフルモードでシステムテストを実行します。

また、テストケース内でテストの実行を一時停止したい場合は、pause_testヘルパーメソッドを使用して、ブラウザでのアプリケーションの現在の状態を検査できます。

例：

RSpec.describe "Testing A Theme", system: true do
  let!(:theme) do
    upload_theme
  end

  it "displays the theme" do
    visit("/")
    click("#some-button")
    pause_test
    # ...
  end
end

このドキュメントはバージョン管理されています - 変更の提案はgithubで行ってください。

「いいね！」 18
6

コンポーネントのテストでは、通常 let!(:theme_component) の代わりに let!(:theme) が使用されていることに気づきました。たとえば、このテストでは次のようになります。

しかし、ガイドではテーマコンポーネントには let!(:theme_component) を使用することが推奨されています。

このガイドで説明されているように theme_component を使用すべき理由があるのでしょうか？

「いいね！」 2