사용자 인터페이스 자동화의 과제: 새로운 접근 방식

이전 블로그에서 본 선택기 기반 접근 방식을 사용한 자동화는 HTML과 같은 구조를 기반으로 하는 UI를 자동화하는 입증된 방법입니다. 우리의 Git repository을 가지고 놀았다면 테스트 실행이 얼마나 빨리 실행되는지 알았을 것입니다.

이 블로그에서는 선택기 기반 접근 방식에서 발생하는 문제와 현재 도구가 스마트 선택기 및 자가 치유 테스트를 통해 문제를 해결하는 방법에 대해 설명합니다.

선택자 기반 접근법의 문제점

테스트 중인 코드와 테스트 코드의 구조를 자세히 살펴보면 이 둘이 서로 얽혀 있음을 알 수 있습니다. 이로 인해 대규모 테스트 스위트에 문제가 발생합니다.

Every change in the code under test can lead to changes in the structure (HTML) under test causing tests to fail. That is why large UI test suites usually become flaky.

결과 HTML이 구성되는 방식에 제약을 가하는 강력한 엔지니어링 문화를 통해 이 문제를 해결할 수 있습니다. 모든 요소에 ID를 넣는 것도 유효한 솔루션입니다. 그러나 주요 문제는 남아 있습니다. 테스트 중인 코드를 테스트 코드와 결합하고 있습니다!

스마트 선택기

Smart Selector는 테스트 코드와 테스트 중인 코드의 긴밀한 결합에 대한 솔루션을 약속합니다.

아래 그림과 같이 잘못된 라벨링으로 인해 요소를 감지할 수 없는 경우에도 성공할 수 있는 자가 치유 테스트를 구현하는 데 도움이 됩니다(버튼의 id는 signIn이어야 하지만 anmelden으로 변경됨).

실수로 anmelden으로 이름이 변경되었기 때문에 id-selector signIn이 요소를 찾지 못합니다.

다음 세 가지 접근 방식을 따르며 실제로 요소를 안정적으로 인식하기 위해 실제로 고전적인 선택기와 결합하는 경우가 많습니다.

광학 문자 인식(OCR)

OCR은 이미지에서 텍스트를 인식하는 것입니다. 이 기술은 오랫동안 다양한 사용 사례에 사용되었으며 이제 UI 자동화 도구에서도 자리를 잡았습니다.

Apple의 다른 잘못된 철자가 인식됩니다.

PIP 검색

PIP(Picture-in-Picture) 검색은 픽셀 매칭을 통해 UI에서 잘라낸 요소를 검색하는 것을 말합니다. 요소는 일반적으로 잘라내어 이미지로 저장됩니다. 테스트에서 이 요소를 선택하려는 경우 그림이 전체 UI에서 실행되고 컷아웃 그림과 실제 UI가 일치하는지 테스트합니다.

잘라낸 그림이 있는 로그인 버튼을 감지합니다.

처지

새로운 접근 방식은 Selenium 4에도 도입된 상대 위치 지정자입니다. 기능은 간단합니다. 요소를 직접 선택하는 대신 다른 요소와의 관계를 통해 처리됩니다.



예를 들어 사용자 이름에 대한 텍스트 필드는 다음 예와 같이 로그인 버튼과의 관계로 찾을 수 있습니다.



오픈 소스 라이브러리Taiko는 관계를 기반으로 요소를 감지할 수 있습니다.

await write("TaikoUser", into(textBox(toLeftOf('Login'))));

Git Repository에서 전체 예제를 찾을 수 있습니다.

자가 치유 테스트는 좋은 생각입니까?

자가 치유 테스트는 이론상 훌륭하게 들립니다. 그러나 그것은 우리가 보기에 양날의 검입니다. 불안정한 테스트의 고통을 덜어주지만 두 가지 주의 사항이 있습니다.

백업 단계를 구현하고 유지 관리해야 합니다

.

실패할 수 있는 테스트가 녹색으로 남아 실제 오류를 가릴 수 있음

💡 따라서 이 기술을 배포할 때는 의식하고 숙고하세요.

결론

스마트 선택기는 테스트 중인 코드(HTML)의 구조에만 의존하지 않는 기술을 사용하여 보다 강력한 테스트를 작성하는 데 도움이 될 수 있습니다.

OCR, Picture-in-Picture 검색 및 관계형 선택기는 오늘날 도구에서 사용할 수 있으며 최근에는 기계 학습/AI와 결합되어 대규모 테스트 스위트를 유지 관리하는 수고를 덜었습니다.

시리즈의 마지막 회에서는 2D 평면 및 캔버스와 같이 현재 테스트할 수 없는 사용자 인터페이스를 살펴보고 최첨단 및 미래 제품이 이러한 사용 사례에 대한 UI 자동화를 어떻게 가능하게 하는지 보여줍니다.

Do you want to know more about UI automation's future or general automation tools? Join our Discord community to discuss all things automation!