Historical errata for Test-Driving JavaScript Applications

“canary in a cole mine” —> “canary in a coal mine”. They were used to measure toxic levels of gases for coal miners.

The below test is expecting the result to be true. Spec description to be corrected in the following snippet.

it(‘should return false for argument mom mom’, function() {

expect(isPalindrome(‘mom mom’)).to.be.true;

});

In the page 20, the fahrenheit is written correct.
var celsius = util.f2c(fahrenheit);

In the page 21, h is missing from word farenheit.
module.exports = function() {
this.f2c = function(farenheit) {
return (farenheit - 32) * 5 / 9;
}
}

The test file media.pragprog.com/titles/vsjavas/code/async/promises/test/files-test.js failed when I try “npm test”.

The packages that are installed are from this file media.pragprog.com/titles/vsjavas/code/async/promises/package.json

The error is:

Error: Cannot find any-promise implementation nor global.Promise. You must install polyfill or call require(“any-promise/register”) with your preferred implementation, e.g. require(“any-promise/register”)(“bluebird”) on application load prior to any require(“any-promise”).

Angular Testing (Chapter 8)
Would it be possible to have this chapter be based on Angular2.0 now that it is in the release candidate stages and this book is still in beta?

The tests that exists in this moment(page 104) are passing for the code:
if(tickers.length = 0) onError('File ' + filename + ' has invalid content'); else self.processTickers(tickers); but if we delete the "else" the tests are passing. if(tickers.length = 0)
onError(‘File ’ + filename + ’ has invalid content’);
self.processTickers(tickers);

Should the test “read should return error if given file is empty” ensure that the processTickers is not called because is in the “else” part?

Sorry - don’t know page number because am reading the epub ebook :)

The canary test for the chapter 5 stock fetch application fails as written.

Basically, the beforeEach method attempts to create a new stockfetch object. But the object description hasn’t been created in stockfetch.js yet.

I got around this by adding a stub implementation of stockfetch. But this seems to defeat the purpose of a canary test.

Here is my stub implementation in case anyone wants it:

var Stockfetch = function() {}
module.exports = Stockfetch;

A mention under “Your Own Workspace” that you cannot cut-and-paste code from the book would be helpful. Doing so will change encoding and characters such that any code from the book fails.

Sorry - using ebook so don’t know PDF page numbers!

Many of the database functions in the testexpress chapter (chapter 6) use depreciated mongodb functions. While it’s easy to find the right functions (especially in intellj), it would be nice if the book used the non-depreciated functions!

Here are some examples:

.insert (use insertMany in before, insertOne in add)
.findOne (use find.limit(1).next instead)

The test “callService should send xhr status code to callback” fails as written.

This is because the onreadystatechange function is called multiple times with different states.

To fix it, I had to change the onreadystatechange function to check the readyState field:

xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
callback(xhr.status, xhr.response);
}
};

The test “initpage should call getTasks” passes with no code written. This is because there is no expectation set on the mock object.

Here is my version of the test that will fail:

it(“initpage should call getTasks”, function() {
var getTasksMock = sandbox.mock(window).expects(“getTasks”).once();

initpage();

getTasksMock.verify();
});

Just a note: this is a really really great book! Thought I’d just put every issue I find here.

The expectations in the “getTasks should call callService” do not fail when the test fails. Same as the “addTask should call callService” test later on (this one I noticed because my date parsing was broken - I only noticed during a manual test at the end of the task add bit!)

I had to rewrite it with a spy object as shown to get the test to fail properly:

it(“getTasks should call callService”, function() {
var callServiceSpy = sandbox.spy(window, “callService”);

getTasks();

var params = callServiceSpy.getCalls()[0].args[0];

expect(params.method).to.be.eql(“GET”);
expect(params.url).to.be.eql(“/tasks”);

});

util_test.js is written as util-test.js. Am new to serverside JS and have seen filenames as p1-p2.js a lot. Is there a standard?

util_test.js is written as util-test.js.

