Your SlideShare is downloading. ×
[CLIW] Web testing
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

[CLIW] Web testing

1,394
views

Published on

Short presentation about web testing

Short presentation about web testing

Published in: Technology

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,394
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
12
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Web testing A general approach CLIW Bogdan GazaTuesday, January 10, 12
  • 2. Agenda What is web testing? Tools & techniques Practical examples - demo Conclusions CLIW Bogdan GazaTuesday, January 10, 12
  • 3. What is web testing? • Write a lot of code implies that someday things will break / stop working • Fixing a bug is simple, finding it can be difficult • Finding a bug while trying to maintain cross-browser compatibility can be a nightmare CLIW Bogdan GazaTuesday, January 10, 12
  • 4. What is web testing? ... software testing with a focus on web applications. CLIW Bogdan GazaTuesday, January 10, 12
  • 5. How can we do web testing? • Different approaches: - Unit testing client side code - Client side performance testing - Usability testing - Functional testing - etc CLIW Bogdan GazaTuesday, January 10, 12
  • 6. Unit testing for client side code CLIW Bogdan GazaTuesday, January 10, 12
  • 7. Unit testing for client side code • Why? • Cross browser issues • Refactoring & Bug fixing can produce unforeseen problems • When? • When code base is large enough • When cross browser compatibility is a must CLIW Bogdan GazaTuesday, January 10, 12
  • 8. Unit testing for client side code • Popular frameworks: • QUnit • JSUnit • Selenium • YUITest • and many more CLIW Bogdan GazaTuesday, January 10, 12
  • 9. Unit testing for client side code • Popular frameworks: • QUnit • JSUnit • Selenium • YUITest • and many more CLIW Bogdan GazaTuesday, January 10, 12
  • 10. Unit testing for client side code • QUnit • Built for jQuery • Break code into logical chuncks for testing • Focus on one method at a time • http://docs.jquery.com/QUnit CLIW Bogdan GazaTuesday, January 10, 12
  • 11. Unit testing for client side code • QUnit test("a basic test example", function() { ok( true, "this test is fine" ); var value = "hello"; equal( value, "hello", "We expect value to be hello" ); }); module("Module A"); test("first test within module", function() { ok( true, "all pass" ); }); test("second test within module", function() { ok( true, "all pass" ); }); CLIW Bogdan GazaTuesday, January 10, 12
  • 12. Unit testing for client side code • QUnit CLIW Bogdan GazaTuesday, January 10, 12
  • 13. Unit testing for client side code • Automatation • Running unit tests outside the browser? CLIW Bogdan GazaTuesday, January 10, 12
  • 14. Unit testing for client side code • Unit tests for client side code can be integrated with current build systems • Using Node.js / Rhino we can create a browser-like environment CLIW Bogdan GazaTuesday, January 10, 12
  • 15. Unit testing for client side code • PhantomJS • Headless WebKit with JavaScript API • Native support for various web standards: DOM handling, CSS selector, JSON, Canvas, and SVG. • PhantomJS can be controlled or scripted using JavaScript API CLIW Bogdan GazaTuesday, January 10, 12
  • 16. Unit testing for client side code • PhantomJS • Headless WebKit with JavaScript API • Native support for various web standards: DOM handling, CSS selector, JSON, Canvas, and SVG. • PhantomJS can be controlled or scripted using JavaScript API CLIW Bogdan GazaTuesday, January 10, 12
  • 17. Client side performance testing CLIW Bogdan GazaTuesday, January 10, 12
  • 18. Client side performance testing In order to measure client side performance testing, metrics about the environment need to be gathered. Ex: How much times does it take to load the page? CLIW Bogdan GazaTuesday, January 10, 12
  • 19. Client side performance testing • Measuring: • Insert JS code and measure performance • Browser web developer tools - waterfall diagram CLIW Bogdan GazaTuesday, January 10, 12
  • 20. Client side performance testing CLIW Bogdan GazaTuesday, January 10, 12
  • 21. Usability testing CLIW Bogdan GazaTuesday, January 10, 12
  • 22. Usability testing • Usability testing is a technique used in user- centered interaction design to evaluate a product by testing it on users. (Wikipedia) CLIW Bogdan GazaTuesday, January 10, 12
  • 23. Usability testing • How? • Hallway testing: random set of people are brought to test the product/service. • Expert review: use experts (possibly from companies that specialize in usability testing) • Usually complicated and error prone CLIW Bogdan GazaTuesday, January 10, 12
  • 24. Functional testing CLIW Bogdan GazaTuesday, January 10, 12
  • 25. Functional testing • Functional testing is a type of black box testing that bases its test cases on the specifications of the software component under test. • Black-box: http://en.wikipedia.org/wiki/Black_box_testing CLIW Bogdan GazaTuesday, January 10, 12
  • 26. Functional testing • How? • Specifying scenarios: Feature: Addition In order to avoid silly mistakes As a math noobie I want to be told the sum of two numbers CLIW Bogdan GazaTuesday, January 10, 12
  • 27. Functional testing • How? • Specifying scenarios: Scenario Outline: Add two numbers Given I have entered <input_1> into the calculator And I have entered <input_2> into the calculator When I press <button> Then the result should be <output> on the screen CLIW Bogdan GazaTuesday, January 10, 12
  • 28. Functional testing • How? • Selenium CLIW Bogdan GazaTuesday, January 10, 12
  • 29. Functional testing • Selenium • Test automation tool for web applications • Can be used for most of the browsers/ platform combinations • Supports many languages CLIW Bogdan GazaTuesday, January 10, 12
  • 30. Functional testing • Selenium IDE • Firefox plugin • IDE for selenium tests • Provides record and playback functionalities • Exports tests in different formats (HTML, Ruby, Python etc) CLIW Bogdan GazaTuesday, January 10, 12
  • 31. Practical examples - demo CLIW Bogdan GazaTuesday, January 10, 12
  • 32. Conclusions CLIW Bogdan GazaTuesday, January 10, 12
  • 33. Client-side web testing improves the quality of your software CLIW Bogdan GazaTuesday, January 10, 12
  • 34. Client-side web testing can be cumbersome CLIW Bogdan GazaTuesday, January 10, 12
  • 35. But saves bug tracking/fixing time, and is a must in business critical software CLIW Bogdan GazaTuesday, January 10, 12
  • 36. Questions! CLIW Bogdan GazaTuesday, January 10, 12
  • 37. Thanks! CLIW Bogdan GazaTuesday, January 10, 12

×