Card #168 - does not accept obviously invalid email addresses

2 files changed, 44 insertions, 9 deletions

diff --git a/web-ui/app/js/mail_view/ui/recipients/recipients_input.js b/web-ui/app/js/mail_view/ui/recipients/recipients_input.js
index c1c32d77..ef860eb0 100644
--- a/web-ui/app/js/mail_view/ui/recipients/recipients_input.js
+++ b/web-ui/app/js/mail_view/ui/recipients/recipients_input.js
@@ -111,13 +111,18 @@ define([
         var value = (data && data.value) || this.$node.val();
         var that = this;
         _.each(value.split(/[,;]/), function(address) {
-            if (!_.isEmpty(address.trim())) {
+            if(that.isValidEmailAddress(address.trim())) {
                 that.trigger(that.$node, events.ui.recipients.entered, { name: that.attr.name, address: address.trim() });
             }
         });
         reset(this.$node);
       };
 
+      this.isValidEmailAddress = function(address) {
+        // valid emails are in the format: 'user@domain.smt' or 'User <user@domain.smt>'
+        return /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}|[A-Z ]+<[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}>$/i.test(address);
+      };
+
       this.init = function () {
         this.$node.typeahead({
           hint: true,
diff --git a/web-ui/test/spec/mail_view/ui/recipients/recipients_input.spec.js b/web-ui/test/spec/mail_view/ui/recipients/recipients_input.spec.js
index d4fb8faf..8e7a526c 100644
--- a/web-ui/test/spec/mail_view/ui/recipients/recipients_input.spec.js
+++ b/web-ui/test/spec/mail_view/ui/recipients/recipients_input.spec.js
@@ -13,14 +13,24 @@ describeComponent('mail_view/ui/recipients/recipients_input',function () {
 
     ], function (keycode) {
 
-      it(': ' + keycode[1], function () {
+      it('adds the address if its a valid emails address: ' + keycode[1], function () {
         var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
 
         var enterAddressKeyPressEvent = $.Event('keydown', { which: keycode[0] });
-        this.$node.val('a@b.c');
+        this.$node.val('a@b.com');
+        this.$node.trigger(enterAddressKeyPressEvent);
+
+        expect(addressEnteredEvent).toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'a@b.com' });
+      });
+
+      it('adds the address if its a valid formatted emails address: ' + keycode[1], function () {
+        var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
+
+        var enterAddressKeyPressEvent = $.Event('keydown', { which: keycode[0] });
+        this.$node.val('My dear friend <a@b.com>');
         this.$node.trigger(enterAddressKeyPressEvent);
 
-        expect(addressEnteredEvent).toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'a@b.c' });
+        expect(addressEnteredEvent).toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'My dear friend <a@b.com>' });
       });
 
       it('wont add address if val is empty: ' + keycode[1], function () {
@@ -33,6 +43,26 @@ describeComponent('mail_view/ui/recipients/recipients_input',function () {
         expect(addressEnteredEvent).not.toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: '' });
       });
 
+      it('wont add address if val is not a valid email address: ' + keycode[1], function () {
+        var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
+
+        var enterAddressKeyPressEvent = $.Event('keydown', { which: keycode[0] });
+        this.$node.val('abacate');
+        this.$node.trigger(enterAddressKeyPressEvent);
+
+        expect(addressEnteredEvent).not.toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'abacate' });
+      });
+
+      it('wont add address if val is not a valid formatted email address: ' + keycode[1], function () {
+        var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
+
+        var enterAddressKeyPressEvent = $.Event('keydown', { which: keycode[0] });
+        this.$node.val('abacate <coisa>');
+        this.$node.trigger(enterAddressKeyPressEvent);
+
+        expect(addressEnteredEvent).not.toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'abacate <coisa>' });
+      });
+
       it('wont add address if shift key is pressed together: ' + keycode[1], function () {
         var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
 
@@ -66,11 +96,11 @@ describeComponent('mail_view/ui/recipients/recipients_input',function () {
         var tabKeyPressEvent = $.Event('keydown', { which: 9});
         spyOn(tabKeyPressEvent, 'preventDefault');
 
-        this.$node.val('a@b.c');
+        this.$node.val('a@b.com');
         this.$node.trigger(tabKeyPressEvent);
 
         expect(tabKeyPressEvent.preventDefault).toHaveBeenCalled();
-        expect(addressEnteredEvent).toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'a@b.c'});
+        expect(addressEnteredEvent).toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'a@b.com'});
       });
 
       it('doesnt enter an address and doesnt prevent event default if input val is empty (so tab moves it to the next input)', function () {
@@ -129,15 +159,15 @@ describeComponent('mail_view/ui/recipients/recipients_input',function () {
       var blurEvent = $.Event('blur'); 
 	  spyOn(blurEvent, 'preventDefault');
 
-	  this.$node.val('a@b.c, Friend <friend@domain.com>; d@e.f  , , , , , , , ,');
+	  this.$node.val('a@b.com, Friend <friend@domain.com>; d@e.fr  , , , , , , , ,');
 	  this.$node.trigger(blurEvent);
 
 	  expect(blurEvent.preventDefault).toHaveBeenCalled();
       expect(addressEnteredEvent.callCount).toEqual(3);
 
-      expect(addressEnteredEvent.calls[0].data).toEqual({name: 'to', address: 'a@b.c'});
+      expect(addressEnteredEvent.calls[0].data).toEqual({name: 'to', address: 'a@b.com'});
       expect(addressEnteredEvent.calls[1].data).toEqual({name: 'to', address: 'Friend <friend@domain.com>'});
-      expect(addressEnteredEvent.calls[2].data).toEqual({name: 'to', address: 'd@e.f'});
+      expect(addressEnteredEvent.calls[2].data).toEqual({name: 'to', address: 'd@e.fr'});
     })
   });
 });