Hi!
I am not able to run “npm start” with the code that exists in this files:
media.pragprog.com/titles/vsjavas/code/testexpress/todo/app.js
media.pragprog.com/titles/vsjavas/code/testexpress/todo/package.json
In app.js I don’t see where app is listen on port 3000 ( app.listen(3000, function () ..) and in the package.json “npm start” don’t call “node app.js” or something similar.
I missing some files? I need to create some symlinks to run express server with “npm start”?
Thank you.

var fahrenheit = 32;
The variable isn’t used in the next line:
var celsius = util.f2c(32);

or simple blow up?
should be:
or simply blow up?

Contains extra });

It is:

it(‘should report error for an invalid file name’, function(done) { var onError = function(error) {
expect(error).to.be.eql(‘unable to open file src/flies.js’);
done(); }
linesCount(‘src/flies.js’, undefined, onError); });
});

But should be:

it(‘should report error for an invalid file name’, function(done) {
var onError = function(error) {
expect(error).to.be.eql(‘unable to open file src/flies.js’);
done(); }
linesCount(‘src/flies.js’, undefined, onError); });

in the code, there is a variable for fahrenheit, but it is not used.
we could either take it out or use it in place of the 32 on the following line.
var fahrenheit = 32;
var celsius = util.f2c(fahrenheit);
expect(celsius).to.eql(0);

a consolidated version might also be:
expect(util.f2c(32)).to.eql(0)

(i wasn’t sure how consolidated you wanted to make the code)

It genuinely things that “the” window object was given to it and loyally updates the location property with the given url parameter.

I believe it should read:
It genuinely thinks that …

Let’s turn out attention from writing tests to driving the design using tests.

should be

Let’s turn our attention from writing tests to driving the design using tests.

Karma and the browser will collaborate to take care of bring that on board.

should be

Karma and the browser will collaborate to take care of bringing that on board.

your mission, should you choose to accept

should be

your mission, should you choose to accept it
:)

We’ll use the example on hand to learn and apply these design techniques

suggest

We’ll use the example at hand to learn and apply these design techniques

The dotted boxes are the external dependencies and the solid boxes are the code we’d write for the problem on hand.

suggest

The dotted boxes are the external dependencies and the solid boxes are the code we’d write for the problem at hand.

Dependency diagram shows setLocation has dependency on window. I don’t see the window dependency in the code of the spike. I see location. Perhaps this is some variable made available by karma or externally.

Suggest adding window.location expression to the spike code to explicitly show the dependency or stating why the dependency exists when there is no window in the spike code.

In the design diagram, you define what the difference between the solid and dotted boxes are. Suggest you also define what the solid and dotted lines mean.

Same suggestion for the design diagram on page 96. There are no dotted boxes but are dotted lines. Not sure what exactly they signify. Suggest a few words to define them.

By the way, I am on page 113 of the book. Great book so far. Thanks. Hope you don’t mind if I send in feedback as I read it.

The test’s in place,

should be

The test is in place,

stockfetchMock.expects(‘getPrice’).withArgs(‘A’) stockfetchMock.expects(‘getPrice’).withArgs(‘B’) stockfetchMock.expects(‘getPrice’).withArgs(‘C’);

are semicolons not needed after the first two lines. The code runs fine but seems like ; are needed.

Now that this chapter has give us the foundation,
should be
Now that this chapter has given us the foundation,

Furthermore, the response depends on where in the world we are while running the code and the accuracy of the service that response with the current location.
should be
Furthermore, the response depends on where in the world we are while running the code and the accuracy of the service that responds with the current location.

The key to writing automated test for locate was replacing the dependency with a test double.

could be

The key to writing automated tests for locate was replacing the dependency with a test double.

The failure could be due to one of several reasons including the user did not grant permission and is unable to access the network.

could be

The failure could be due to one of several reasons including the user did not grant permission or is unable to access the net- work.

Test on page 101 includes
sandbox.stub(fs, ‘readFile’, function(fileName, callback) {
callback(new Error(‘failed’));
});
For this test, this stub creation is not needed to make the test pass and has no effect on the test. Suggest removing the call, it is introduced (and needed) in the next test.

