게임을 시작하면 처음 맞이하게 되는 장면은 대부분 계정 또는 캐릭터 생성화면일 것입니다. 그렇다보니 게임 QA를 담당하시는 분들은 직접 테스트를 할 때 가장 많이 하는게 계정 생성, 게임 캐릭터 생성이지 않을까 싶습니다. 그만큼 계정이나 캐릭터 생성이 잘 동작하는지 테스트 해보는 것은 매우 중요하다고 할 수 있지요.

더군다나 RPG장르의 게임이라면 모든 캐릭터가 잘 생성되는지 출시나 업데이트 전 확인해보는 것은 필수입니다. 테스트 방법은 기본적으로 계정을 생성하고, 캐릭터를 고른 후, 닉네임을 입력하고 확인 버튼을 누른 후 화면에 캐릭터가 잘 보이는지 테스트를 할 것이라고 예상됩니다. 캐릭터가 적으면 금방 끝날 것 같습니다. 그런데 만약 테스트 해야 할 캐릭터가 100개, 1000개가 넘는다면 어떻게 할 건가요?(그만큼 테스트 할 일은 거의 없겠지만 상상해 봅시다..!)

Test Everywhere Meme

벌써 손으로 해야한다는 생각에 아찔하네요... 그러나 잘 생각해보면 여러 게임 계정을 만들고 캐릭터를 생성하는건 단순 동작의 반복에 그칠 뿐입니다. 가장 반복적인 일을 잘 하는 기계를 이용해 보도록 하죠!

만들어진 샘플 게임과 Dogu를 이용해 계정 생성부터 캐릭터 생성까지 TypeScript 언어를 사용해 스크립트화 하고 실행해보려고 합니다.

Dogu RPG Sample
팀원이 직접 만든 샘플 게임!

준비과정

create-character.test.ts파일을 만든 후, Gamium Client를 초기화하고 테스트를 정의해줍니다. 그리고 스크립트를 작성하기 위해 디바이스에서 게임을 켜고, Dogu 콘솔에서 UI 인스펙터를 사용합니다.

import { beforeAll, Dest, GamiumClient, GamiumKit, job, prepareGamium, UI } from '@dogu-tech/toolkit';

let gamiumKit: GamiumKit | null = null;
let gamium: GamiumClient;
let ui: UI;

Dest.withOptions({
  timeout: 15 * 60 * 1000,
}).describe(() => {
  job('Create characters', () => {
    beforeAll(async () => {
      gamiumKit = await prepareGamium();
      gamium = gamiumKit.gamium;
      ui = gamium.ui();
    });
  });
});
게임을 켰을 때 첫 화면입니다

게임 계정 만들기

먼저 게임을 들어가보도록 하겠습니다. UI 인스펙터를 이용해서 터치 영역에 마우스를 대면 Path 값을 알려줍니다. 이 Path 값을 통해서 스크립트를 작성할 수 있습니다. 복사 후 스크립트를 작성하러 가봅니다. 일단 테스트용이니 게스트 로그인을 통해 계정을 생성해 보도록 하겠습니다.

import { beforeAll, By, Dest, GamiumClient, GamiumKit, job, prepareGamium, UI, test } from '@dogu-tech/toolkit';

Dest.withOptions({
  timeout: 15 * 60 * 1000,
}).describe(() => {
  job('Create characters', () => {
    
    // 생략

    test('Guest login', async () => {
      await ui.click(By.path('/Canvas[1]/Login[1]/Panel[1]/GuestLoginBtn[1]'));
    });
  });
})

게스트 로그인 버튼을 클릭하는 스크립트입니다. 버튼 UI 오브젝트를 path로 참조해서 클릭하도록 합니다.

다음 장면에서는 계정 이름 입력창이 나타났습니다! 이제는 게임에서 InputField의 path를 찾고 이름을 입력한 후 OK 버튼을 누르는 것을 해야할 것 같네요.

