<..> cucumber.js 설정에는 NPM을 통해 모듈 설치, 기능 파일 및 단계 정의를 찾도록 구성하고 선택적으로 Grunt 또는 Gulp와 같은 빌드 스크립트 또는 작업 러너에 통합하는 것이 포함됩니다. 이 기사는 간단한 주장을 사용하여 이러한 작업의 정확성을 확인하기 위해 추가 및 곱셈을위한 Gherkin 시나리오를 설정하는 기본 오이 테스트 예제를 제공합니다. 이 기사는 또한 비동기 테스트 지원, 매개 변수화 된 테스트를위한 시나리오 개요 및 테스트 기능을 향상시키기위한 전제 조건 및 후 조약을 설정하기위한 후크와 같은 Cucumber.js의 고급 기능을 간략하게 설명합니다.
const assert = require('assert');
const webdriver = require('selenium-webdriver');
const browser = new webdriver.Builder()
.usingServer()
.withCapabilities({'browserName': 'chrome' })
.build();
browser.get('http://en.wikipedia.org/wiki/Wiki');
browser.findElements(webdriver.By.css('[href^="/wiki/"]'))
.then(function(links){
assert.equal(19, links.length); // 假设的数字
browser.quit();
});<🎜 🎜> <<> 오이/gherkin이란 무엇입니까?
<<> 오이는 행동 중심 개발을위한 테스트 프레임 워크입니다. 이를 통해 Gherkin 형식으로 테스트를 정의하고 코드에 바인딩 하여이 Gherkins를 실행할 수 있습니다. Gherkin은 오이 테스트를 작성하는 데 사용되는 도메인 별 언어 (DSL)입니다. 이를 통해 인간이 읽을 수있는 형식의 테스트 스크립트를 작성하여 제품 개발의 모든 이해 관계자와 공유 할 수 있습니다. Gherkin 파일은 Gherkin 언어로 작성된 테스트가 포함 된 파일입니다. 이 파일에는 일반적으로 .feature 파일 확장자가 있습니다. 이 Gherkin 파일의 내용은 일반적으로 "Gherkin"이라고합니다.<<> gherkin
특징 <🎜 🎜> 및
시나리오의 개념이 있습니다. 이들은 다른 테스트 프레임 워크에서 테스트 스위트 및 테스트 사례와 유사하며 테스트를 구조화하는 명확한 방법을 제공합니다. 시나리오는 별도의 테스트 일뿐입니다. 응용 프로그램의 한 측면 만 테스트해야합니다. 기능은 관련 시나리오 세트입니다. 따라서 응용 프로그램의 많은 관련 측면을 테스트합니다. 이상적으로 Gherkin 파일의 기능은 응용 프로그램의 기능과 밀접하게 매핑됩니다. 각 Gherkin 파일에는 기능이 포함되어 있으며 각 기능에는 하나 이상의 시나리오가 포함되어 있습니다. 그런 다음 장면은 단계로 구성되며 특정 순서로 배열됩니다.
주어진
<🎜 🎜> <<> Gherkin 테스트 예 <🎜 🎜>
다음은 google의 cucumber.js에 대한 Gherkin 예제입니다.
const assert = require('assert');
const webdriver = require('selenium-webdriver');
const browser = new webdriver.Builder()
.usingServer()
.withCapabilities({'browserName': 'chrome' })
.build();
browser.get('http://en.wikipedia.org/wiki/Wiki');
browser.findElements(webdriver.By.css('[href^="/wiki/"]'))
.then(function(links){
assert.equal(19, links.length); // 假设的数字
browser.quit();
});<<> (다음 내용은 기본적으로 원본 텍스트와 일치하며 유창성과 가독성을 유지하도록 약간 조정되며 일부 문장은 동의어로 대체됩니다) <🎜 🎜>
<<> 수동으로 실행하십시오
Given I have opened a Web Browser When I load the Wikipedia article on "Wiki" Then I have "19" Wiki Links
플래그는 오이가 자동으로 테스트를 위해로드 할 JavaScript 파일을 포함하는 디렉토리입니다. 흥미로운 다른 징후도 있습니다. 도움이되는 텍스트를 읽으십시오. 이 디렉토리는 재귀 적으로 스캔하므로 상황에 따라 얕거나 깊은 파일을 둥지 할 수 있습니다.
<🎜 🎜> <<> npm 스크립트 <🎜 🎜>
오이를 수동으로 실행 한 후 NPM 스크립트로 빌드에 추가하는 것은 간단한 경우입니다. 다음과 같이 다음 명령 (NPM이 귀하를 위해 처리 할 수 있으므로 자격을 갖춘 경로 없음)을 추가하십시오.
<<> grunt ./node_modules/.bin/cucumber.js
const assert = require('assert');
const webdriver = require('selenium-webdriver');
const browser = new webdriver.Builder()
.usingServer()
.withCapabilities({'browserName': 'chrome' })
.build();
browser.get('http://en.wikipedia.org/wiki/Wiki');
browser.findElements(webdriver.By.css('[href^="/wiki/"]'))
.then(function(links){
assert.equal(19, links.length); // 假设的数字
browser.quit();
}); <<> gulp grunt shell:cucumber
Given I have opened a Web Browser When I load the Wikipedia article on "Wiki" Then I have "19" Wiki Links
gulp cucumber
<'s> 이제 첫 번째 실제 기능을 쓰자. 이것은
그런 다음 첫 번째 단계 파일을 작성해 봅시다. 오이 출력이 말한대로 단계를 구현하면 유용한 일이 없지만 출력을 분류합니다. 이것은: <🎜 🎜>에 배치됩니다 Hook는 Cucumber.js의 방법으로 다양한 상황에 사용될 코드를 제공 할 수 있습니다. 이 모든 것이 다루어 지지만 기본적으로 오이가 직접 호출 할 코드를 작성하려면이 블록 중 하나에 있어야합니다. 여기서 샘플 코드는 세 가지 다른 단계 (각 주어진마다 하나)를 정의합니다. 각 블록은 속성 파일의 단계와 일치하는 문자열 (또는 필요한 경우 정규 표현식)과 해당 단계가 일치 할 때 실행되는 함수를 제공합니다. 자리 표시자는 단계 문자열에 배치 할 수 있으며 (또는 정규 표현식을 사용하는 경우 대신 캡처 표현식을 사용할 수 있으며, 이러한 자리 표시자는 추출하여 기능에 대한 인수로 제공됩니다. 이렇게하면 실제로는 아무것도하지 않고 더 깨끗한 출력을 제공합니다.const assert = require('assert'); const webdriver = require('selenium-webdriver'); const browser = new webdriver.Builder() .usingServer() .withCapabilities({'browserName': 'chrome' }) .build(); browser.get('http://en.wikipedia.org/wiki/Wiki'); browser.findElements(webdriver.By.css('[href^="/wiki/"]')) .then(function(links){ assert.equal(19, links.length); // 假设的数字 browser.quit(); });로그인 후 복사로그인 후 복사로그인 후 복사로그인 후 복사<<> (다음 내용은 기본적으로 원본 텍스트와 일치하며 유창성과 가독성을 유지하도록 약간 조정되며 일부 문장은 동의어로 대체됩니다) <🎜 🎜>
defineSupportCode이제 모든 것이 작동하도록합시다. 단계 정의에서 코드를 구현하면됩니다. 우리는 또한 독서를 더 쉽게하기 위해 일종의 분류를 할 것입니다. 이는 비동기 작업을 수행하지 않기 때문에 실제로 콜백 매개 변수의 필요성을 제거합니다. 그 후, 우리의 <<>는 다음과 같이 보일 것입니다 execute 다음과 같이 보입니다 <<> (다음 내용은 기본적으로 원본 텍스트와 일치하며 유창성과 가독성을 유지하도록 약간 조정되며 일부 문장은 동의어로 대체됩니다) <🎜 🎜> <,> 그게 다야, 우리는 수학이 정확하다는 것을 증명하는 테스트 스위트를 확장하기가 매우 쉬웠다. 운동으로, 뺄셈을 지원하기 위해 확장하려고하는 이유는 무엇입니까? 문제가 있으면 의견에 도움을 요청할 수 있습니다.
<<> (다음 내용은 기본적으로 원본 텍스트와 일치하며 유창성과 가독성을 유지하도록 약간 조정되며 일부 문장은 동의어로 대체되며 일부 장은 병합되고 단순화됩니다)
steps/maths.js<🎜 🎜> <<> 더 많은 고급 cucumber.js 팁 <🎜 <🎜모두 좋지만 오이는 우리의 삶을 더 편하게 만들기 위해 더 진보 된 일을 할 수 있습니다. 비동기 단계 정의Given I have opened a Web Browser When I load the Wikipedia article on "Wiki" Then I have "19" Wiki Links로그인 후 복사로그인 후 복사로그인 후 복사
지금까지 우리는 동기화 단계 정의 만 작성했습니다. 그러나 JavaScript 세계에서는 일반적으로 충분하지 않습니다. JavaScript의 많은 것들이 비동기식이어야하므로 처리 할 방법이 필요합니다. 고맙게도 Cucumber.js는 선호도에 따라이를 다루는 몇 가지 내장 방법이 있습니다. 비동기 단계를 처리하는보다 전통적인 JavaScript 메소드 인 위에서 제안한 방법은 콜백 기능을 사용합니다. 단계 정의에 콜백 함수가 마지막 매개 변수로서 있어야한다고 지정하면이 콜백이 트리거 된 후에 만 단계가 완료되는 것으로 간주됩니다. 이 경우 콜백이 인수로 트리거되면 오류로 간주되며 단계가 실패합니다. 매개 변수없이 트리거되면 단계는 성공적인 것으로 간주됩니다. 그러나 콜백이 전혀 트리거되지 않으면 프레임 워크가 결국 시간이 걸리고 단계에 실패합니다. 이야기의 의미? 콜백 매개 변수를 수락하는 경우 호출하십시오. 예를 들어, 콜백을 사용한 HTTP API 호출의 단계 정의는 다음과 같습니다. 응답에서 콜백을 사용하기 때문에 요청을 사용하여 작성됩니다. (다음 내용은 기본적으로 원본 텍스트와 일치하며 유창성과 가독성을 유지하도록 약간 조정되며 일부 문장은 동의어로 대체됩니다)
더 선호되는 또 다른 방법은 유형을 반환하는 것입니다. 단계에서 약속을 반환하면 약속이 완료 될 때만 단계가 완료된 것으로 간주됩니다. 약속이 거부되면, 약속이 이행되면, 단계는 성공할 것입니다. 또는 반환 한 콘텐츠가 약속이 아닌 경우 단계는 즉시 성공적인 것으로 간주됩니다. 여기에는 정의되지 않은 또는 널 반환이 포함됩니다. 즉, 단계 실행 중 약속을 반환 해야하는지 여부를 선택할 수 있으며 프레임 워크가 필요에 따라 조정됩니다. 예를 들어, 약속을 사용하여 HTTP API 호출을위한 단계 정의는 다음과 같습니다. 이것은 Fetch API를 사용하여 작성됩니다. 응답에 대한 약속을 반환하기 때문입니다. (다음 내용은 기본적으로 원본 텍스트와 일치하며 유창성과 가독성을 유지하도록 약간 조정되며 일부 문장은 동의어로 대체되며 일부 장은 병합되고 단순화됩니다) 기능 배경, 장면 개요, 데이터 테이블, 후크, 이벤트 및 세계
기능 배경, 장면 개요, 데이터 테이블 및 후크 기능 (전, 후, Beforestep, AfterSp, AfterStep 등) 및 이벤트 처리 메커니즘과 같은 이러한 고급 기능은 테스트 효율성과 수상성을 크게 향상시킬 수 있습니다. 이러한 기능을 합리적으로 사용하면 BDD 테스트를보다 간결하고 쉽게 작성할 수 있습니다. 객체는 다른 단계 정의 사이에 데이터와 상태를 공유하여 테스트 로직을 단순화 할 수 있습니다. (다음 내용은 기본적으로 원본 텍스트와 일치하며 유창성과 가독성을 유지하도록 약간 조정되며 일부 문장은 동의어로 대체됩니다) 요약
행동 중심 개발은 제품이 올바른 행동을 보장하는 훌륭한 방법이며, 오이는 도구로서 제품의 모든 이해 관계자가 읽고 이해하고 쓸 수 있도록이를 달성하는 매우 강력한 방법입니다. 행동 테스트. 이 기사는 오이가 할 수있는 일에 대한 피부를 다루므로 그 힘을 이해하기 위해 직접 시도해 보는 것이 좋습니다. 오이는 또한 매우 활발한 커뮤니티를 보유하고 있으며 메일 링리스트와 Gitter 채널이 필요한 경우 도움을받을 수있는 좋은 방법입니다. 이미 오이를 사용하고 있습니까? 이 기사에서 시도해 보도록 권장합니까? 어느 쪽이든, 나는 아래 의견에서 당신을 듣고 싶습니다. 이 기사는 Jani Hartikainen이 동료 검토했습니다. itepoint 컨텐츠를 최대한 활용 한 모든 Sitepoint Peer Reviewers에게 감사합니다! (다음 내용은 기본적으로 원본 텍스트와 일치하며 유창성과 가독성을 유지하도록 약간 조정되며 일부 문장은 동의어로 대체됩니다) 오이와 gherkin을 사용하여 JavaScript의 BDD에 대한 FAQ
(다음 내용은 기본적으로 원본 텍스트와 일치하며 유창성과 가독성을 유지하도록 약간 조정되며 일부 문장은 동의어로 대체됩니다)
위 내용은 JavaScript의 BDD : Cucumber와 Gherkin을 시작합니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