Awesome book by the way. I am on 2nd time through, this time running all the code.

page 116 says:
“Here’s the code for processResponse that makes the tests pass:”
I had to add
this.processError = function(symbol, statusCode) {};
this.parsePrice = function(symbol, data) {};
as well to get this tests to actually pass.

Print and sort are two separate concerns—a good design keeps concerns that are separate apart.

should be

Print and sort are two separate concerns—a good design keeps concerns that are separated apart.

The test named ‘getPriceForTickers should respond well for a valid file’ fails with the following error output from running the ‘npm test’ command

26 passing (10s)
1 failing

1) Stockfetch tests getPriceForTickers should respond well for a valid file:
Error: timeout of 10000ms exceeded. Ensure the done() callback is being called in this test.

I thought the reason was a typo of myself, but then I decided to try the official, original code of the book’s author and it’s failing too.

I’m running npm version 2.15.9 and node version 4.6.0 on Ubuntu 16.04 TLS with GNU/Linux kernel version 4.8.0-26 on a CPU with x86_64 architecture

Hi!

Am I missing something or is there a harmless syntactic error in the ‘addTask should call the service’ test?

The file at testangularjs/todo/test/client/tasks-controller-test.js for that test has this line:

// …
var convertedTask = controller.convertNewTaskToJSON(controller.newTask);
// …

And the file at testangularjs/todo/public/javascripts/src/controllers/tasks-controller.js has the following implementation for the convertNewTaskToJSON controller’s function:

// …
controller.convertNewTaskToJSON = function() {
var dateParts = controller.newTask.date.split(‘/’);

return {
name: controller.newTask.name,
month: parseInt(dateParts[0]),
day: parseInt(dateParts[1]),
year: parseInt(dateParts[2])
};
};
// …

As we can see, the controller’s convertNewTaskToJSON function doesn’t receive parameters and internally it works with the controller.newTask model. By something that I suppose is the nature of JavaScript, there is no error by passing an unexpected parameter to the function, but it confused me a little when I was studied the book’s example. Some of the changes that I did to that ‘addTask should call the service’ test are the following, which doesn’t break it:

var convertedTask = controller.convertNewTaskToJSON(); // test continues passing
var convertedTask = controller.convertNewTaskToJSON({name: ‘M M’, date: ‘2/19/1992’}) // test continues passing

I would like to know your comments about this and, if pertinent, see the corresponding updates to your entertaining book.

Thanks!

Hi again!

By the same lines of a previous erratum I submitted some moments ago, the addTask function of the controller sends a newTask parameter that the convertNewTaskToJSON doesn’t expect. Originally we have this code:

// ..
controller.addTask = function() {
tasksService.add(
controller.convertNewTaskToJSON(controller.newTask),
controller.updateMessage,
controller.updateError);
};
// ..

Which can be modified to this, without negatively affecting the test results:

// ..
controller.addTask = function() {
tasksService.add(
controller.convertNewTaskToJSON(), // this change doesn’t break the test
controller.updateMessage,
controller.updateError);
};
// ..

Or could be modified like this:

// ..
controller.addTask = function() {
tasksService.add(
controller.convertNewTaskToJSON({name: ‘M M’, date: ‘2/19/1992’}), // this change doesn’t break the test
controller.updateMessage,
controller.updateError);
};
// ..

Again, am I missing something?

Thank you!

Hello!

When exploring the angular spike of chapter 9 and running the “npm install” and “npm start” commands, I faced some errors like these:

- HTTP 404 error responses about several non existing JavaScript files included from the index.html file. The reason is that the package.json that I started with did not have the full dependencies needed by the sample

- Problems with the src/main.js file, specifically the line ng.platformBrowserDynamic.bootstrap(app.LangsComponent) because such “bootstrap” functions seems to no longer exist in versions of Angular more recent that the one used in the book samples

- Dependencies conflict between different npm components. An illustrative output of one of my attempts is the following:

