Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

End 2-end testing of mean applications

360 views

Published on

The presentation is about the tools I used in order to test an Angular.js application.
Other topics:
- Why is automation testing important ?
- Selenium Builder
- Protractor
- Achievements

Published in: Engineering
  • Login to see the comments

End 2-end testing of mean applications

  1. 1. End—2—End testing of MEAN Applications Mihai-Cristian Fratila QA Engineer I-IPLN R&D team
  2. 2. Why do we need automated e2e testing?
  3. 3. Why do we need automated e2e testing? - Increases tester's motivation
  4. 4. Why do we need automated e2e testing? Increases tester's motivation — Work process gets to be more dynamic
  5. 5. Why do we need automated e2e testing? Increases tester's motivation - Work process gets to be more dynamic Good quality of the product
  6. 6. Why do we need automated e2e testing? Increases tester's motivation Work process gets to be more dynamic Good quality of the product Regression defects found in time
  7. 7. Why do we need automated e2e testing? Increases tester's motivation Work process gets to be more dynamic Good quality of the product Regression defects found in time Avoids repeatability
  8. 8. Old HP Live Network Portal Io-vunr-1-yn sumunns-nzsnnazunnau Suwun an-w-.
  9. 9. How can we improve the quality?
  10. 10. - Click & Record tools -> first step into automation How can we improve the quality? Selenium Builder
  11. 11. Selenium Builder Firefox addon, open source, hosted on Github Records user's actions on a website Save script and run it locally or on a Selenium Server
  12. 12. Selenium Builder Firefox addon, open source, hosted on Github Records user's actions on a website Save script and run it locally or on a Selenium Server Sdvurvfizlfil SELENIIIMBUILDEII | ' - Master way to build tests. um-at-um. .. .-an. .. nu. ..-
  13. 13. {; ~Ei: +I Ierfii Lil T31 I got IIt! pslIInastD1d sans hp cum! 2 auerfiext M’ at user~ssMogm—Iogm @ Log n 3 cickslemem inktexl Lngln 4 unrfiext locator Id sIgn| nName E 5 uaerlfext M if nusswnvd I4‘ 5 sctzlementrext locatur as sIgn| nName E mmufralllu 7 satilemenfiext localor id password E gIawcecny1 6 uaerrren lmator name slgrwn ILI 9 ciI: kE| eme1It name sign-m ID uuerfiext locator as user—ssmog. n—name Q mhulfrutila H mouseomaemem n usev-sso-Ing| n~nu| ne I2 l: I'I: kE| elneM lnklexl Log Out
  14. 14. Selenium Builder Advantages: Record multiple scenarios and re-run them every time it was needed Increase testing speed Catch regression defects faster
  15. 15. Selenium Builder - Disadvantage:
  16. 16. Selenium Builder . Disadvantage; -. ... ..-. ... .. sum. .. mm M. .. . ..a. u. 3-avnrv rnrvnu HPE Live Network Content Marketplace
  17. 17. New MEAN Portal What's changed from UX and user's E2E point ofview? Ibnhchan mm -, .«. « mm. ». ..m. 5.. .." HPE Llve Network Content Marketplace
  18. 18. New MEAN Portal What's changed from UX and user's E2E point ofview? mm. ... .. aw. W. .. ..“ . ... “ Swan , » Single-Page App. HPE Uve Network Content Marketplace
  19. 19. New MEAN Portal What's changed from UX and user's E2E point ofview? mm. ... .. Sclwwm . ... .. ... . . ... .. Swan . » Single-Page App. HPE Uve Network Content Marketplace Content displayed dynamic.
  20. 20. New MEAN Portal What's changed from UX and user's E2E point ofview? mm. ... .. Sclwwm . ... .. ... . . ... .. Swan . » Single-Page App. HPE Uve Network c°"'°'" M""°"'a°° Content displayed dynamic. Transition between states is done in a flawless way. No lag or glitches.
  21. 21. New MEAN Portal —F‘E Community — IT Operations
  22. 22. New MEAN Portal Community content for 0010 for integrating with IT management systems such as BMC Atrium, ... Version 656 Free
  23. 23. Selenium Builder could not achieve this
  24. 24. Selenium Builder could not achieve this Export Selenium Builder scenarios
  25. 25. Selenium Builder could not achieve this Export Selenium Builder scenarios Protractor
  26. 26. Protractor End 2 end testing framework for Angular ]S applications Open source, hosted on GitHub Records tests running in a real browser Interacts with page element as the real user would Uses the Jasmine framework for testing Iavascript code
  27. 27. Protractor End 2 end testing framework for Angular IS applications Open source, hosted on GitHub Records tests running in a real browser Interacts with page element as the real user would Uses the Iasmine framework for testing Iavascript code Protractor mi lI‘~ mi I-«. liI’iL“ «at A tip,
  28. 28. jdesctibe ( ' ' . ‘ betotelachtthnctxanl) I browaer. driver. mu: iaqe() . wind. ow() . max)'. inize(); , fIll. u:t. ian() ( I): ] xt: ('; .‘, nam: :1on() I var text, value, bonl, source, url, title; var Ieetvus ‘ I): brauser. ignnze5ynchmnizat-. inn = true; b: ausez. ge: (" : 3: ' * text = e1emnc(by. id(' expe: ::(: exi: ) . t:oCom: ain( ); e1ement(by.11nl(lext: ("L: _ ). c11ck() . Lhen(fln'lictIm() I text = element-. (by. id( , ,,, ,M, :,, v;, ;-"')) . get: Text() : expeci: (i: exi: ) . i:oCom: ain( text = e1eI: nt: (by.1d("; expect: (t: e)n: ) . I:oConI: ain( element: (by.1d("; ;,; g;, ;a; ;") I . :endKey: ("' e1emeni: (by.1d("; .")) . aend. Keys(" 1") : next - element: (by. expecttcext) . t:oCont: a1n("' I I e1emn: (by. id(" ') ) . l:1il': I((): ). qet1'ext(lr ))) . perfom(): can = e1eI2m: (by. id("u cexr. - element: (by.1ink’l'exI: I): )) . r:1ir: k() . ‘
  29. 29. Protractor Test Angular pages alongside non—Angular pages. Set up this framework independently from the developer's code.
  30. 30. Protractor Test Angular pages alongside non-Angular pages. Set up this framework independently from the developer's code. Achievements:
  31. 31. Protractor Test Angular pages alongside non-Angular pages. Set up this framework independently from the developer's code. Achievements: Write efficient tests Automate as much features as possible Catch regression defects and keep the product stable Maintain the tests — project keeps changing
  32. 32. Old vs. MEAN - No automated e2e tests - Old technology - Regression defects uncaught
  33. 33. Old vs. MEAN uni Llve mum Conlvnt Marketnliu No automated e2e tests — Automated e2e tests with Protractor Old technology - MEAN technology Regression defects uncaught - Regression defects caught in time
  34. 34. What's next?
  35. 35. What's next? Integration with our CI tools Run the tests as part of a nightly build Collect reports after running the suite
  36. 36. What's next? Integration with our CI tools Run the tests as part of a nightly build Collect reports after running the suite Integrate it to run with multiple browsers, including IE
  37. 37. What's next? Integration with our CI tools Run the tests as part of a nightly build Collect reports after running the suite Integrate it to run with multiple browsers, including IE Connect it with our bug tracking tool
  38. 38. What's next? Integration with our CI tools Run the tests as part of a nightly build Collect reports after running the suite Integrate it to run with multiple browsers, including IE Connect it with our bug tracking tool Measure code coverage
  39. 39. DEMO
  40. 40. DEMO Let's keep in touch: mihai-cristian. fratila@hpe. com
  41. 41. DEMO Let's keep in touch: mihai-cristian. fratila@hpe. com More about my work: https: / ztribulitroz 3 L. .. . n.= . um 4:12! ‘-7

×