Add support for data-confirm attribute on button elements.

This should be supported as the `button_to` rails helper produces
the expected `data-*` attributes.

Closes #352.

Author: lucasmazza

src/rails.js

@@ -25,7 +25,7 @@
     linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote], a[data-disable-with]',
 
     // Button elements bound by jquery-ujs
-    buttonClickSelector: 'button[data-remote]',
+    buttonClickSelector: 'button[data-remote], button[data-confirm]',
 
     // Select elements bound by jquery-ujs
     inputChangeSelector: 'select[data-remote], input[data-remote], textarea[data-remote]',

test/public/test/data-confirm.js

@@ -7,6 +7,13 @@ module('data-confirm', {
       text: 'my social security number'
     }));
 
+    $('#qunit-fixture').append($('<button />', {
+      'data-url': '/echo',
+      'data-remote': 'true',
+      'data-confirm': 'Are you absolutely sure?',
+      text: 'Click me'
+    }));
+
     this.windowConfirm = window.confirm;
   },
   teardown: function() {
@@ -35,6 +42,28 @@ asyncTest('clicking on a link with data-confirm attribute. Confirm yes.', 6, fun
     .trigger('click');
 });
 
+asyncTest('clicking on a button with data-confirm attribute. Confirm yes.', 6, function() {
+  var message;
+  // auto-confirm:
+  window.confirm = function(msg) { message = msg; return true };
+
+  $('button[data-confirm]')
+    .bind('confirm:complete', function(e, data) {
+      App.assertCallbackInvoked('confirm:complete');
+      ok(data == true, 'confirm:complete passes in confirm answer (true)');
+    })
+    .bind('ajax:success', function(e, data, status, xhr) {
+      console.log(xhr);
+      App.assertCallbackInvoked('ajax:success');
+      App.assertRequestPath(data, '/echo');
+      App.assertGetRequest(data);
+
+      equal(message, 'Are you absolutely sure?');
+      start();
+    })
+    .trigger('click');
+});
+
 asyncTest('clicking on a link with data-confirm attribute. Confirm No.', 3, function() {
   var message;
   // auto-decline:
@@ -56,8 +85,28 @@ asyncTest('clicking on a link with data-confirm attribute. Confirm No.', 3, func
   }, 50);
 });
 
+asyncTest('clicking on a button with data-confirm attribute. Confirm No.', 3, function() {
+  var message;
+  // auto-decline:
+  window.confirm = function(msg) { message = msg; return false };
+
+  $('button[data-confirm]')
+    .bind('confirm:complete', function(e, data) {
+      App.assertCallbackInvoked('confirm:complete');
+      ok(data == false, 'confirm:complete passes in confirm answer (false)');
+    })
+    .bind('ajax:beforeSend', function(e, data, status, xhr) {
+      App.assertCallbackNotInvoked('ajax:beforeSend');
+    })
+    .trigger('click');
+
+  setTimeout(function() {
+    equal(message, 'Are you absolutely sure?');
+    start();
+  }, 50);
+});
 
-asyncTest('binding to confirm event and returning false', 1, function() {
+asyncTest('binding to confirm event of a link and returning false', 1, function() {
   // redefine confirm function so we can make sure it's not called
   window.confirm = function(msg) {
     ok(false, 'confirm dialog should not be called');
@@ -78,7 +127,28 @@ asyncTest('binding to confirm event and returning false', 1, function() {
   }, 50);
 });
 
-asyncTest('binding to confirm:complete event and returning false', 2, function() {
+asyncTest('binding to confirm event of a button and returning false', 1, function() {
+  // redefine confirm function so we can make sure it's not called
+  window.confirm = function(msg) {
+    ok(false, 'confirm dialog should not be called');
+  };
+
+  $('button[data-confirm]')
+    .bind('confirm', function() {
+      App.assertCallbackInvoked('confirm');
+      return false;
+    })
+    .bind('confirm:complete', function() {
+      App.assertCallbackNotInvoked('confirm:complete');
+    })
+    .trigger('click');
+
+  setTimeout(function() {
+    start();
+  }, 50);
+});
+
+asyncTest('binding to confirm:complete event of a link and returning false', 2, function() {
   // auto-confirm:
   window.confirm = function(msg) {
     ok(true, 'confirm dialog should be called');
@@ -99,3 +169,25 @@ asyncTest('binding to confirm:complete event and returning false', 2, function()
     start();
   }, 50);
 });
+
+asyncTest('binding to confirm:complete event of a button and returning false', 2, function() {
+  // auto-confirm:
+  window.confirm = function(msg) {
+    ok(true, 'confirm dialog should be called');
+    return true;
+  };
+
+  $('button[data-confirm]')
+    .bind('confirm:complete', function() {
+      App.assertCallbackInvoked('confirm:complete');
+      return false;
+    })
+    .bind('ajax:beforeSend', function() {
+      App.assertCallbackNotInvoked('ajax:beforeSend');
+    })
+    .trigger('click');
+
+  setTimeout(function() {
+    start();
+  }, 50);
+});