test('Guest login', async () => {
  await ui.click(By.path('/Canvas[1]/Login[1]/Panel[1]/GuestLoginBtn[1]'));
  await ui.setText(By.path('/Canvas[1]/Register[1]/InputField[1]/Input[1]'), 'Test');
  await ui.click(By.path('/Canvas[1]/Register[1]/OkBtn[1]'));
});

그 다음 장면은 진입 장면입니다. 'Press here to start' 버튼을 눌러야 장면을 넘길 수 있어 저 부분을 클릭하도록 합니다.

test('Guest login', async () => {
  await ui.click(By.path('/Canvas[1]/Login[1]/Panel[1]/GuestLoginBtn[1]'));
  await ui.setText(By.path('/Canvas[1]/Register[1]/InputField[1]/Input[1]'), 'Test');
  await ui.click(By.path('/Canvas[1]/Register[1]/OkBtn[1]'));
  await ui.click(By.path('/Canvas[1]/Start[1]/Desc[1]'));
});

캐릭터 만들기

캐릭터 생성 화면들

캐릭터 생성도 버튼 클릭과 캐릭터 네임 입력이 전부입니다. 계정 생성 파트에서 자세히 다루었던 내용이니 설명은 생략하고 바로 스크립트를 작성해보도록 할게요! 스크립트에서는 Wizard 캐릭터로 생성해 보도록 하겠습니다.

test('Create Character', async () => {
  // + 버튼 클릭
  await ui.click(By.path('/Canvas[1]/SelectCharacter[1]/RightPanel[1]/CharacterScrollView[1]/Viewport[1]/Content/SquareButton(Clone)[1]'));
  // Wizard 캐릭터 선택
  await ui.click(By.path('/Canvas[1]/CreateCharacter[1]/RightPanel[1]/CharacterScrollView[1]/Viewport[1]/Content[1]/SquareButton(Clone)[2]'));
  // 캐릭터 이름 입력
  await ui.setText(By.path('/Canvas[1]/CreateCharacter[1]/RightPanel[1]/NicknamePanel[1]/InputField[1]'), 'Test');
  // Ok 버튼 클릭
  await ui.click(By.path('/Canvas[1]/CreateCharacter[1]/RightPanel[1]/NicknamePanel[1]/OkButton[1]'));
  // Start 버튼 클릭
  await ui.click(By.path('/Canvas[1]/SelectCharacter[1]/RightPanel[1]/StartBtn[1]'));
});

캐릭터 생성이 끝났습니다! 이제 남은 작업은 테스트 스크립트가 잘 실행되는지 테스트해야 합니다.

테스트 실행하기

Dogu 콘솔에서는 스크립트를 테스트할 수 있는 기능을 제공합니다. 이 기능을 이용해서 스크립트를 테스트해 보도록 할게요.

과연 결과는...!

디바이스 스트리밍 화면
스크립트 출력 로그

테스트가 모두 성공했습니다!🥳🥳 앞으로 캐릭터가 100개던 1000개던 스크립트를 통해 계정과 캐릭터를 생성하는 테스트를 수행할 수 있습니다. 그리고 당연한 이야기겠지만 사람이 직접 테스트하는것 보다 더 빠른 시간안에 끝났습니다. 제가 테스트를 할 때에는 10초 넘게 걸렸는데, 스크립트 테스트는 Gamium 연결 초기화 단계인 beforeAll 단계를 빼면 5초 정도 걸렸네요. 캐릭터 생성뿐이라 2배 차이가 나지만, 나중에 아이템 구매, 강화, 퀘스트 등등 요소를 추가하면 그 차이는 더 크게 벌어질 것 같습니다.

더 나아가서 캐릭터 생성 후에 게임 내 UI요소가 잘 나오는지도 체크해보면 더 완벽하게 게임을 테스트해볼 수 있을 것 같고, 실제로 소셜로그인도 잘 되는지 테스트해보면 좋을 것 같다는 생각이 듭니다. 특히 소셜로그인은 게임 내 WebView를 사용하고 있어 조금 까다로운 면이 있는데 이는 다음에 또 풀어나가 보도록 하겠습니다.