Maintaining Quality (HelsinkiJS, Nov 2013)
1 like246 views
This document discusses various techniques for maintaining code quality in JavaScript projects, including: - Using testing frameworks like QUnit, Selenium, and JUnit to enable refactoring code through testing. - Collecting data from code reviews, testing lunches, customer emails, bug trackers, and analytics tools to improve code quality. - Following a "test pyramid" approach with unit, service, UI, and backend tests at different levels to thoroughly test the codebase.
Maintaining Quality (HelsinkiJS, Nov 2013)
- 1. Maintaining JS Code Quality http://kechggeography.blogspot.鍖/2012/02/crack-in-wall-my-journey-from-charity.html
- 2. Q: What is your test coverage? A: That is only a small part of what we do!
- 3. The main purpose for testing is to give courage to refactor code.
- 4. Where do we get the courage from?
- 5. A Bag of Tricks QUnit Selenium JUnit JS Error Reporter JS Error logging Server HTTP logs Code reviews Testing lunches Get Satisfaction Mixpanel Google Analytics Customer emails Usertesting.com Test outsourcing JSLint Blanket.js Bug tracker Bug 鍖x day
- 6. Unit Tests Service Tests UI Tests Service Tests Unit Tests Backend Frontend Based on The Test Pyramid by Mike Cohn
- 7. Reporting JS Errors in Selenium Tests
- 8. protected void get( String address ) { 油油油 List<JavaScriptError> jsErrors = 油油油油 JavaScriptError.readErrors(driver); 油油油油油油油 油油油 assertTrue( "JsErrors on page" + 油油油油油油油 jsErrors.toString(), jsErrors.isEmpty() ); 油油油 m_driver.get( address ); }
- 9. Logging Javascript Errors from Production
- 10. var maxErrors = 5, curErrors = 0; var origOnErr = window.onerror; 油 window.onerror = function() { 油油油 if(origOnErr) origOnErr.call(null, arguments); 油油油 油油油 curErrors += 1; 油油油 if(curErrors>=maxErrors) return; 油 油油油 $.ajax({ 油油油油油油油 url: BASE_URL+'/reportJsErrors', 油油油油油油油 data: { error: arguments }, 油油油油油油油 dataType: 'jsonp' 油油油 }); };
- 11. Compare that CSS styles match
- 12. function cssStylesMatch($elem1,$elem2) { 油油油 return serializeDomToHtml($elem1)=== 油油油油油油油油油油 serializeDomToHtml($elem2); }
- 13. People dont make bugs, bad processes do.
- 14. Testing can be fun. Be creative!