HTML and CSS Reference
In-Depth Information
it will stay high even when you leave the page. This is a serious problem, but one
that is luckily easy to fix; simply break the circular reference either by removing the
onreadystatechange
handler or null the request object (thus removing it from
the handler's scope) once the request is finished.
We will use the test case to ensure that this issue is handled. Although nulling
the transport is simple, we cannot test it, because it's a local value. We'll clear the
ready state handler instead.
Clearing the handler can be done in a few ways; setting it to
null
or using the
delete
operator quickly comes to mind. Enter our old friend Internet Explorer.
Using
delete
will not work in IE; it returns
false
, indicating that the property
was not successfully deleted. Setting the property to
null
(or any non-function
value) throws an exception. The solution is to set the property to a function that
does not include the request object in its scope. We can achieve this by creating
a
tddjs.noop
function that is known to have a “clean” scope chain. Using a
function available outside the implementation handily lends itself to testing as well,
as Listing 12.42 shows.
Listing 12.42
Asserting that the circular reference is broken
"test should reset onreadystatechange when complete":
function () {
this.xhr.readyState = 4;
ajax.get("/url");
this.xhr.onreadystatechange();
assertSame(tddjs.noop, this.xhr.onreadystatechange);
}
As expected, this test fails. Implementing it is as simple as Listing 12.43.
Listing 12.43
Breaking the circular reference
tddjs.noop = function () {};
(function () {
/* ... */
function get(url, options) {
/* ... */
transport.onreadystatechange = function () {
if (transport.readyState == 4) {
