JavaScript Testing Beginner's Guide Table of Contents

Table of Contents

Preface
Chapter 1: What is JavaScript Testing?
Chapter 2: Ad Hoc Testing and Debugging in JavaScript
Chapter 3: Syntax Validation
Chapter 4: Planning to Test
Chapter 5: Putting the Test Plan Into Action
Chapter 6: Testing More Complex Code
Chapter 7: Debugging Tools
Chapter 8: Testing Tools
Index

• Preface

• Chapter 1: What is JavaScript Testing?
  • Where does JavaScript fit into the web page?
    • HTML Content
  • Time for action – building a HTML document
    • Styling HTML elements using its attributes
    • Specifying id and class name for an HTML element
  • Cascading Style Sheets

• Time for action – styling your HTML document using CSS
  • Referring to an HTML element by its id or class name and styling it
  • Differences between a class selector and an id selector
  • Other uses for class selectors and id selectors
  • Complete list of CSS attributes

• JavaScript providing behavior to a web page

• Time for action – giving behavior to your HTML document
  • JavaScript Syntax
  • JavaScript events
  • Finding elements in a document
  • Putting it all together

• The difference between JavaScript and server-side languages
• Why pages need to work without JavaScript
• What is testing?
• Why do you need to test?
• Types of errors
  • Loading errors

• Time for action – loading errors in action
  • Partially correct JavaScript

• Time for action – loading errors in action
  • Runtime errors

• Time for action – runtime errors in action
  • Logic errors

• Time for action – logic errors in action
• Some advice for writing error-free JavaScript
  • Always check for proper names of objects, variables, and functions
  • Check for proper syntax
  • Plan before you code
  • Check for correctness as you code
  • Preventing errors by choosing a suitable text editor

• Summary

• Chapter 2: Ad Hoc Testing and Debugging in JavaScript
  • The purpose of ad hoc testing–getting the script to run
  • What happens when the browser encounters an error in JavaScript
  • Browser differences and the need to test in multiple browsers
  • Time for action – checking for features and sniffing browsers
    • Testing browser differences via capability testing
  • Time for action – capability testing for different browsers
  • Are you getting the correct output and putting values in the correct places?
    • Accessing the values on a form
  • Time for action – accessing values from a form
    • Another technique for accessing form values
  • Accessing other parts of the web page

• Time for action – getting the correct values in the correct places
• Does the script give the expected result
• What to do if the script doesn't run?
  • Visually inspecting the code
  • Using alert() to see what code is running
  • Using alert() to see what values are being used

• Time for action – using alert to inspect your code
  • A less obtrusive way to check what code is running and the values used

• Time for action – unobtrusively checking what values are used
• Commenting out parts of the script to simplify testing
• Time for action – simplifying the checking process
• Timing differences–making sure that the HTML is there before interacting with it
• Why ad hoc testing is never enough
• Summary

• Chapter 3: Syntax Validation
  • The difference between validating and testing
    • Code that is valid but wrong–validation doesn't find all the errors
    • Code that is invalid but right
    • Code that is invalid and wrong–validation finds some errors that might be difficult to spot any other way
  • Code quality
    • HTML and CSS needs to be valid before you start on JavaScript
      • What happens if you don't validate your code
    • Color-coding editors–how your editor can help you to spot validation errors
  • Common errors in JavaScript that will be picked up by validation
  • JSLint–an online validator
  • Time for action – using JSLint to spot validation errors
  • Valid code constructs that produce validation warnings
    • Should you fix valid code constructs that produce validation warnings?
    • What happens if you don't fix them
  • How to fix validation errors
    • Error—missing "use strict" statement
  • Time for action – fixing "use strict" errors
    • Error—unexpected use of ++
  • Time for action – fixing the error of "Unexpected use of ++"
    • Error—functions not defined
  • Time for action – fixing the error of "Functions not defined"
    • Too many var statements
  • Time for action – fixing the error of using too many var statements
    • Expecting <\/ instead of <\
  • Time for action – fixing the expectation of '<\/' instead of '</'
    • Expected '===' but found '=='
  • Time for action – changing == to ===
    • Alert is not defined
  • Time for action – fixing "Alert is not defined"
    • Avoiding HTML event handlers
  • Time for action – avoiding HTML event handlers
    • Summary of the corrections we have done
  • JavaScript Lint–a tool you can download
    • Challenge yourself–fix the remaining errors spotted by JSLint
  • Summary

