【Rspec】SystemSpecにてwithin〜do~end テスト対象の範囲を絞る

目的

システムスペックテストコードで
it ~ do ~以降のテストコード内にある「within ~ do ~ end」 の部分について入口だけでも理解したい。

テストコード確認

以下のシステムスペックのテストコードについて調べる。
これはタグのページでパンくず🍞を設定したので、それに関するテストの一部。

spec/system/tags_spec.rb

require 'rails_helper'

RSpec.describe 'Tags', type: :system do
  let(:user) { create :user }
  before do
    login(user)
  end
  describe '記事に紐付くタグの一覧画面' do
    it 'Home > 「記事」というパンくずが表示されていること' do
      visit tags_path
      within('.breadcrumb') do
        expect(page).to have_content('Home'), '「Home」というパンくずが表示されていません'
        expect(page).to have_content('記事'), '「記事」というパンくずが表示されていません'
      end
    end

 # -- 以下省略 --

within ~ do ~ end とは？？

witin ⇒ 直訳すると「〜内」「以内」という意味。
つまり、テスト対象の範囲を指定するために使う！

改めてコードを見てみる。

describe '記事に紐付くタグの一覧画面' do
    it 'Home > 「記事」というパンくずが表示されていること' do
      visit tags_path
      within('.breadcrumb') do
        expect(page).to have_content('Home'), '「Home」というパンくずが表示されていません'
        expect(page).to have_content('記事'), '「記事」というパンくずが表示されていません'
      end
    end

「within('.breadcrumb') do」 となっている。
これは
「CSSクラス名が'breadcrumb'の要素内でのみ検索・操作を行う」 ということ。
つまり
「パンくずリスト🍞（'.breadcrumb'クラス要素）の部分だけをテスト対象の範囲にしている」 ということ！！

なぜ範囲指定したのか？

今回のテストは画面上にパンくずを実装できたかを確認するためのもの。
そのため、単にexpect(page).to hame_content('タグ名')としてしまうと、Rspec上ではページ全部から「タグ名」を探してしまい正確性に欠けてしまう。
そのため、タグの部分だけにテスト範囲を絞る必要があった。

最後に

Rspecについてはまだまだ勉強中なので、手を動かしながら少しずつ覚えていきたいです。

以上！