????TestCafe
????TestCafe ???????????????????????????????????????WebDriver?????????TestCafe ???????????????????????ζ???????????κ???????????????????豸?????в????TestCafe ?? ES6/ES7 ????????????????????????????й?????????????????????????????????????????????????????? TestCafe ???????????????????????????????????????? TestCafe ????????????????????????????????????????? WEB ???????????????TestCafe ???????????????? E2E ???????????????伴??????????????????????????
???????????
????npm install testcafe -g
??????д????
????TestCafe ????????????????????????????????????????? jQuery ??????????????????????????? Chai??????????????
import { Selector } from 'testcafe';
fixture `Github Search`
.page `https://github.com`;
test('should github search work as expected'?? async t => {
const searchInput = Selector('.js-site-search-focus');
const searchList = Selector('.repo-list-item');
const resultItem = Selector('.repo-list-item h3 a');
const repoContent = Selector('.repository-content');
await t.setTestSpeed(0.8);
await t.expect(searchInput.exists).eql(true?? 'should search input visible');
await t.typeText(searchInput?? 'testcafe');
await t.pressKey('enter');
await t.expect(searchList.count).eql(10?? 'should show 10 results');
await t.click(resultItem);
await t.expect(repoContent.exists).eql(true?? 'should repo detail visible');
const location = await t.eval(() => window.location);
await t.expect(location.pathname).eql('/DevExpress/testcafe'?? 'should testcafe repo found');
});
???????в???
????testcafe chrome testcafe/test.js
??????????
???????????

???????????

????CodeceptJs
????CodeceptJs ??????????????????? E2E ????????????????????й?????????????????????????API????????????????????Щ???????й????
????· WebDriverIO
????· Protractor
????· Selenium WebDriver JS
????· NightmareJS
????CodeceptJs ???????????????????????????????????? Feature ?? Scenario ??????????????????????????????? E2E ????????????????μ? ES6 ??????????θ????????????????е??????????????????????????ò??????????????????????????????????????????????????????????3????????????????
???????????
????· ??? CodeceptJs npm install -g codeceptjs
????· ???????й??????????? codecept.json??codeceptjs init
????· ????????й???????????codeceptjs gt
????· ????????????????????????????????? WebDriver??Protractor
??????д????
Feature('Github Search');
Scenario('search codecept repo'?? (I) => {
I.amOnPage('https://github.com');
I.seeElement('.js-site-search-focus');
I.fillField('.js-site-search-focus'?? 'codeceptjs');
I.pressKey('Enter');
I.seeElement('.repo-list-item');
I.click('.repo-list-item h3 a');
I.seeElement('.repository-content');
I.seeInCurrentUrl('/Codeception/CodeceptJS');
});
???????в???
????codeceptjs run
??????????
???????????

???????????

?????????
?????????е????д???????? GitHub ???????????κο?????????????????????????Ч???????????????? E2E ????????????????????????????????????????Щ?????????Щ????????????Σ???????????????
????· ???????P0???????????裿??????????????????????????TestCafe ???????
????· ???????P0?????????????????API ?ο???????????????????е???????????
????· ?????????P0?????????й???????????????????????????CasperJS ?????У?
????· ????????P0???????????????????? CI ?????????
????· ??????棺P0?????????????棿??????? CI ???????????????? XML??JUnit ?????????
????· ????????P0?????????????????????????????????TestCafe ???????
????· ?????????P1????????????е???????????????????????????????????????????????????????????????Protractor ?? CodeCeptJs ????
????· ??????P1???????????ζ????????????????????????TestCafe??CodeCeptJs ?????
????· ????????P2??Χ?????????????г??????????????????????????????
????· ????????P3???????? API ?????????????Σ?
????????????????????? E2E ??????????????????б????????????????????????????????????С?????????????????
?????????????????汾????? Medium ??????￡??????????????????????????????????????????????????????????????????t??飬??????????????????????????????????????????