book

Test-Driven JavaScript Development

by Ravi Kumar Gupta

December 2015

Intermediate to advanced

240 pages

4h 57m

English

Packt Publishing

Read now

Unlock full access

Support files, eBooks, discount offers, and moreWhy subscribe?Free access for Packt account holders
What this book covers

Downloading the example codeErrataPiracyQuestions
Complexity of web pages
The need for testingTypes of testingThe life cycle of TDDTDD microcycle
BenefitsMyths
Unit testingUnit testing frameworksYUI TestsFollowing the processPreparing the environmentFollowing the life cycleWriting a testRunning the test and seeing if test failsWriting a production codeRunning all testsCleaning up the codeRepeatUsing the browser consolesetUp() and tearDown()Test suitesActions and assertionsActionsAssertions
Benefits of unit testingPitfalls of unit testing
JsUnitGetting startedWriting testsRunning tests
Getting startedWriting testsRunning tests
Getting startedWriting testsRunning tests
Getting startedWriting testsActionsAssertionsRunning tests
Understanding behavior-driven development
Tracking spies using callsCreating a custom spy
Asynchronous callsThe Jasmine Ajax plugin
Disabling suites and specs
JsTestDriverOverviewGetting startedWriting testsAssertionsCapturing the browserRestructuring your projectThe configuration fileRunning tests using the command prompt
Running the testsRunning Jasmine specs
Understanding feature detectionAvailable methods and libraries
Writing custom tests
Downloading and setting up ModernizrHow it worksUsing ModernizrPolyfillsLoading polyfillsSupported browsers
User agent sniffingObject detection
CSS featuresHTML5 featuresMiscellaneous featuresPlugins for additional tests
Modernizr.prefixed()Modernizr.prefixedCSS()Modernizr.mq()Modernizr.on()Modernizr.atRule()Modernizr.addTest()Modernizr.testStyles()Modernizr.testProp()Modernizr.testAllProps()Modernizr.hasEvent()Modernizr._prefixes and Modernizr._domPrefixes
Overview
Event dispatcher/listenerPublish/subscribePush versus pullSample codeUnderstanding patterns in APIThe notify methodSubscribeUnsubscribe
Red step (code with error)Green step (with running code)RefactoringHot swapping componentsBrowser compatibility of the observer API
Setting up the environmentInstalling Node.jsSetting up the applicationChoosing a test runnerMocha and Chai
Implementing the web serverHelpdesk – sample applicationSetting up the MongoDB databaseThe Mocha test
TDD best practices
Make test case names more readableKeep the same name for test files and source filesKeep the name descriptive
Making sure that tests are written before starting implementationModifying/writing new code only when the test is failingRunning all the tests when we modify anything in the existing codeExisting tests should pass before new tests are writtenCleaning up code once all test cases are passed
Simple code that can be easily understoodWriting assertions firstOne assertion per test is enoughKeep your focus on findabilityReducing duplicationTests should run fastUsing mocksUsing stubsUsing setUp and tearDown methods
Feature detection toolsServer-side testing toolsAsynchronous testingRunning time of unit testsBrowser supportOther featuresJsLint

Content preview from Test-Driven JavaScript Development

Modernizr

Modernizr is an awesome JavaScript library for feature detection. It is great for detecting HTML5 and CSS3 features and is used widely. We are going to focus on Modernizr for feature detection in this chapter.

Downloading and setting up Modernizr

At the time of writing, Modernizr, Version 3, is the most stable version. Modernizr can be downloaded as two versions—development and production. Source code of Modernizr can be checked out from https://github.com/Modernizr/Modernizr at GitHub.

For the production version, Modernizr provides a custom build tool, which allows us to select only those features that we want to test. These features are divided into several sections such as CSS3, HTML5 features, and Modernizr methods and properties under ...