Sharing the pain using Protractor
4 likes6,826 views
The document discusses challenges and solutions encountered during the testing of a single page application using Protractor and Webdriver. It emphasizes the importance of quality as a team responsibility, the difficulties with JavaScript and browser support, and various strategies implemented to enhance test automation. Key takeaways include choosing an appropriate tech stack, managing automation risks, and continuously learning to improve testing practices.
Sharing the pain using Protractor
- 1. SHARING THE PAIN – PROTRACTOR & WEBDRIVER Nikitha Iyer Developer Anand Bagmar Software Quality Evangelist
- 3. Why are you here?
- 4. Case Study
- 5. DOMAIN
- 6. USER BASE
- 7. USAGE
- 9. Disclaimer
- 10. Why Protractor?
- 11. TEAM OWNS QUALITY Testing ≠ Testers Quality is a Team Responsibility
- 12. Unit (xUnit / JavaScript) Component Integration View Web Service UI Manual / Exploratory P e r f o r m a n c e S e c u r i t y Accessibility TEST PYRAMID
- 13. TEAM COMPOSITION & SKILLS
- 14. OPTIONS LOOKED AT q Cucumber-JVM / Cucumber-Ruby q WebDriver-JS q Protractor
- 15. Challenges
- 16. CHALLENGES - JAVASCRIPT What is Test Automation? Synchronous, Step-by-Step execution ASynchronous Callbacks & Promises! Power of JavaScript?
- 17. CHALLENGES – BROWSER (& OS) SUPPORT Browser / Driver Why? Challenges phantomJS Headless execution - easier for developers - Seamless CI integration - Officially not recommended by Protractor Chrome - End-user requirement - Excellent for development & testing - Certain elements “not visible” – though worked with Firefox Firefox - End-user requirement - Worked locally - Worked in CI – in headless (xvfb), but NOT for maps - Worked in headless mode (xvfb) in vagrant
- 18. CHALLENGES – BUILD TOOL INTEGRATION Gulp-angular-protractor Gulp-protractor Protractor Selenium-WebDriver Gulp
- 19. CHALLENGES - ANGULAR Type Example Angular Directives Ex: ng-repeat, ng-model Custom Directives Ex: third party libraries providing multi-column select, Sliders for range, Charts Working with non-Angular Ex: Login, Admin
- 20. CHALLENGES - DEBUGGING Setting breakpoints while handling promises
- 23. SOLUTIONS – SIMPLIFY BUILD TOOL INTEGRATION Protractor Selenium-WebDriver Gulp
- 24. SOLUTIONS – DETERMINISTIC TEST DATA q Same Test Data in all environments / tenants q Minimal Environment specific configuration q Intelligent ‘before’ & ‘after’ setups
- 25. SOLUTIONS – UTILITIES Page functions - Common behavior - Non-angular Screenshots with counters Unique output directory names JS Console warnings & errors Chart functions CSV loader Modals & Alerts File Upload File Download Custom Locators Configurations
- 26. SOLUTIONS - LEARN • JavaScript • Angular • Protractor
- 27. DID WE SOLVE ALL THE PROBLEMS? JUST KIDDING!!! Of course, NO!! - Maps - Reports - How many and where to put “assertions”? - Use Soft-asserts YES!!!
- 28. OUR TAKEAWAYS FROM THIS PAIN & GAIN! q Choose tech-stack based on context q Experiment & Fail-Fast! q Proper Cost-Value evaluation q Manage Risk (what to automate – now / later, and what NOT to automate) q Keep learning & sharing – new and better solutions 28
- 29. REFERENCES Page Objects – Google - https://code.google.com/p/selenium/wiki/PageObjects Page Objects – Martin Fowler - http://martinfowler.com/bliki/PageObject.html Perils of Page-Object Pattern – Anand Bagmar - http://essenceoftesting.blogspot.in/2014/09/perils-of-page-object-pattern.html Protractor – https://docs.angularjs.org/guide/e2e-testing, http://www.protractortest.org/#/ Learn Protractor for Angular – https://docs.angularjs.org/tutorial Sample project – https://github.com/NikithaIyer/angular-phonecat-e2e