Fire pjax:beforeReplace event before replacing HTML

This event fires right before DOM replacement and it's useful if any
processing of old content is required, such as unmounting components.

This is similar to the equivalent event that Turbolinks [1] fires.

Fixes #383

[1]: https://github.com/rails/turbolinks

Author: Henric Trotzig + Joe Lencioni

jquery.pjax.js

@@ -272,6 +272,8 @@ function pjax(options) {
     } catch (e) { }
 
     if (container.title) document.title = container.title
+
+    fire('pjax:beforeReplace', [container.contents, options])
     context.html(container.contents)
 
     // FF bug: Won't autofocus fields that are inserted via JS.
@@ -446,6 +448,7 @@ function onPjaxPopstate(event) {
         container.trigger('pjax:start', [null, options])
 
         if (state.title) document.title = state.title
+        container.trigger('pjax:beforeReplace', [contents, options])
         container.html(contents)
         pjax.state = state
 

test/unit/pjax.js

@@ -536,6 +536,28 @@ if ($.support.pjax) {
     })
   })
 
+  asyncTest("triggers pjax:beforeReplace event from container", function() {
+    var frame = this.frame,
+        beforeContent = 'foo'
+
+    frame.$("#main")
+         .text(beforeContent)
+         .on("pjax:beforeReplace", function(event, contents, options) {
+      ok(event)
+      ok(contents)
+      equal($(event.target).text(), beforeContent)
+      equal(options.url, "hello.html")
+    })
+    frame.$("#main").on("pjax:success", function(event) {
+      notEqual($(event.target).text(), beforeContent)
+      start()
+    })
+
+    frame.$.pjax({
+      url: "hello.html",
+      container: "#main"
+    })
+  })
 
   asyncTest("triggers pjax:success event from container", function() {
     var frame = this.frame
@@ -828,6 +850,34 @@ if ($.support.pjax) {
     })
   })
 
+  asyncTest("popstate triggers pjax:beforeReplace event", function() {
+    var frame = this.frame,
+        originalContent = $(frame).html()
+
+    equal(frame.location.pathname, "/home.html")
+
+    frame.$('#main').on("pjax:complete", function() {
+      equal(frame.location.pathname, "/hello.html")
+      ok(frame.history.length > 1)
+
+      frame.$('#main').on('pjax:beforeReplace', function(event, contents, options) {
+        ok(event)
+        ok(contents)
+        equal(frame.location.pathname, "/home.html")
+        // Remember: the content hasn't yet been replaced.
+        notEqual($(event.target).html(), originalContent)
+        start()
+      })
+
+      goBack(frame, function() {})
+    })
+
+    frame.$.pjax({
+      url: "hello.html",
+      container: "#main"
+    })
+  })
+
   // Test is fragile
   asyncTest("no initial pjax:popstate event", function() {
     var frame = this.frame