Java의 Playwright 웹 자동화 프레임워크 소개

최근의 한 프로젝트에서, 나는 웹 자동화 프레임워크를 찾고 있다는 것을 발견했다.
다음과 같은 요구 사항이 있습니다.

개발을 위한 프레임워크: 그래서 Cucumber, FitNess 또는 다른 BDD 프레임워크1가 없습니다.

가장 좋은 것은 자바를 바탕으로 하는 것이다. 나는 Robot Framework마븐과 결합하여 사용하는데 집적은 어렵지 않지만 적어도 빈틈이 없다고 할 수 있다.

설치하기 쉽고'빠른'것

무엇이 극작가입니까?
Playwright는 Microsoft에서 만든 새로운 웹 응용 프로그램 프레임워크로 엔지니어가 크로스 브라우저 지원을 사용하여 웹 응용 프로그램을 테스트할 수 있도록 합니다.그들의 안정적인 JavaAPI는 불과 1년 전에 상륙했다.
읽기docs를 통해서만 기능 목록이 매우 방대하다. 다음은 내가 특별히 관련된 몇 가지 기능을 발견한 것이다.

자동 대기 소자

네트워크 차단

음영dom, iframes

등 복잡한 장면 지원

화면 캡처, 비디오 및 전용 브라우저

를 통한 특정 추적 테스트 추적

API 테스트

코드 생성

명세서에 아직 많이 있어요...

WebDriver 및 DevTools 프로토콜
극작가의 특이한 점은 크롬 DevTools 프로토콜CDP을 사용하는 것이다.
일반적으로 Webdriver는 브라우저와 테스트 프레임워크 사이의 중간자 역할을 하는 사실상 표준이다.

DevTools 프로토콜을 사용하면 브라우저를 더욱 직접적으로 제어하고 중간자를 줄일 수 있으며 극작가들이 인터넷과 상호작용(호출을 차단하거나 인터넷 조건을 모의하는 것)을 할 수 있다.
JVM 생태계에서 CDP를 사용하는 유일한 프레임워크로 알고 있습니다.

빠른 테스트
극작가 제공BrowserContexts 기능.이것은 모든 테스트가 서로 격리될 수 있다는 것을 의미한다. 마치 모든 옵션이 새로운 익명 모드에 있는 것처럼.
같은 브라우저 실례를 공유함으로써, 우리는 비싼 브라우저 실례를 지불하지 않고 테스트 세트의 속도를 높일 수 있다.

// Create a new incognito browser context
BrowserContext context = browser.newContext();
// Create a new page inside context.
Page page = context.newPage();

어디서부터 시작할까요?
프로젝트에 최신 의존항을 추가하는 것부터 시작합시다.

<dependency>
  <groupId>com.microsoft.playwright</groupId>
  <artifactId>playwright</artifactId>
  <version>${playwright.version}</version>
</dependency>

다음 부분에서 우리는 내가 가장 좋아하는 기능에 대해 토론할 것이다.

코드 생성
나는 가장 간단한 입문 방법이 반코드 생성 도구를 사용하는 것이라고 발견했다.

# At the root of your project
mvn exec:java -e "-Dexec.mainClass=com.microsoft.playwright.CLI" "-Dexec.args=codegen https://google.com"

이 명령은 필요한 브라우저를 모두 다운로드합니다corporate proxy.
그리고 테스트 옵션과 작가 검사기를 열어 주어진 사용자와 상호작용하는 코드를 생성합니다
(OAuth 인증까지).

내가 최근에 인터넷 테스트 프레임워크를 접하지 않아서 그런지 깜짝 놀랐다🔥 2 .
코드 생성 도구에서 이득을 보고 필요에 따라 기본 코드를 재구성하고 필요한 단언이나 재구성을 추가하며 Page Object Model를 통해 읽을 수 있는 추상적인 추상을 만들 수 있을 때 개발자 체험이 좋습니다.

