The document discusses end-to-end testing tools and focuses on CodeceptJS. It provides an overview of CodeceptJS, describing it as a high-level API for controlling browsers and executing tests from a user's perspective in a synchronous manner. It also demonstrates how to install, configure and run basic tests with CodeceptJS and references the documentation for its locators, assertions and helper functions.

1. E2E tool introduce
@Caesar

2. Caesar Chi
clonncd

3. Caesar Chi 2.0
clonncd

4. Do you have e2e test?

7. Maybe QA team in E2E?

8. How many resource
do you have?

9. Test UI by yourself.
Stand out DRY principle

10. There are so many UI
auto test tool.

13. that sounds great,
lets code for e2e test

14. But e2e test so hard

15. Less
• hard to code
• assertion is bad
• have to know deeply flow control
• big gap for newbie

16. Protractor

17. Protractor
Go to target Url

18. Protractor
An assertion

19. Protractor
Selector and do something

20. Protractor
Another assertion

21. Protractor
Another assertion
What the …

22. E2E codecept.io

23. http://codecept.io/

24. codecept.js
• Every command is described as an action of a user
visiting a site.
• CodeceptJS provides a general high-level API
which can easily be executed
• Control browser in realtime with API of CodeceptJS

25. codecept.js
• Synchronous Tests API
• user's perspective
• Backend agnostic
• PageObjects supported
• Written in ES6 without transpilers.

26. codecept.js

27. codecept.js
Helper

28. Codecept.js VS …

29. VS
• sss

30. VS
• sss

31. VS
• sssss

32. Codecept.js example

33. codecept.js

34. codecept.js
Go to target Url

35. codecept.js
An assertion

36. codecept.js
Selector and do something

37. codecept.js
Another assertion

38. codecept.js
Another assertion

39. Codecept.js install

40. Codecept.js
npm install -g codeceptjs
npm install -g webdriver-manager
And
And
npm install -g webdriverio

41. Codecept.js up & run

42. Codecept.js
$ codeceptjs init
Generate a config of codecept.js

43. Codecept.js
$ codeceptjs gt
Generate a basic test.js of codecept.js

44. Codecept.js
Edit basic_test.js file content

45. Codecept.js
$ codeceptjs run
Runs codecept.js test

46. sssss

47. Codecept.js locator

48. I.amOnPage
http://codecept.io/helpers/WebDriverIO/#amonpage

49. I.fillField
http://codecept.io/helpers/WebDriverIO/#fillfield

50. I.click
http://codecept.io/helpers/WebDriverIO/#fillfield

51. I.checkOption
http://codecept.io/helpers/WebDriverIO/#checkoption

52. I.selectOption
http://codecept.io/helpers/WebDriverIO/#selectoption

53. I.acceptPopup
I.cancelPopup
http://codecept.io/helpers/WebDriverIO/#acceptpopup

54. Codecept.js assertion

55. I.see
http://codecept.io/helpers/WebDriverIO/#see

56. I.seeElement
http://codecept.io/helpers/WebDriverIO/#seeelement

57. I.seeInTitle
http://codecept.io/helpers/Protractor/#seeintitle

58. Codecept.js helper

59. I.saveScreenshot
http://codecept.io/helpers/Protractor/#savescreenshot

60. I.resizeWindow
http://codecept.io/helpers/Protractor/#resizewindow

61. I.acceptPopup
I.can cancelPopup
http://codecept.io/helpers/WebDriverIO/#acceptpopup

63. Codecept.js comprare

64. codecept.io
Protractor

65. Codecept.js recap
• Support popular test framework (mostly)
• Not another test framework
• Make people easy to use
• Make people easy to read

66. Codecept.js recap
• Support popular test framework (mostly)
• Not another test framework
• Make people easy to use
• Make people easy to read
• But have to know …

67. Life is short
Test is needs
https://leanpub.com/frontend_e2e_test_guidebook