FIX: Clicking outside of modal wasn't closing it

This commit is contained in:
Robin Ward 2014-09-08 16:52:49 -04:00
parent 78bcea5247
commit 2f04b53c9f
2 changed files with 39 additions and 1 deletions

View file

@ -1,5 +1,14 @@
export default Ember.View.extend({
elementId: 'discourse-modal',
templateName: 'modal/modal',
classNameBindings: [':modal', ':hidden', 'controller.modalClass']
classNameBindings: [':modal', ':hidden', 'controller.modalClass'],
click: function(e) {
// Delegate click to modal backdrop if clicked outside. We do this
// because some CSS of ours seems to cover the backdrop and makes it
// unclickable.
if ($(e.target).closest('.modal-inner-container').length === 0) {
$('.modal-backdrop').click();
}
}
});

View file

@ -0,0 +1,29 @@
integration("Modal");
test("modal", function() {
visit('/');
andThen(function() {
ok(find('#discourse-modal:visible').length === 0, 'there is no modal at first');
});
click('.login-button');
andThen(function() {
ok(find('#discourse-modal:visible').length === 1, 'modal should appear');
});
click('.modal-outer-container');
andThen(function() {
ok(find('#discourse-modal:visible').length === 0, 'modal should disappear when you click outside');
});
click('.login-button');
andThen(function() {
ok(find('#discourse-modal:visible').length === 1, 'modal should appear');
});
keyEvent('#main-outlet', 'keyup', 27);
andThen(function() {
ok(find('#discourse-modal:visible').length === 0, 'ESC should close the modal');
});
});