DevOpsDays Philadelphia 2019 presentation. Zero to Hero: Start Test automation with Cypress In DevOps world, test automation is a must have. But start coding could be challenging for people novice in tech and also for the ones working in manual testing (because someone said that testers don’t need technical skills)! In this “right to the point” workshop you’ll start your automation test project - easy and painlessly. It’ll give you knowledge to continue learning and practicing after.

1. Testing
with
Cypress

2. Follow us
@danivieira
@karolineleite

3. Today’s subject

4. Why automate testing?

5. ➔ Reduce time and effort
➔ Increase productivity
➔ Increase reliability

6. What tests to automate?

7. ➔ Regression tests
➔ Smoke tests
Following the user journey and respecting the test pyramid

8. How to automate?

10. CYPRESS
WebApp. Chrome. Fast.Javascript.

12. Let’s code!

13. Installing Cypress
● Visit https://download.cypress.io/desktop
Installing an editor
● Visit https://atom.io/

14. 1. Create a folder to the project
2. Open the folder with Cypress
3. Open the folder with your editor
4. Create a file to our first test, inside the folder:
cypress/integration/

15. it('Does not do much!', function() {
})

16. it('visits Google', function() {
cy.visit('http://google.com')
})

17. Basic interaction

18. cy.visit('https://example.cypress.io')
cy.title().should('include', 'Kitchen Sink')
cy.get('#query-btn').should('contain', 'Button')
Commands are what you send to the browser
Asserts are what validate the results
Selectores are how you identify the web elements

19. ● Identifiers for HTML elements
● Be simple: ID, NAME, ATTRIBUTES, CSS
● Avoid: XPATH
Selectors

20. 1. Create another test file inside the integration folder
2. Open the website https://the-internet.herokuapp.com/
3. Create one test for the ‘Forgot Password’

21. 1. Create another test file inside the integration folder
2. Open the website https://the-internet.herokuapp.com/
3. Create one test for the ‘Form Authentication’

22. 1. Let’s create more alternative test scenarios for Form
Authentication

23. describe('Does not do much!', function(){
})

24. describe('Does not do much!', function(){
it('Does not do much again!', function() {
})
})

25. describe('Does not do much!', function(){
it('Does not do much again!', function() {
})
it('Does not do anything', function() {
})
})

26. 1. Create another test file inside the integration folder
2. Open the website https://the-internet.herokuapp.com/
3. Create one test for the ‘Add/Remove elements’

27. Versioning the code

28. Git & Github
If you know nothing about Git and Github, let's do it:
1) Download & install GIT: https://git-scm.com/downloads
2) Create an account on Github https://github.com/
a) Add your SSH keys to your Settings
b) Create a new repository
c) git init
d) git remote add origin git@github.com:<your_repo_here>
e) git add
f) git commit -m "first commit"
g) git push -u origin master
Using the command
line in your computer

29. Running on
Cypress Dashboard

30. Cypress dashboard
1) Create an account on Cypress Dashboard
https://dashboard.cypress.io using your Github account
2) Setup your project locally on Cypress
a) To run by command line you need to install NODE.JS and NPM
https://nodejs.org/en/download/
b) npm init -y
c) npm install cypress
d) npx cypress run --record --key <your_key>

31. Running on CI/CD

32. CircleCI
1) Create an account on CircleCI: https://circleci.com/ using
your Github account
2) Add your project at “Add projects” menu
a) Follow the basic instructions
b) Create the .circleci/ folder and add this file: http://bit.ly/circleci
c) Add command line instruction to package.json file

33. https://testautomationu.applitools.com/cypress-tutorial/
https://github.com/testgirls/cypress-project-en

34. OBRIGADA!
THANK YOU!
ola@testgirls.com.br
dani@testgirls.com.br +55 (11) 98650-7473
karol@testgirls.com.br +55 (11) 97328-1445
Follow us
https://www.linkedin.com/company/test-girls/
https://www.meetup.com/test-girls
https://twitter.com/_testgirls
https://www.instagram.com/_testgirls/
https://facebook.com/thetestgirls