Improving Web Application Quality - SenchaCon Roadshow 2016

Transcript

2. Improving Web Application Quality Olga Petrova
3. Agenda • Sencha Test for - Developer - QA Engineer - DevOps Engineer • Sencha Test features • Demo
4. Roles • Developer • QA Engineer • DevOps Engineer
5. Developer Tom
6. Tom’s dreams • Less bugs • Easy refactoring • Better code understanding • Better code design
7. Tom’s problems • Application complexity • Asynchronous nature • Hard to mock • Short release time
8. Sencha Test for Tom
9. Test types • Unit tests • UI Unit tests • Functional tests
10. Unit Testing • Models • Stores • Controllers • Setup and Teardown • Test before PR
11. UI Unit Testing • UI components • UI component sets
12. Functional Testing • Solid piece of application functionality that includes several UI components and classes
13. Runtime environment In-Browser • Single-page application • Run application and tests in browser • Run in several browsers simultaneously Web Driver • Multi-page application • Run tests outside of the browser using WebDriver • Test any web applications
14. Sencha Test API • Component/Element future wrapper - ST.grid() - ST.component() - ST.element() • Calls that wait for the component to be in a certain state - .rendered() - .disabled() • Actions - .click() - .type(’mytext')
15. Sencha Test API • Assertions - .expect('value').toBe('test-username') - .expect('innerHTML').toContain('my-container') - .expect('visibility').toBe('visible') - .get('height') .and(function () { expect(this.future.data.height).toBe(200); }))
16. Sencha Test API • New features for WebDriver tests: - ST.execute - ST.navigate
17. Sencha Test Inspector • find component locators • paste locators directly into the test code or create page object
18. Sencha Test Page Object • clean separation between test code and component locators • single repository for the components on the page
19. Developer’s Demo
20. QA Engineer Alice
21. Alice’s dreams • Easy test writing automation • Good code coverage • Defense against regressions
22. Alice’s problems • Uncontrollable environment • Application complexity • Asynchronous nature • Short release time
23. Sencha Test for Alice
24. Application Testing • Black Box • Mimic user behavior
25. Runtime environment Web Driver • Multi-page application • Run tests outside of the browser using WebDriver • Test any web applications
26. Event Recorder • Faster test creation • Improved element locator strategies lets to avoiding the use of dynamic IDs • Choosing component locator strategy • Editing values in recorded script
27. Visual Screen Comparison • Visual comparison of application screenshots generated in different browsers: - ST.screenshot • Fixed screen size settings for visual testing
28. Code Coverage • Build-in integration with Istanbul
29. QA Engineer’s Demo
30. DevOps Engineer Steve
31. Steve’s dreams • More confidence in the code, less fear about releases • Easy releases automation • Be able to release at any time
32. Steve’s problems • Integration of automated tests into CI environment • Short release time
33. Sencha Test for Steve
34. Selenium server and Browser farms • Integration with browser farms • Integration with Selenium WebDriver • Embedded Selenium Server and Browser (Chrome)
35. Archive Server • Review and Analyze Test Results from Multiple Runs • Remote and Local Archive Servers
36. ALM Integration • Publish bugs directly to the JIRA project • Ignore false negatives • Review the latest bug status
37. Continuous Integration CI • Integration with Jenkins and Team City • Command Line Interface (CLI) • Store results from multiple Continuous Integration (CI) runs
38. Continuous Integration • True automation - Let the machine do the heavy lifting • Run Tests at every stage • Integrate with build systems • Run tests on multiple environments - QA - Staging - Production • Leverage browser farms
39. DevOpts’s Demo
40. What’s in Sencha Test 2.1? • Inspector • Page Object • External Libraries • Local Archive Server • Generation of screenshots by running tests from Sencha Studio • ALM Integration
41. Sencha Test 2.1 http://sencha.com/products/test/