Trim cache length in cachePop, not just cachePush

This fixes a bug where the `pjax.defaults.maxCacheLength` setting was
being applied when navigating to new pages but not when users hit the
back or forward buttons.

Two symptoms of this were:
* Setting `maxCacheLength = 0` didn't completely disable caching;
  hitting the back button followed by the forward button would ask the
  server for the first page but read the second one from the cache. I
  think this is probably the bug that was discussed on issue #406.
* Regardless of what you set `maxCacheLength` to, the forward cache
  would continue growing as long as you kept hitting the back button.

Author: rf-

jquery.pjax.js

@@ -744,14 +744,11 @@ function cachePush(id, value) {
   cacheMapping[id] = value
   cacheBackStack.push(id)
 
-  // Remove all entires in forward history stack after pushing
-  // a new page.
-  while (cacheForwardStack.length)
-    delete cacheMapping[cacheForwardStack.shift()]
+  // Remove all entries in forward history stack after pushing a new page.
+  trimCacheStack(cacheForwardStack, 0)
 
   // Trim back history stack to max cache length.
-  while (cacheBackStack.length > pjax.defaults.maxCacheLength)
-    delete cacheMapping[cacheBackStack.shift()]
+  trimCacheStack(cacheBackStack, pjax.defaults.maxCacheLength)
 }
 
 // Shifts cache from directional history cache. Should be
@@ -778,6 +775,21 @@ function cachePop(direction, id, value) {
   pushStack.push(id)
   if (id = popStack.pop())
     delete cacheMapping[id]
+
+  // Trim whichever stack we just pushed to to max cache length.
+  trimCacheStack(pushStack, pjax.defaults.maxCacheLength)
+}
+
+// Trim a cache stack (either cacheBackStack or cacheForwardStack) to be no
+// longer than the specified length, deleting cached DOM elements as necessary.
+//
+// stack  - Array of state IDs
+// length - Maximum length to trim to
+//
+// Returns nothing.
+function trimCacheStack(stack, length) {
+  while (stack.length > length)
+    delete cacheMapping[stack.shift()]
 }
 
 // Public: Find version identifier for the initial page load.

test/unit/pjax.js

@@ -891,7 +891,7 @@ if ($.support.pjax) {
   // Test is fragile
   asyncTest("no initial pjax:popstate event", function() {
     var frame = this.frame
-    var count = 0;
+    var count = 0
 
     window.iframeLoad = function() {
       count++
@@ -941,6 +941,124 @@ if ($.support.pjax) {
     window.iframeLoad()
   })
 
+  asyncTest("navigation through history obeys maxCacheLength", function() {
+    var frame = this.frame
+    var count = 0
+
+    // Reduce the maxCacheLength for this spec to make it easier to test.
+    frame.$.pjax.defaults.maxCacheLength = 2
+
+    // We can determine whether a navigation event was fulfilled by the cache
+    // or the server by checking whether pjax:beforeSend fired before pjax:end.
+    var navigationWasCached
+
+    frame.$("#main").on("pjax:beforeSend", function() {
+      navigationWasCached = false
+    })
+
+    frame.$("#main").on("pjax:end", function() {
+      count++
+
+      // First, navigate three times.
+      if (count == 1) {
+        equal(frame.location.pathname, "/hello.html")
+        navigationWasCached = true
+        frame.$.pjax({url: "env.html", container: "#main"})
+      } else if (count == 2) {
+        equal(frame.location.pathname, "/env.html")
+        equal(navigationWasCached, false)
+        navigationWasCached = true
+        frame.$.pjax({url: "hello.html", container: "#main"})
+      } else if (count == 3) {
+        equal(frame.location.pathname, "/hello.html")
+        equal(navigationWasCached, false)
+        navigationWasCached = true
+        frame.$.pjax({url: "env.html", container: "#main"})
+      } else if (count == 4) {
+        equal(frame.location.pathname, "/env.html")
+        equal(navigationWasCached, false)
+        // The cache should now have two items in it, so hitting the back
+        // button three times should pull the first two pages from cache and
+        // the third from the server.
+        navigationWasCached = true
+        frame.history.back()
+      } else if (count == 5) {
+        equal(frame.location.pathname, "/hello.html")
+        equal(navigationWasCached, true)
+        frame.history.back()
+      } else if (count == 6) {
+        equal(frame.location.pathname, "/env.html")
+        equal(navigationWasCached, true)
+        frame.history.back()
+      } else if (count == 7) {
+        equal(frame.location.pathname, "/hello.html")
+        equal(navigationWasCached, false)
+        // The cache should still have two items in it, both in the forward
+        // cache. If we hit forward three times, the first two should come from
+        // cache and the third from the server.
+        navigationWasCached = true
+        frame.history.forward()
+      } else if (count == 8) {
+        equal(frame.location.pathname, "/env.html")
+        equal(navigationWasCached, true)
+        frame.history.forward()
+      } else if (count == 9) {
+        equal(frame.location.pathname, "/hello.html")
+        equal(navigationWasCached, true)
+        frame.history.forward()
+      } else if (count == 10) {
+        equal(frame.location.pathname, "/env.html")
+        equal(navigationWasCached, false)
+        start()
+      }
+    })
+
+    equal(frame.location.pathname, "/home.html")
+    frame.$.pjax({url: "hello.html", container: "#main"})
+  })
+
+  asyncTest("setting maxCacheLength to 0 disables caching", function() {
+    var frame = this.frame
+    var count = 0
+
+    frame.$.pjax.defaults.maxCacheLength = 0
+
+    // We can determine whether a navigation event was fulfilled by the cache
+    // or the server by checking whether pjax:beforeSend fired before pjax:end.
+    var navigationWasCached
+
+    frame.$("#main").on("pjax:beforeSend", function() {
+      navigationWasCached = false
+    })
+
+    frame.$("#main").on("pjax:end", function() {
+      count++
+
+      if (count == 1) {
+        equal(frame.location.pathname, "/hello.html")
+        navigationWasCached = true
+        frame.$.pjax({url: "env.html", container: "#main"})
+      } else if (count == 2) {
+        equal(frame.location.pathname, "/env.html")
+        equal(navigationWasCached, false)
+        navigationWasCached = true
+        frame.history.back()
+      } else if (count == 3) {
+        equal(frame.location.pathname, "/hello.html")
+        equal(navigationWasCached, false)
+        navigationWasCached = true
+        frame.history.forward()
+      } else if (count == 4) {
+        equal(frame.location.pathname, "/env.html")
+        equal(navigationWasCached, false)
+        start()
+      }
+    })
+
+    equal(frame.location.pathname, "/home.html")
+    frame.$.pjax({url: "hello.html", container: "#main"})
+  })
+
   asyncTest("popstate preserves GET data", function() {
     var frame = this.frame