메인 컨텐츠로 건너뛰기

모바일 애플리케이션용

WebdriverIO 테스트와 App Percy 통합하기​

통합하기 전에 WebdriverIO용 App Percy 샘플 빌드 튜토리얼을 살펴볼 수 있습니다. 테스트 제품군을 BrowserStack App Percy와 통합하는 단계는 다음과 같습니다:

1단계: Percy 대시보드에서 새 앱 프로젝트 생성하기​

Percy에 로그인하고 새 앱 유형 프로젝트를 생성하세요. 프로젝트를 생성한 후 PERCY_TOKEN 환경 변수가 표시됩니다. Percy는 PERCY_TOKEN을 사용하여 스크린샷을 업로드할 조직과 프로젝트를 식별합니다. 다음 단계에서 이 PERCY_TOKEN이 필요합니다.

2단계: 프로젝트 토큰을 환경 변수로 설정하기​

다음 명령을 실행하여 PERCY_TOKEN을 환경 변수로 설정하세요:

export PERCY_TOKEN="<your token here>"   // macOS or Linux
$Env:PERCY_TOKEN="<your token here>"    // Windows PowerShell
set PERCY_TOKEN="<your token here>"    // Windows CMD

3단계: Percy 패키지 설치하기​

테스트 제품군의 통합 환경 구축에 필요한 구성 요소를 설치하세요. 의존성을 설치하려면 다음 명령을 실행하세요:

npm install --save-dev @percy/cli

4단계: 의존성 설치하기​

Percy Appium 앱을 설치하세요

npm install --save-dev @percy/appium-app

5단계: 테스트 스크립트 업데이트하기​

코드에 @percy/appium-app을 가져오는지 확인하세요.

아래는 percyScreenshot 함수를 사용하는 예제 테스트입니다. 스크린샷을 찍어야 하는 곳마다 이 함수를 사용하세요.

import percyScreenshot from '@percy/appium-app';
describe('Appium webdriverio test example', function() {
  it('takes a screenshot', async () => {
    await percyScreenshot('Appium JS example');
  });
});

필요한 인수를 percyScreenshot 메서드에 전달하고 있습니다.

스크린샷 메서드 인수는 다음과 같습니다:

percyScreenshot(driver, name[, options])

6단계: 테스트 스크립트 실행하기​

percy app:exec를 사용하여 테스트를 실행하세요.

percy app:exec 명령을 사용할 수 없거나 IDE 실행 옵션을 사용하여 테스트를 실행하는 것을 선호하는 경우, percy app:exec:start 및 percy app:exec:stop 명령을 사용할 수 있습니다. 자세한 내용은 Run Percy를 방문하세요.

$ percy app:exec -- appium test command

이 명령은 Percy를 시작하고, 새 Percy 빌드를 생성하고, 스냅샷을 찍어 프로젝트에 업로드한 다음 Percy를 중지합니다:

[percy] Percy has started!
[percy] Created build #1: https://percy.io/[your-project]
[percy] Snapshot taken "Appium WebdriverIO Example"
[percy] Stopping percy...
[percy] Finalized build #1: https://percy.io/[your-project]
[percy] Done!

자세한 내용은 다음 페이지를 참조하세요:​

리소스설명
공식 문서App Percy의 WebdriverIO 문서
샘플 빌드 - 튜토리얼App Percy의 WebdriverIO 튜토리얼
공식 비디오App Percy를 사용한 시각적 테스팅
블로그App Percy 소개: 네이티브 앱을 위한 AI 기반 자동화된 시각적 테스팅 플랫폼

Welcome! How can I help?

WebdriverIO AI Copilot