Migration Guide Capybara → Chemlab
주어진 뷰:
_form.html
<form id="my-form">
<label for="first-name">이름</label>
<input type="text" name="first-name" data-testid="first_name" />
<label for="last-name">성</label>
<input type="text" name="last-name" data-testid="last_name" />
<label for="company-name">회사 이름</label>
<input type="text" name="company-name" data-testid="company_name" />
<label for="user-name">사용자 이름</label>
<input type="text" name="user-name" data-testid="user_name" />
<label for="password">암호</label>
<input type="password" name="password" data-testid="password" />
<input type="submit" value="계속" data-testid="continue"/>
</form>
Capybara | Chemlab |
---|---|
주요 차이점
페이지 라이브러리 디자인 vs 페이지 오브젝트 디자인
기존 프레임워크에 구현된 페이지 오브젝트는 요소에 작업을 수행하기 위해 메서드를 정의해야 합니다. (일반적으로 한 줄로)
def set_first_name(first_name)
fill_element(:first_name, first_name)
end
def click_continue
click_element(:continue)
end
it '이름을 설정하고 계속 클릭' do
Page::Form.perform do |form|
form.set_first_name('이름')
form.click_continue
end
end
페이지 라이브러리는 페이지 요소를 기반으로 메서드를 제공하여 추가 메서드를 불필요하게 만들어 더 효율적으로 만듭니다.
it '이름을 설정하고 계속 클릭' do
Page::Form.perform do |form|
form.first_name = '이름' # first_name 설정
form.continue # 계속 클릭
end
end
Capybara를 사용하여 ‘이름’ 필드의 텍스트를 확인해야 한다면 고려해야 합니다. 우리는 텍스트를 가져오기 위해 한 줄을 추가해야 합니다:
def get_first_name
find_element(:first_name).text
end
Page::Form.perform do |form|
form.set_first_name('이름')
expect(form.get_first_name).to eq('이름')
form.click_continue
end
대신, 페이지 라이브러리는 페이지 요소에서 메서드를 자동으로 생성하므로, 스스로 메서드를 정의할 필요 없이 first_name
을 호출하여 텍스트를 가져올 수 있습니다.
Page::Form.perform do |form|
form.first_name = '이름'
expect(form.first_name).to eq('이름')
form.continue
end
요소 네이밍 규칙
페이지 라이브러리에서 요소 유형이 보존되므로, data-testid에 _field
또는 _button
접미사를 지정할 필요가 없습니다.
<!-- 이전 -->
<input type="text" name="first-name" data-testid="first_name_field" />
<input type="submit" name="continue" value="계속" data-testid="continue-button" />
<!-- 이후 -->
<input type="text" name="first-name" data-testid="first_name" />
<input type="submit" name="continue" value="계속" data-testid="continue" />
이로써 개발자가 테스트를 작성하는 것이 더 쉬워지며, UI를 볼 때 페이지 라이브러리를 작성할 수 있어 테스트 가능성에 기여합니다.