• Chapter 4: Planning to Test
  • A very brief introduction to the software lifecycle
    • The agile method
      • The agile method and the software cycle in action
      • Analysis and design
      • Implementation and testing
      • Deployment
      • Maintenance
  • Do you need a test plan to be able to test?
  • When to develop the test plan
  • How much testing is required?
    • What is the code intended to do?
    • Testing whether the code satisfies our needs
    • Testing for invalid actions by users
    • A short summary of the above issues
  • Major testing concepts and strategies
    • Functional requirement testing
    • Non-functional requirement testing
    • Acceptance testing
    • Black box testing
      • Usability tests
      • Boundary testing
      • Equivalence partitioning
      • Beta testing
    • White box testing
      • Branch testing
      • Pareto testing
    • Unit tests
    • Web page tests
    • Performance tests
    • Integration testing
    • Regression testing–repeating prior testing after making changes
  • Testing order
  • Documenting your test plan
    • The test plan
      • Versioning
      • Test strategy
      • Bug form
    • Summary of our test plan
  • Summary

• Chapter 5: Putting the Test Plan Into Action
  • Applying the test plan: running your tests in order
    • Test Case 1: Testing expected and acceptable values
  • Time for action – Test Case 1a: testing expected and acceptable values by using white box testing
    • Test Case 1b: Testing expected but unacceptable values using black box testing
  • Time for action – Test case 1bi: testing expected but unacceptable values using boundary value testing
  • Time for action – Test case 1bii: testing expected but unacceptable values using illegal values
    • Test Case 2: Testing the program logic
  • Time for action – testing the program logic
    • Test Case 3: Integration testing and testing unexpected values
  • Time for action –Test Case 3a: testing the entire program with expected values
  • Time for action – Test Case 3b: testing robustness of the second form
    • What to do when a test returns an unexpected result
  • Regression testing in action
  • Time for action – fixing the bugs and performing regression testing
    • Performance issues—compressing your code to make it load faster
    • Does using Ajax make a difference?
    • Difference from server-side testing
    • What happens if you visitor turns off JavaScript
  • Summary

• Chapter 6: Testing More Complex Code
  • Issues with combining scripts
    • Combining event handlers
    • Naming clashes
  • Using JavaScript libraries
    • Do you need to test a library that someone else has written?
    • What sort of tests to run against library code
      • Performance testing
      • Profiling testing
    • GUI and widget add-ons to libraries and considerations on how to test them
  • Deliberately throwing your own JavaScript errors
    • The throw statement
    • The try, catch, and finally statements
  • Trapping errors by using built-in objects
    • The Error object
    • The RangeError object
    • The ReferenceError object
    • The TypeError object
    • The SyntaxError object
    • The URIError object
    • The EvalError object
  • Using the error console log
    • Error messages
    • Writing your own messages
  • Modifying scripts and testing
  • Time for action – coding, modifying, throwing, and catching errors
  • Summary

• Chapter 7: Debugging Tools
  • IE 8 Developer Tools (and the developer toolbar plugin for IE6 and 7)
  • Using IE developer tools
    • Open
    • A brief introduction to the user interface
    • Debugging basics of the IE debugging tool
  • Time for action – debugging HTML by using the IE8 developer tool
  • Time for action – debugging CSS by using the IE8 developer tool
    • Debugging JavaScript
  • Time for action – more Debugging JavaScript by using the IE8 developer tool
  • Safari or Google Chrome Web Inspector and JavaScript Debugger
    • Differences between Safari and Google Chrome
    • Debugging using Chrome
    • A brief introduction to the user interface
  • Time for action – debugging with Chrome
  • Opera JavaScript Debugger (Dragonfly)
    • Using Dragonfly
      • Starting Dragonfly
  • Time for action – debugging with Opera Dragonfly
    • Inspection and Call Stack
    • Thread Log
    • Continue, Step Into, Step Over, Step Out, and Stop at Error
    • Settings
  • Firefox and the Venkman extension
    • Using Firefox's Venkman extension
      • Obtaining the Venkman JavaScript Debugger extension
      • Opening Venkman
      • A brief introduction to the user interface
  • Time for action – debugging using Firefox's Venkman extension
    • Breakpoints or Call Stack
    • Local Variables and Watches
  • Time for action – more debugging with the Venkman extension
  • Firefox and the Firebug extension
  • Summary

• Chapter 8: Testing Tools
  • Sahi
  • Time for action – user Interface testing using Sahi
    • More complex testing with Sahi
  • QUnit
  • Time for action – testing JavaScript with QUnit
    • Applying QUnit in real-life situations
    • More assertion tests for various situations
  • JSLitmus
  • Time for action – creating ad hoc JavaScript benchmark tests
    • More complex testing with JSLitmus
  • More testing tools that you should check out
  • Summary

• Index