CodeceptJS
3.6.10
상태 빌드 :
Appium 도우미 :
웹 도우미 :
참조 : Helpers API
CodeCeptjs는 WebDriver (또는 기타)를 사용한 엔드 투 엔드 테스트를위한 새로운 테스트 프레임 워크입니다. 브라우저 상호 작용을 사용자의 관점에서 작성한 간단한 단계로 추상화합니다. "환영"텍스트를 확인하는 간단한 테스트는 사이트의 메인 페이지에 다음과 같습니다.
Feature ( 'CodeceptJS demo' ) ;
Scenario ( 'check Welcome page on site' , ( { I } ) => {
I . amOnPage ( '/' ) ;
I . see ( 'Welcome' ) ;
} ) ;CodeCeptjs 테스트는 다음과 같습니다.
I 의 방법입니다. 이를 통해 테스트는 비 기술자에게도 읽기 쉽고 쓰기 및 유지할 수 있습니다. CodeCeptjs는 도우미 모듈을 사용하여 I 객체에 동작을 제공합니다. 현재 CodeCeptjs에는 다음과 같은 조력자가 있습니다.
그리고 앞으로 더 ...
CodeCeptjs는 PHP에 대한 인기있는 풀 스택 테스트 프레임 워크 인 CodeCeption의 후속 인입니다. CodeCeptjs를 사용하면 시나리오 중심의 기능 및 승인 테스트는 가능한 한 간단하고 깨끗합니다. CodeCeptjs가 통합하여 동기식으로 작동하게하기 때문에 Nodejs의 비동기적 특성 또는 Playwright, Selenium, Puppeteer, TestCafe 등의 다양한 API에 대해 걱정할 필요가 없습니다.
npm i codeceptjs --save테스트 (및 CodeCepTJS 구성)를 저장하고 실행하려는 디렉토리로 이동하십시오.
npx codeceptjs init테스트 환경을 작성하고 구성합니다. Selenium Webdriver 테스트를 작성 해야하는 경우 헬퍼 목록에서 WebDriver를 선택하는 것이 좋습니다.
그런 다음 실행하여 첫 번째 테스트를 만듭니다.
npx codeceptjs generate:test이제 테스트가 생성되어 실행할 수 있습니다
npx codeceptjs runTypeScript를 사용하여 테스트를 작성하려면 다음을 수행하여 표준 유형 정의를 생성하십시오.
npx codeceptjs def .나중에 유형 정의를 자동으로 업데이트하여 고유 한 사용자 정의 도우미 방법을 포함 할 수도 있습니다.
메모:
12+ 이후가 필요합니다. 예제에 따라 CodeCeptjs를 배우십시오. CodeCeptjs가 설치되고 WebDriver 도우미가 활성화되었다고 가정 해 봅시다.
기본 양식 테스트를 어떻게 처리 할 수 있는지 살펴 보겠습니다.
Feature ( 'CodeceptJS Demonstration' ) ;
Scenario ( 'test some forms' , ( { I } ) => {
I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
I . fillField ( 'Email' , '[email protected]' ) ;
I . fillField ( 'Password' , secret ( '123456' ) ) ;
I . checkOption ( 'Active' ) ;
I . checkOption ( 'Male' ) ;
I . click ( 'Create User' ) ;
I . see ( 'User is valid' ) ;
I . dontSeeInCurrentUrl ( '/documentation' ) ;
} ) ; 모든 동작은 I 객체에 의해 수행됩니다. Assertions 기능은 see 기능으로 시작합니다. 이 예에서 I 의 모든 방법은 WebDriver 도우미에서 가져옵니다. 참조를 참조하여 사용하는 방법을 참조하십시오.
이 테스트를 run 명령으로 실행합시다. 추가 옵션 --steps 실행 프로세스를 보여줍니다. 개발 중에 --steps 또는 --debug 사용하는 것이 좋습니다.
npx codeceptjs run --steps이것은 출력을 생성합니다.
CodeceptJS Demonstration --
test some forms
• I am on page " http://simple-form-bootstrap.plataformatec.com.br/documentation "
• I fill field " Email " , " [email protected] "
• I fill field " Password " , " **** "
• I check option " Active "
• I check option " Male "
• I click " Create User "
• I see " User is valid "
• I dont see in current url " /documentation "
✓ OK in 17752ms CodeCeptjs에는 테스트를 개발하고 디버깅하는 데 도움이되는 궁극적 인 기능이 있습니다. 어느 곳에서나 테스트 실행을 일시 중지하고 대화식 쉘을 사용하여 다른 동작과 로케이터를 시도 할 수 있습니다. 테스트 중 어느 곳에서나 pause() 호출을 추가하고 실행하십시오.
대화식 쉘은 다음을 실행하여 테스트 컨텍스트 밖에서 시작할 수 있습니다.
npx codeceptjs shell 우리는 fillField 방법으로 형태를 채웠습니다. 테스트에서 이름, CSS 또는 XPath 로케이터로 요소를 찾을 수있는 것과 같은 방법 :
// by name
I . fillField ( 'user_basic[email]' , '[email protected]' ) ;
// by CSS
I . fillField ( '#user_basic_email' , '[email protected]' ) ;
// don't make us guess locator type, specify it
I . fillField ( { css : '#user_basic_email' } , '[email protected]' ) ; checkOption 과 같은 다른 방법 및 비슷한 방식으로 작업을 click . 라벨 또는 CSS 또는 XPath 로케이터를 사용하여 상호 작용할 요소를 찾을 수 있습니다.
어설 션은 접두사를 see dontSee 것으로 시작합니다. 우리의 경우 우리는 문자열 '사용자가 유효하다'고 웹 페이지 어딘가에 있다고 주장하고 있습니다. 그러나 두 번째 매개 변수를 제공하여 특정 요소로 검색을 좁힐 수 있습니다.
I . see ( 'User is valid' ) ;
// better to specify context:
I . see ( 'User is valid' , '.alert-success' ) ; 이 경우 '사용자는 유효한'문자열은 CSS .alert-success 가 위치한 내부 요소 만 검색됩니다.
웹 페이지에서 값을 반환하고 테스트에서 직접 사용해야하는 경우 grab Prefix가있는 메소드를 사용해야합니다. 그들은 async/await 함수 내에서 사용될 것으로 예상되며 결과는 테스트에서 사용할 수 있습니다.
Feature ( 'CodeceptJS Demonstration' ) ;
Scenario ( 'test page title' , async ( { I } ) => {
I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
const title = await I . grabTitle ( ) ;
I . expectEqual ( title , 'Example application with SimpleForm and Twitter Bootstrap' ) ; // Avaiable with Expect helper. -> https://codecept.io/helpers/Expect/
} ) ;텍스트, 속성 또는 양식 값을 가져 와서 다음 테스트 단계에서 사용할 수있는 것과 같은 방식으로.
웹 페이지 열기, 사용자에 로그인하는 것과 같은 일반적인 준비 단계는 Before 또는 Background 에 배치 할 수 있습니다.
const { I } = inject ( ) ;
Feature ( 'CodeceptJS Demonstration' ) ;
Before ( ( ) => { // or Background
I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
} ) ;
Scenario ( 'test some forms' , ( ) => {
I . click ( 'Create User' ) ;
I . see ( 'User is valid' ) ;
I . dontSeeInCurrentUrl ( '/documentation' ) ;
} ) ;
Scenario ( 'test title' , ( ) => {
I . seeInTitle ( 'Example application' ) ;
} ) ; CodeCeptjs는 테스트에서 페이지 객체를 작성하고 사용하는 가장 간단한 방법을 제공합니다. 실행하여 하나를 만들 수 있습니다
npx codeceptjs generate pageobject 페이지 객체 파일을 작성하고 구성에 추가합니다. docsPage 라는 이름의 하나를 만들었다고 가정 해 봅시다.
const { I } = inject ( ) ;
module . exports = {
fields : {
email : '#user_basic_email' ,
password : '#user_basic_password'
} ,
submitButton : { css : '#new_user_basic input[type=submit]' } ,
sendForm ( email , password ) {
I . fillField ( this . fields . email , email ) ;
I . fillField ( this . fields . password , password ) ;
I . click ( this . submitButton ) ;
}
}테스트 인수에서 이름을 제공하여 테스트하도록 쉽게 주입 할 수 있습니다.
Feature ( 'CodeceptJS Demonstration' ) ;
Before ( ( { I } ) => { // or Background
I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
} ) ;
Scenario ( 'test some forms' , ( { I , docsPage } ) => {
docsPage . sendForm ( '[email protected]' , '123456' ) ;
I . see ( 'User is valid' ) ;
I . dontSeeInCurrentUrl ( '/documentation' ) ;
} ) ; TypeScript를 사용하는 경우 module.exports 자동 완성을 위해 export 로 바꾸십시오.
Davertmik | Kobenguyent | Vorobeyko | Reubenmiller |
Arhell | Apshenkin | Fabioel | Pablopaul |
미라오 | 조지 그래프 | kmkoushik | Nikocanvacom |
Elukoyanov | Thomashohn | Gkushang | Tsuemura |
Egorbodnar | Vikalpp | Elaichenkov | Borisosipov |
ngraf | nitschsb | Hubidu | Jploskonka |
Maojunxyz | Abhimanyupandian | 마르토모 | Hatufacci |
MIT © CodeCeptjs 팀
