QA Fest 2017. Александр Хотемской. Современные возможности в организации ProtractorJS фреймворка
- 1. Welcome to presentation wizard Modern Features in ProtractorJS framework Oleksandr Khotemskyi 2017
- 2. • Async/Await – a hero we deserved • Deprecation of control flow – what to do next? • TypeScript – superset of javascript • Blocking proxy – waitForAngular for everyone • Webdriver-manager features • Bonus
- 4. Asynchronous code • Harder for humans, easier for computer • Task does not wait for previous task to complete • Order of tasks should be specified explicitly by callbacks • Consumes much less resources than splitting to threads • Asynchronous code allows to work with IO operations much more efficiently
- 6. Tests are synchronous by their nature • Each step in UI functional tests should be done in strict order • This requires “synchronization” approaches of asynchronous code: • Callbacks • Promises chaining • Generators • Fibers, corutines • Async/Await • other
- 7. Control Flow • WebdriverJS now uses variation of task queue approach
- 8. Control Flow • Increased complexity – this module is 3300 lines of code • One of the hardest thing to understand in WebdriverJS • Hard to debug
- 10. Async/Await • Native approach to synchronize your asynchronous code • Hides internal Promises based implementation • Introduced as part of ECMAscript 7 specification
- 14. Handling errors
- 15. Iterating
- 16. More functional style Iterating
- 17. How to enable • NodeJS >7.8 or use Babel • For TypeScript – async/await could be compiled to ES3 compatible code • Set - SELENIUM_PROMISE_MANAGER: false in your protractor config file • DO NOT mix control flow and async/await code – execution flow will be unpredictable
- 19. Control flow is deprecated • https://github.com/SeleniumHQ/selenium/issues/2969 • Phase 1: allow users to optionally turn off of the control flow • Phase 2: (October 2017) users must turn on the control flow • Phase 3: (October 2018) removing the control flow
- 20. Be ready for deprecation • Set - SELENIUM_PROMISE_MANAGER: true in your protractor config file explicitly right now (or env variable SELENIUM_PROMISE_MANAGER : 1) • This will give you one year to migrate your code away from control flow • More instructions and tips here: https://github.com/SeleniumHQ/selenium/wiki/WebDri verJs#moving-to-asyncawait SELENIUM_PROMISE_MANAGER
- 22. TypeScript lang • Developed by Microsoft, open source • Compiles into JavaScript • Optional types • ProtractorJS written with TypeScript
- 27. Private methods
- 28. Some features • ES6 imports/exports • async/await • Mixins, Enums, Interfaces, Abstract Classes • Iterators/Generators • Generics • Property/class/parameter decorators (experimental)
- 30. Blocking Proxy • Automatically executes waitForAngular before any selenium action. Blocks actions execution • Works on network level, not language level • Can highlight interactions • Can additionally log requests • Works with any language
- 31. Your tests Selenium Server Browser Blocking Proxy Driver (2) Selenium action (1) waitForAngular()
- 33. Webdriver-manager • Can setup Android SDK and virtual mobile devices https://github.com/angular/webdriver- manager/blob/master/docs/mobile.md • Can install Appium • Can download and prepare any version of webdriver and selenium-standalone server • `clean` and `status` - are useful to check what happens
- 34. Useful links • Modern generator with async/await, TS, and other: https://github.com/Xotabu4/generator-modern- protractor • Some examples from this presentation - https://github.com/Xotabu4/modern_protractor_demo • Blocking-proxy - https://github.com/angular/blocking- proxy • Webdriver-manager - https://github.com/angular/webdriver-manager