Getting Good with JavaScript - Andrew Burgess [26]
Our framework has two methods The assert method takes two parameters. The first parameter is the value we're testing. If its Boolean value is true, the test passes. Using the conditional operator makes this extremely easy, because the only difference between a passing test and a failing test is the class on the list item. The second parameter is the message that identifies the test.
The second method, equal, takes three parameters. If the first two are equal, the test passes. If they aren't, it fails.
Let's step away from testing for a moment to make sure you understand the code above. Since both test functions are pretty similar, I've taken that similar functionality and put it in a private method called log; it's private because we're using the module pattern, and we have access to it via closure. Inside each testing method, we just call log and pass it the class name to give the element and the message to put in the list item. As I mentioned, I'm using the conditional operator to decide whether the test passes or fails right inside the call to the function. Inside the log function, we create the list item, give it the appropriate class and test, and append it to the unordered list we created.
So, let's use the framework now. Obviously, we're not going to build an entire project right here, but let's say we're going to build a Business object. We start by writing the most simple test possible, to test for its existence.
ROCKSTAR TIP
I haven't included the CSS that goes along with this little test framework here; if you want to see that, and follow along with these tests, check out the example files for these examples in the downloadable source code.
Example 4.18
TEST.assert(Business, "Existence of Business function");
If you run this now, the test will fail; actually, you won't even get a test, because your browser will throw an error saying there's no such thing as Business. That's ok; our test obviously failed. Now, let's write the function:
Example 4.19
function Business (name, year_founded) {
}
TEST.assert(Business, "Existence of Business function");
Now we have our function; re-run the test and it should pass! Now, let's add some other tests:
var b = new Business("my business", 2000);
TEST.equal(b.name, "my business", "b.name === 'my business'");
TEST.equal(b.year_of_founding, 2000, "b.year_of_founding === 2000");
They fail, of course, so let's fix that:
Example 4.20
function Business (name, year_founded) {
this.name = name;
this.year_of_founding = year_founded;
}
var b = new Business("my business", 2000);
TEST.equal(b.name, "my business", "b.name === 'my business'");
TEST.equal(b.year_of_founding, 2000, "b.year_of_founding === 2000");
Now, they should pass. One more:
TEST.assert(b.get_age, "b has get_age");
TEST.equal(typeof b.get_age, "function", "b.get_age is a function");
After making sure it fails, you can add the function:
Example 4.21
function Business (name, year_founded) {
this.name = name;
this.year_of_founding = year_founded;
}
Business.prototype.get_age = function () {
return (new Date().getFullYear()) - this.year_of_founding;
}
var b = new Business("my business", 2000);
TEST.assert(b.get_age, "b has get_age");
TEST.equal(typeof b.get_age, "function", "b.get_age is a function");
Now, it should pass.
This is just a very basic example of how you might do testing. There are whole books written about this kind of thing, so I can't really do the topic justice. If you want to learn more, check out "Test-Driven JavaScript Development" by Christian Johansen. You can read an excerpt of the book over on Nettuts+.
Performance Testing
Often, there are several ways to do something with JavaScript. This doesn't mean all ways are equal, however. Very often, one way is faster than another.