테스트가 중요합니다. 전체 사이트, 애플리케이션, 새 기능 등 빌드한 콘텐츠를 사용자에게 전달하기 전에 이 단계가 예상대로 작동하는지 확인하는 중요한 단계입니다. 그러나 많은 테스트가 여전히 수동으로 이루어지고 동료나 테스트 엔지니어가 새로운 기능을 확인하고 문제를 보고하도록 요청했습니다.
이러한 수동 테스트로 특정 종류의 문제가 나타날 수 있지만 그 이상은 놓칠 수 있습니다. 테스트를 수행하는 사람은 특이 사례를 놓치거나 앱을 통한 특정 여정을 완전히 테스트하지 못할 수 있습니다. 또한 코드를 작성할 때 확보한 모든 정보를 얻지는 못하며 개발자가 방지하도록 코드로 포함한 구체적인 문제에 관해 알지 못합니다. 시간이 지나고 새로운 기능이 추가되면 변경사항으로 인해 손상되지 않았는지 확인하기 위해 이전에 작동하던 모든 기능을 다시 테스트하여 확인할 수 있을까요?
그래서 Chrome팀은 자동화된 테스트의 중요성을 믿습니다. 기능에 손상이 있는지 안정적이고 반복적으로 테스트하는 테스트 모음을 사용하면 현재와 향후 개발 후에 모든 사소한 세부사항을 테스트할 수 있습니다. 기능 개발자로서의 지식은 테스트에서 캡슐화됩니다.
하지만 자동화된 테스트가 어려울 수 있다는 것도 알고 있습니다. 따라서 Chrome팀은 원활한 작업을 위해 다음과 같은 도구와 안내를 제공합니다.
인형 조종자
Puppeteer는 Node.js 라이브러리입니다. 사용하기 쉬운 상위 수준 API로 Chrome, Chromium, Firefox를 자동화할 수 있습니다.
이 API는 원래 Chrome DevTools 프로토콜을 기반으로 했지만, 연말까지 새로운 고급 WebDriver BiDi 프로토콜을 Puppeteer의 기반으로 만드는 것이 목표입니다. 모든 주요 브라우저 공급업체와 공동 제작한 WebDriver BiDi는 많은 자동화 사용 사례를 간소화하고 다양한 새로운 사용 사례를 지원하며 브라우저 간 호환을 지원합니다.
하지만 기다릴 필요는 없습니다. 현재 Puppeteer의 API는 이미 많은 자동화 사용 사례를 지원하고 있으며, 이는 WebDriver BiDi를 통해서만 개선될 것입니다. 테스트에서 시각적 크롤링, 프로세스 자동화에 이르기까지 페이지 상호작용, 요청 가로채기, 스크린샷과 같은 기능을 사용하여 할 수 있는 작업이 많습니다. WebGPU 및 WebGL을 사용하여 클라우드에서 웹 AI 모델을 테스트하는 데도 사용할 수 있습니다.
Puppeteer는 완전한 브라우저 테스트 프레임워크인 WebdriverIO와 개인 정보 보호 샌드박스 분석 도구와 같은 도구에서도 사용되므로 사이트의 쿠키 및 사용자 데이터 사용량을 더 잘 이해할 수 있습니다.
Chrome 헤드리스
Puppeteer를 사용하여 Chrome을 자동화한 적이 있다면 테스트가 실행될 때 브라우저 창이 표시되지 않는 것을 발견했을 수 있습니다. 기본적으로 Puppeteer는 헤드리스 모드로 Chrome을 시작합니다. 즉, 자동화가 실행되는 동안에는 실제 브라우저 창이 없습니다.
하지만 Chrome의 헤드리스 모드가 창 없는 Chrome만이 아니라 완전히 별도로 유지관리되는 Chrome 버전이라는 사실을 알고 계셨나요? 오랫동안 혼란이 발생하고 버그와 문제를 추적하기 어려웠습니다.
Chrome 112부터 일반 Chrome과 동일한 코드베이스를 기반으로 하는 새로운 헤드리스 모드를 도입했습니다. 이렇게 하면 이전의 혼동을 줄일 수 있을 뿐만 아니라 자동화 중에 확장 프로그램을 사용하는 등 이전에는 불가능했던 기능을 사용할 수 있게 됩니다.
Puppeteer는 버전 22부터 이 새로운 헤드리스 모드를 기본값으로 사용하고 있습니다. 다른 자동화 솔루션을 통해 Chrome 헤드리스를 사용하는 경우 --headless=new 명령줄 스위치를 사용하여 새 헤드리스 모드를 강제 적용할 수 있습니다.
Chrome의 새로운 헤드리스 모드는 더 강력하지만 이전 헤드리스 모드만큼 가볍지는 않습니다. 리소스가 매우 제한되어 있거나 Chrome의 모든 기능이 필요하지 않다면 이전 헤드리스 모드를 chrome-headless-shell로 사용하면 됩니다.
테스트용 Chrome
테스트할 때는 운영체제, 브라우저, 브라우저 버전 등 테스트 환경을 세밀하게 제어해야 합니다. Chrome의 자동 업데이트에서는 이것이 어려울 수 있습니다.
이러한 이유로 Google은 모든 주요 운영체제에서 버전이 지정된 보관 파일에서 액세스할 수 있도록 모든 주요 운영체제에서 모든 Chrome 버전과 함께 출시되는 자동 업데이트가 없는 Chrome 버전인 Chrome for Testing을 만들었습니다. 이렇게 하면 복잡한 작업 없이 특정 버전의 Chrome에서 자동화 워크플로를 실행할 수 있습니다.
Chrome for Testing 가용성 대시보드, JSON API 또는 Puppeteer 명령줄 유틸리티에서 Chrome for Testing 바이너리에 액세스할 수 있습니다.
Puppeteer, Chrome의 업데이트된 헤드리스 모드, Chrome for Testing은 브라우저 자동화 및 테스트 실행을 최대한 원활하게 하기 위해 Google에서 현재 하고 있는 작업 중 일부일 뿐입니다. DevTools Recorder와 같은 관련 도구는 테스트 생성을 지원합니다. Chrome에서 사용자 흐름을 기록하고 Puppeteer에서 재생합니다.
web.dev에서 테스트 알아보기
이 게시물에서 다루는 도구는 자동 테스트를 개선하는 데 도움이 됩니다. 하지만 이제 막 시작한 단계라면 이해하고 배워야 할 것이 많습니다. 따라서 Google에서는 10개 모듈 과정인 web.dev에서 테스트하기를 새로 만들었습니다. 이 심층 과정에서는 테스트의 핵심 개념, 테스트 실행 위치 및 방법, 테스트 유형, 실제로 테스트할 항목을 다룹니다. 이는 테스트 여정을 위한 훌륭한 시작점입니다. 필요한 사항을 갖추었다면 테스트 자동화 컬렉션으로 이동하여 보다 구체적인 테스트 질문에 관한 심층 분석과 실용적인 팁을 확인하세요.