Testing Salesforce Apps with Siesta

From the Financial Force DevTalk January 2015 in San Francisco

Transcript

1. Mats Bryntse, Bryntum Testing Web Apps with Siesta @Bryntum
2. Intro | DESCRIPTION Who am I? Ext JS since 2007 Bryntum: Gantt charts, JS Testing tools
3. Intro | DESCRIPTION We created Siesta since developing JS components is very hard.
4. Webinar | Content Unit tests UI tests Continuous Integration • Writing a unit test • Using PhantomJS • Hello world sample • Event recorder intro • Testing an Ext JS cmp • Recording a UI test • TeamCity • Code Coverage • Statistics • Cloud Testing + How Siesta can help you test SalesForce apps
5. Intro | WHY Hands up: Who is testing their JS?
6. Intro | WHY Why Testing?
7. Intro | WHY
8. Intro | WHY 1. Productivity & confidence in code 2. Frameworks contain bugs 3. So does your code (and mine) 4. Refactoring & code handover 5. Fix bugs once
9. Intro | TERMINOLOGY Terminology: what does testing mean for a JS developer?
10. Intro | TERMINOLOGY Unit tests, UI tests, Application tests, Monkey tests..?
11. Intro | TERMINOLOGY Unit tests App Tests UI tests
12. Testing With Siesta Introduction
13. Intro | Testing with Siesta • runs in any browser • is written in plain JS • is sandboxed by default A Siesta test…
14. Intro | Testing with Siesta • can do both UI and unit testing • can be automated using PhantomJS or Selenium WebDriver • can detect leaked global variables A Siesta test…
15. Intro | Testing with Siesta describe('A simple Model test', function (t) {
 
 t.it('Should do something', function(t) {
 
 // Test things
 t.expect(1).toBe(1);
 });
 });

16. Unit Tests Red, Green, Refactor
17. Unit tests | Intro •Unit tests usually only involve “raw” JS •Run very fast •Perfect for pre-commit hooks •Disable sandboxing if possible
18. Unit tests | Intro •Should be your #1 priority •Cover your most important JS classes •Run often, before commit, daily, nightly. •Use TDD approach + BDD style for readability
19. Unit tests | TDD basics 1. Make the unit test fail 2. Implement 3. Make the test pass 4. Refactor, Repeat
20. Unit tests | Writing a unit test Unit testing demo
21. Testing your UI Functional testing
22. UI tests | Intro Manually writing UI tests takes time
23. UI tests | Intro UI tests are more fragile & run slower than unit tests
24. UI tests | Intro Understanding CSS and ComponentQuery is key
25. UI tests | Intro •UI “unit test” of a single UI component •Or Application test, open index.html and test it Two main types of UI tests
26. UI tests | Intro UI Unit test demo
27. UI tests | Intro Siesta Event Recorder
28. UI tests | Event recorder •Great for application tests •Records user actions: clicks, types, drag drop •Exports actions to a Siesta test case •Can be used by a non-programmer •Big timesaver
29. UI tests | Event recorder Let’s try the recorder
30. UI tests | Intro Application test demo Testing the Siesta UI with Siesta
31. UI tests | Monkey tests Monkey testing
32. UI tests | Monkey tests •Random UI testing •Clicks, drags etc. in your UI •Finds unhandled exceptions •Free testing help. 0€
33. UI tests | Monkey tests Cost breakdown: $5 * 0 = 0 $5
34. Continuous Integration TeamCity, Code Coverage & Statistics
35. Continuous Integration | Intro •Bryntum uses TeamCity, Siesta integrates with others (Jenkins…) •Test suites run every 2 hours in Chrome •Full test suites executed nightly •Reports, statistics, charts and code coverage
36. Continuous Integration | TeamCity Let’s checkout TeamCity
37. UI tests | Cloud testing So…running in multiple browsers?
38. Continuous Integration | Cloud testing •Need to create Virtual Machines for each version of IE •Total: Chrome, Safari, FF, IE 7-11 => 7 VMs •Managing such a farm can be very time consuming
39. Continuous Integration | Cloud testing •Siesta integrates with both BrowserStack and Sauce Labs •Run tests easily in any OS and Browser combination •No need to setup your own VM farm •Read more on the Bryntum blog…
40. Continuous Integration | Cloud testing Testing a SalesForce UI
41. Rounding up | Links •bryntum.com/products/siesta •bryntum.com/docs/siesta •teamcity.bryntum.com/guest •browserstack.com/ •saucelabs.com/
42. Rounding up | Questions Questions? Twitter: @Bryntum