1. …
   npm ERR! Linux 4.8.0-26-generic
   npm ERR! argv “/usr/bin/nodejs” “/usr/bin/npm” “install”
   npm ERR! node v4.6.0
   npm ERR! npm v2.15.9
   npm ERR! code EPEERINVALID

npm ERR! peerinvalid The package angular/core2.1.2 does not satisfy its siblings’ peerDependencies requirements!
npm ERR! peerinvalid Peer angular/common2.1.2 wants angular/core2.1.2
npm ERR! peerinvalid Peer angular/compiler2.1.2 wants angular/core2.1.2
npm ERR! peerinvalid Peer angular/forms0.2.0 wants angular/core^2.0.0-rc.4
npm ERR! peerinvalid Peer angular/http2.0.2 wants angular/core2.0.2
npm ERR! peerinvalid Peer angular/platform-browser2.1.2 wants angular/core2.1.2
npm ERR! peerinvalid Peer angular/platform-browser-dynamic2.1.2 wants angular/core2.1.2

npm ERR! Please include the following file with any support request:
npm ERR! /home/osg/code/hindu/tdjsa/angularspike/npm-debug.log

1. …

From a general investigation I did, the root cause is changes in the Angular internals. Given that I only wanted to run the sample, I modified the package.json file so that it uses specific versions of each dependency, instead of allowing open version ranges. The working dependencies section, inside package.json that I ended with, is this:

“dependencies”: {
“core-js”: “2.4.0”,
“angular/common": "2.0.0-rc.4", "angular/compiler”: “2.0.0-rc.4”,
“angular/core": "2.0.0-rc.4", "angular/forms”: “0.2.0”,
“angular/http": "2.0.0-rc.4", "angular/platform-browser”: “2.0.0-rc.4”,
“@angular/platform-browser-dynamic”: “2.0.0-rc.4”,
“reflect-metadata”: “0.1.3”,
“rxjs”: “5.0.0-beta.6”,
“http-server”: “0.9.0”,
“zone.js”: “0.6.12”
}

It would be interesting to know how to make this sample spike working with the more recent versions of Angular 2 components.

Hope this helps!

page says unzip tdjsa.zip

Pragmatic Site book page only offers vsjavas-code.zip

Hello again!

After running the “npm start” command and opening http :// localhost : 3000 page in a browser, the application fails because it doesn’t know about the validateTask() function. I solved it by updating the “head” section of the index.html file so that it has this line:

I think a brief note about this need would come handy at this part of the book.

Thank you!

After listing the source for the AngularJS tests file, there is a typo in the file name mentioned.

It says:

“The first change is that instead of requiring tasksj.page.js, this test file brought in
the new tasjsa-page.js file.”

It can be corrected like this:

“The first change is that instead of requiring tasksj.page.js, this test file brought in
the new tasksa-page.js file.”

Hope this helps.

Thanks for your time and attention!

Today I’ve just finished my first exploration of this whole book by doing the examples in my own environment, typing them, studying each step and I can say it’s an excellent book.

I like how the author explain things, making the complex seem simple and now I would like him to publish new books about the following:

a) Following the Behavior Driven Development approach when developing JavaScript applications with frameworks like Ember.js or Angular and with tools similar to Cucumber and using the Given-When-Then syntax

b) Using JavaScript on the client side (web browsers) with another programming language on the server side, like Python, Ruby, Elixir, Groovy or another one. Things like, for example, reusing the “validateTask” function on both the server and client side would no longer be possible, among other things

Thanks a lot for authoring this book, I enjoyed it a lot!

The code block in

testdomjquery/todo/test/client/tasks-test.js

will not fail.

The xhr should give a response before expect is called, like this

…
callService({method: ‘GET’, url: ‘/tasks’}, callback);
xhr.requests[0].respond(200);
expect(callback.callCount).to.be.eql(0);
…

The code block in

testdomjquery/todo/test/client/tasks-test.js

will not fail.

The xhr should give a response before expect is called, and the callcount should be 1, i.e.

