테마 및 테마 컴포넌트의 끝에서 끝 시스템 테스트

문서 개발자 가이드
,
1

테마에 대한 자동화 테스트 작성은 테마 개발 프로세스에서 중요한 부분이며, 테마가 도입하는 기능이 Discourse의 핵심 기능과 함께 시간이 지나도 잘 작동하도록 하는 데 도움이 될 수 있습니다.

현재 Discourse는 테마에 대한 회귀 테스트를 작성하는 두 가지 방법을 지원합니다. 첫 번째 방법은 주로 EmberJS의 방식을 따르며, 클라이언트 사이드 코드만 테스트하는 것을 포함합니다. 두 번째 방법은 Rails 시스템 테스트를 작성하는 것으로, 서버 사이드 코드와 클라이언트 사이드 코드를 동시에 테스트할 수 있습니다. 이 문서는 테마에 대한 Rails 시스템 테스트 작성에 초점을 맞출 것이며, 테마 작성자들도 테마 테스트를 작성할 때 이 부분에 집중하는 것을 권장합니다.

테마를 위한 Rails 시스템 테스트

내부적으로 Discourse는 Rails 시스템 테스트를 실행하기 위해 RSpec과 Capybara 테스트 프레임워크를 사용합니다. 시작하려면 RSpec과 Capybara에 대한 기본 지식이 필요하며, 시작하기 전에 다음 링크를 먼저 읽어보기를 권장합니다:

테마 시스템 테스트 작성 가이드라인 및 팁

시스템 테스트를 작성할 때 따를 가이드라인은 다음과 같습니다:

  • 시스템 테스트는 테마 디렉터리 내의 spec/system 디렉터리에 위치해야 합니다.

  • spec/system 디렉터리 내의 각 파일은 <description_of_system_test>_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

  # 또는 테마가 컴포넌트인 경우 `upload_theme_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 명령은 단일 스펙 디렉터리, 파일 및 라인 번호가 포함된 파일 실행도 지원합니다.

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

헤드풀 모드

기본적으로 테마 시스템 테스트는 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

I noticed that usually in the tests for components, let!(:theme) is used instead of let!(:theme_component). For example, in this test:

However the guide suggests using let!(:theme_component) for theme components:

Is there a reason why I should use theme_component as it’s described in this guide?

2개의 좋아요