테스트 진행하기

이번 포스팅에서는 WebDriverIO를 통해 브라우저의 테스트를 진행하는 간단한 예제를 준비했습니다.

해당 내용을 진행하기에 앞서, 이전 포스팅을 먼저 참조할 것을 추천드립니다.

 

 

본 포스팅에서 사용하는 테스트 런타임 환경은 아래와 같습니다.

• OS : Ubuntu 18.04.1 LTS 64bit
• Node.js Runtime : v10.14.2 LTS
• Browser : Firefox 64.0 canonical-1.0

 

WebDriverIO 에서 테스트를 진행하기 위해 test runner 를 사용할 것입니다. 이는 테스트를 도와주는 도구 정도로 생각하시면 됩니다.

 

먼저 WebDriverIO 에서 사용하는 test runner를 설치해줍니다.

npm i --save-dev @wdio/cli

 

다음 아래 명령어를 입력하여 test runner의 초기 설정을 진행합니다.

$ ./node_modules/.bin/wdio config

 

설정은 아래와 같이 진행합니다. 모두 기본 설정을 사용하므로 Enter 를 눌러주면 됩니다.

기본 설정으로 진행할 시, 테스트 프레임워크는 Mocha가 설정되는 것을 확인할 수 있습니다.

mocha test framework : https://mochajs.org/ 

 

=========================
WDIO Configuration Helper
=========================
 
? Where should your tests be launched  local - https://www.npmjs.com/package/@wdio/local-runner
? Shall I install the runner plugin for you? Yes
? Where is your automation backend located? On my local machine
? Which framework do you want to use? mocha
? Shall I install the framework adapter for you? Yes
? Do you want to run WebdriverIO commands synchronous or asynchronous? sync
? Where are your test specs located? ./test/specs/**/*.js
? Which reporter do you want to use? (Press <space> to select, <a> to toggle all, <i> to invert selection)
? Do you want to add a service to your test setup?
? Level of logging verbosity trace
? What is the base url? http://localhost
 
Installing wdio packages:
- @wdio/local-runner
- @wdio/mocha-framework
- @wdio/sync
 
Packages installed successfully, creating configuration file...
 
Configuration file was created successfully!
To run your tests, execute:
$ wdio wdio.conf.js

 

 

동일 디렉터리 내에 wdio.conf.js 파일이 생성된 것을 확인하실 수 있습니다.

해당 파일은 test runner가 어떤 설정을 통해 동작할 것인지 명세한 파일입니다.

 

 

위의 명세대로 test suite를 작성해보겠습니다.

우리는 ./test/specs/ 아래에 테스트를 실행하기 위한 파일들을 지정하기로 하였습니다.

 

먼저 아래 명령을 통해 디렉토리를 만들어 보겠습니다.

mkdir -p ./test/specs

 

 

현재 생성한 프로젝트의 디렉토리는 아래와 같은 구성을 하고 있습니다.

 

.
├── app.js
├── geckodriver
├── node_modules
├── package.json
├── package-lock.json
├── test
└── wdio.conf.js

 

JS 파일을 ./test/specs/* 에 아래와 같이 작성해보도록 하겠습니다.

 

const assert = require('assert');
 
describe('Naver 홈페이지 테스트 하기', () => {
 
  it('홈페이지 제목 확인하기', () => {
    browser.url('https://www.naver.com');
    const title = browser.getTitle();
    assert.equal(title, "NAVER");
  });
  
});

여기서 6번 줄의 브라우저 객체는 wdio test runner가 실행 시간에 동작 중일 때, 선언하지 않고 사용할 수 있습니다.

위의 소스코드는 https://www.naver.com에 접속하여 사이트의 제목이 일치하는지 확인하는 아주 간단한 코드입니다.

 

아래와 같이 geckodriver를 실행합니다.

./gecodriver --port 4444

 

이제 test runner를 실행해봅시다.

...(중략)
[0-0] 2019-01-24T12:06:14.113Z INFO webdriver: COMMAND getTitle()
[0-0] 2019-01-24T12:06:14.113Z INFO webdriver: [GET] http://127.0.0.1:4444/session/4aaa78b9-d0e7-4266-90fe-c3ba401c1039/title
[0-0] 2019-01-24T12:06:14.118Z INFO webdriver: RESULT NAVER.
[0-0] 2019-01-24T12:06:14.119Z INFO webdriver: COMMAND navigateTo("https://www.naver.com/")
[0-0] 2019-01-24T12:06:14.120Z INFO webdriver: [POST] http://127.0.0.1:4444/session/4aaa78b9-d0e7-4266-90fe-c3ba401c1039/url
[0-0] 2019-01-24T12:06:14.120Z INFO webdriver: DATA { url: 'https://www.naver.com/' }
[0-0] 2019-01-24T12:06:14.496Z INFO webdriver: COMMAND deleteSession()
[0-0] 2019-01-24T12:06:14.496Z INFO webdriver: [DELETE] http://127.0.0.1:4444/session/4aaa78b9-d0e7-4266-90fe-c3ba401c1039
2019-01-24T12:06:16.322Z DEBUG wdio-local-runner: Runner 0-0 finished with exit code 0
 
Test Suites:     1 passed, 1 total (100% completed)
Time:            🕐  14.39s