describeComponent('mail_view/ui/recipients/recipients_input',function () {
'use strict';
beforeEach(function () {
this.setupComponent({name: 'to'});
});
describe('keys that finish address input', function () {
_.each([
[186, 'semicolon'],
[188, 'comma'],
], function (keycode) {
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.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 ');
this.$node.trigger(enterAddressKeyPressEvent);
expect(addressEnteredEvent).toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'My dear friend ' });
});
it('wont add address if val is empty: ' + keycode[1], function () {
var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
var enterAddressKeyPressEvent = $.Event('keydown', { which: keycode[0] });
this.$node.val('');
this.$node.trigger(enterAddressKeyPressEvent);
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 ');
this.$node.trigger(enterAddressKeyPressEvent);
expect(addressEnteredEvent).not.toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'abacate ' });
});
it('wont add address if shift key is pressed together: ' + keycode[1], function () {
var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
var enterAddressKeyPressEvent = $.Event('keydown', { which: keycode[0], shiftKey: true });
this.$node.val('a@b.c');
this.$node.trigger(enterAddressKeyPressEvent);
expect(addressEnteredEvent).not.toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'a@b.c' });
});
it('prevents event default regardless on input val when key is ' + keycode[1], function () {
var enterAddressKeyPressEvent = $.Event('keydown', { which: keycode[0] });
spyOn(enterAddressKeyPressEvent, 'preventDefault');
this.$node.val('');
this.$node.trigger(enterAddressKeyPressEvent);
expect(enterAddressKeyPressEvent.preventDefault).toHaveBeenCalled();
enterAddressKeyPressEvent.preventDefault.calls.reset();
this.$node.val('anything');
this.$node.trigger(enterAddressKeyPressEvent);
expect(enterAddressKeyPressEvent.preventDefault).toHaveBeenCalled();
});
});
describe('when tab is pressed', function () {
it('enters an address and prevents event default if there is an input val', function () {
var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
var tabKeyPressEvent = $.Event('keydown', { which: 9});
spyOn(tabKeyPressEvent, 'preventDefault');
this.$node.val('a@b.com');
this.$node.trigger(tabKeyPressEvent);
expect(tabKeyPressEvent.preventDefault).toHaveBeenCalled();
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 () {
var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
var tabKeyPressEvent = $.Event('keydown', { which: 9});
spyOn(tabKeyPressEvent, 'preventDefault');
this.$node.val('');
this.$node.trigger(tabKeyPressEvent);
expect(tabKeyPressEvent.preventDefault).not.toHaveBeenCalled();
expect(addressEnteredEvent).not.toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: ''});
});
});
describe('when space is pressed', function () {
it('address input should not finish', function () {
var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
var spaceKeyPressEvent = $.Event('keydown', { which: 32});
spyOn(spaceKeyPressEvent, 'preventDefault');
this.$node.val('a@b.c');
this.$node.trigger(spaceKeyPressEvent);
expect(spaceKeyPressEvent.preventDefault).not.toHaveBeenCalled();
expect(addressEnteredEvent).not.toHaveBeenTriggeredOnAndWith(this, { name: 'to', address: 'a@b.c' });
});
});
});
describe('on keyup', function () {
it('triggers inputHasNoMail if input is empty', function () {
var inputHasNoMailEvent = spyOnEvent(document, Pixelated.events.ui.recipients.inputHasNoMail);
this.$node.val('');
this.$node.trigger('keyup');
expect(inputHasNoMailEvent).toHaveBeenTriggeredOn(document);
});
it('triggers inputHasMail if input is not empty', function () {
var inputHasMailEvent = spyOnEvent(document, Pixelated.events.ui.recipients.inputHasMail);
this.$node.val('lalala');
this.$node.trigger('keyup');
expect(inputHasMailEvent).toHaveBeenTriggeredOn(document, { name: 'to' });
});
});
describe('on blur', function() {
it('tokenizes and sanitize recipient email if there is an input val', function() {
var addressEnteredEvent = spyOnEvent(this.$node, Pixelated.events.ui.recipients.entered);
var blurEvent = $.Event('blur');
spyOn(blurEvent, 'preventDefault');
this.$node.val('a@b.com, Friend ; 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.com'});
expect(addressEnteredEvent.calls[1].data).toEqual({name: 'to', address: 'Friend '});
expect(addressEnteredEvent.calls[2].data).toEqual({name: 'to', address: 'd@e.fr'});
})
});
});