ExtJS WebDriver

11,277 views

Published on

Published in: Technology

ExtJS WebDriver

  1. 1. WebDriver Tests for ExtJS Applications Andrii DzyniaSaturday, March 2, 13
  2. 2.                              Andrii  DzyniaSaturday, March 2, 13
  3. 3.                              Andrii  Dzynia Test  Engineer/Consultant/TrainerSaturday, March 2, 13
  4. 4.                              Andrii  Dzynia Test  Engineer/Consultant/TrainerSaturday, March 2, 13
  5. 5.                              Andrii  Dzynia Test  Engineer/Consultant/TrainerSaturday, March 2, 13
  6. 6.                              Andrii  Dzynia Test  Engineer/Consultant/TrainerSaturday, March 2, 13
  7. 7.                              Andrii  Dzynia Test  Engineer/Consultant/Trainer @adzyniaSaturday, March 2, 13
  8. 8.                              Andrii  Dzynia Test  Engineer/Consultant/Trainer @adzynia h8p://adzynia.comSaturday, March 2, 13
  9. 9.                              Andrii  Dzynia Test  Engineer/Consultant/Trainer @adzynia h8p://adzynia.comSaturday, March 2, 13
  10. 10. Technical Context • Java Enterprise Application • ExtJS on UI level • WebDriver for Test AutomationSaturday, March 2, 13
  11. 11. What is ExtJS? Ext JS is a pure JavaScript application framework for building interactive web applications using techniques such as Ajax, DHTML and DOM scripting.Saturday, March 2, 13
  12. 12. Demo http://docs.sencha.com/ext-js/4-1/extjs-build/examples/Saturday, March 2, 13
  13. 13. First Stage As UsualSaturday, March 2, 13
  14. 14. Locators • css = button[id *= ‘add_user_action’] • css = .x-panel.x-grid-with-row-lines • name = title • xpath = "//*[@class=x-column-header-text and text()=Due Date]"Saturday, March 2, 13
  15. 15. BuildersSaturday, March 2, 13
  16. 16. WaitForExtJsSaturday, March 2, 13
  17. 17. Custom WaitersSaturday, March 2, 13
  18. 18. ExceptionsSaturday, March 2, 13
  19. 19. ActionsSaturday, March 2, 13
  20. 20. Results Traditional approach Code can be too complex Help in simple cases No reusable componentsSaturday, March 2, 13
  21. 21. Who was solving this before? • https://github.com/mariominati/test-www- selenium-extjs/tree/master/Test-WWW- Selenium-ExtJS • https://github.com/asaflevy/SelenuimExtend/  • https://github.com/cathoderay/selenium- extjs • http://code.google.com/p/extenium/Saturday, March 2, 13
  22. 22. Second Stage ExtJSElementObjectsSaturday, March 2, 13
  23. 23. ExtJSComboBoxSaturday, March 2, 13
  24. 24. ExtJSComboBoxSaturday, March 2, 13
  25. 25. ExtJSMessageBoxSaturday, March 2, 13
  26. 26. ExtJSGridTableSaturday, March 2, 13
  27. 27. ExtJSGridTableSaturday, March 2, 13
  28. 28. Results Reusable components WebDriver is so slow Can be extended IE is critical slow!Saturday, March 2, 13
  29. 29. Stage 3 JavaScript InjectionsSaturday, March 2, 13
  30. 30. ExtJS API Ext.get(id).dom.value Ext.ComponentQuery.query(panel[cls=myCls]); Ext.select(selector) Ext.core.Element.select(selector, unique, root) Ext.getDom(el)Saturday, March 2, 13
  31. 31. DemoSaturday, March 2, 13
  32. 32. JS InjectionSaturday, March 2, 13
  33. 33. Results Not real-user Faster! actionsSaturday, March 2, 13
  34. 34. Lessons Learned • Think how you will be testing at first • Work side-by-side with front-end developers • Delegate ExtJS magic for your Elements APISaturday, March 2, 13
  35. 35. @a dz me yn @a ia dz yn ia.c om ad zy n ia. co mSaturday, March 2, 13

×