네트워크 차단
테스트에서 요청을 처리하여 API 끝점을 시뮬레이션할 수 있습니다.

// Using custom testData to as a response to this API call
page.route("**/api/fetch_data", route -> route.fulfill(new Route.FulfillOptions()
  .setStatus(200)
  .setBody(testData)));

page.navigate("https://example.com");

아날로그 (이 예는 메모리 루트) 는 제어할 수 없는 프로세스의 외부 의존 항목에 매우 유용합니다.

Note: while writing this article I came across an excellent post describing when to mock,
clarifying also many related terms.

추적하다.
마지막으로 테스트 스크립트 추적 가능성을 만드는 것을 정말 좋아합니다.

Browser browser = chromium.launch();
BrowserContext context = browser.newContext();

// Setup tracing options
context.tracing().start(new Tracing.StartOptions()
        .setScreenshots(true)
        .setSnapshots(true));
Page page = context.newPage();

page.navigate("https://playwright.dev");
context.tracing().stop(new Tracing.StopOptions().setPath(Paths.get("trace.zip")));

생성된 zip 파일은 명령줄에서 볼 수 있습니다.

mvn exec:java -e "-Dexec.mainClass=com.microsoft.playwright.CLI" "-Dexec.args=show-trace target/trace.zip"

또는 https://trace.playwright.dev/에 업로드합니다.

위 부분에서 테스트 시간표를 볼 수 있습니다

왼쪽과 가운데에서 테스트 중인 모든 동작을 볼 수 있습니다.

및 동작 전후 추가 화면 캡처

동작이 발생하는 위치를 가리키는 작은 붉은 점까지 볼 수 있다(예를 들어 클릭한 버튼)

오른쪽 부분에서 네트워크 호출, 컨트롤러 로그 및 테스트 스크립트 소스 코드

를 볼 수 있습니다.
조심해.불다🤯

결론
지금까지 극작가에 대한 좋은 개술과 무엇을 해줄 수 있을지 기대가 됩니다.
우리는 표면에만 닿았지만, 여기는 약간의 배달이 있었다

위대한 브라우저, 운영체제, 언어 라이브러리

java

의 간단한 설정과 좋은 개발 체험

완전한 API와 훌륭한 도구입니다.

이것은 나로 하여금 웹 자동화 프레임워크와 조화롭게 할 수 있다. 누가 생각하겠는가!
UI 테스트에서 사용하지 않아도 됩니다. API를 요청하면 REST 호출을 자동으로 실행하여 수동 테스트(예를 들어 정기적으로 재설정된 스테이지 환경이 있는 경우)를 위해 시스템을 준비하고 교체할 수 있습니다.아니면 API를 테스트하기만 하면, 만약 이것이 당신의 요구에 부합된다면.
나는 유일하게 부족한 키가 좋은 보고 출력이라는 것을 발견했다. 이것은 node 실현에만 존재한다.
PlaytWright와 Junit5와 Allure Reporting 프레임워크를 통합한 프로젝트 (코드는 Github https://github.com/mikomatic/playwright-demo 에서 사용할 수 있지만, 기존의 보고 도구는 이 불가사의한 도구를 더욱 강하게 만들 수 있다.

한층 더 읽다

Playwright vs WebDriver: the future of web-automation

Playing with Playwright

사실 나는 행위 구동 개발 테스트 프레임워크를 더 이상 믿지 않는다.나는 anti-patterns와 잘못된 소통을 자주 본다.업무에 대한 우호적인 추상적이고 은밀한 추가 작업 - 인간이 읽을 수 있는 장면을 자바 코드로 바꾸는 것은 내가 만나는 대부분의 상황에서 가치가 없다.생각을 바꿔라!  ↩
내가 발견한 흥미로운 점은 극작가가 aria-label와 text 속성에 더 의존하는 것 같다는 것이다ìd.이것이 사실인지 아닌지, 아니면 왜 사실인지 확실하지 않습니까?  ↩