…
callService({method: ‘GET’, url: ‘/tasks’}, callback);
xhr.requests[0].respond(200);
expect(callback.callCount).to.be.eql(1);
….

The code block at the end of the page does not do what it’s supposed to: verify that updateMessage function called the getTasks function.

The original code block
it(‘addTask callback should call getTasks’, function() {
var getTasksMock = sandbox.mock(window, ‘getTasks’);
updateMessage(200, ‘task added’);
getTasksMock.verify();
});

Code that would work
it(‘addTask callback should call getTasks’, function() {
var getTasksMock = sandbox.mock(window).expects(‘getTasks’);
updateMessage(200, ‘task ended’);
getTasksMock.verify();
});

“client-side (including jQuery and Angluar)”

Should be:
“client-side (including jQuery and Angular)”

“Automated testability is a design issue.”

should be:
“Automated testability is a design issue.”

Markdown syntax for italic text had been forgotten to the formatted text. That should either be marked with italic font style, and/or _ characters should be removed.

mock set up in test doesn’t verify anything:-

testdomjquery/todo/test/client/tasks-test.js
it(‘addTask callback should call getTasks’, function() { var getTasksMock = sandbox.mock(window, ‘getTasks’);
updateMessage(200, ‘task added’);
getTasksMock.verify();
});

should be:-

var getTasksMock = sandbox.mock(window).expects(‘getTasks’).once();

Thanks, book is great, but Yahoo Finance has changed their API, and examples does not work anymore

my workaround is: changed node module “http” to “https” and api links:

http
“ichart.finance.yahoo.com/table.csv?s=” + ticker (GOOG)
>>"ichart.finance.yahoo.com/table.csv?s=GOOG

to
https
“btc-e.com/api/3/ticker/” + ticker (btc_usd)
btc-e.com/api/3/ticker/btc_usd

In the third paragraph under the topic, Your Own Workspace, getting to the tdjsa directory is not fully explained. The tdjsa.zip with the workspace is embedded in the code directory from the download file, vsjavas-code.zip.

More explanation of this would prevent us from starting in the code solutions section.

“That also raises a few question” -> should be “a few questions”

On page 13 (Kindle) the code in the unit test should be the same as on page 19 (Kindle):

it(‘should pass this canary test’, function() { expect(true).to.eql(true); });

should be

it(‘should pass this canary test’, function() { expect(true).to.be.true; });

There are issues related to the given source code related to Chapter 9 (Test-Drive Angular 2). The tests fail (running ‘npm test-client’) with “Uncaught ReferenceError: ng is not defined”. There are two main issues related to dependencies (package.json) and karma setup (karma.conf.js):

1. package.json dependencies seem to have incompatible versions
To fix: use exact versions by removing the caret (^) from the angular dependencies
e.g., “angular/common": "^2.0.0-rc.4", => "angular/common”: “2.0.0-rc.4”,

2.karma.conf.js erroneously references ‘./public/javascripts/X’ when the packages are actually in ‘node_modules/X’
To fix: change all the ‘./public/javascripts/X’ that don’t exist to ‘node_modules/X’
e.g., ./public/javascripts/@angular/core/bundles/core.umd.js => node_modules/@angular/core/bundles/core.umd.js

Given the following code on page 189:

it(‘ajax should set dataType to text’, function() {
var ajaxMock = sandbox.mock($, ‘ajax’, function(options) {
expect(options.dataType).to.be.eql(‘text’);
});

jCallService({method: ‘POST’, url: ‘/tasks’, data: ‘…some data…’});
ajaxMock.verify();
});

The expectation expect(options.dataType).to.be.eql(‘text’); is useless. Replace the string ‘text’ with anything you want and the test is still passing !

Suggestion: replace it with a stub, and remove the sandbox.verify, as follows:

it(‘ajax should set dataType to text’, function() {
sandbox.stub($, ‘ajax’, function(options) {
expect(options.dataType).to.be.eql(‘text’);
});

jCallService({method: ‘POST’, url: ‘/tasks’, data: ‘…some data…’});
});

- MCameriere