[FIX][REF] mail: several thread windows fixes

This commit fixes some bugs on thread windows, and make some
improvements on tests related to thread windows.

Fixes:

	1. Correctly position last visible thread window when there are more
	   open thread windows than available slots.
	2. Closing a thread window now marks it as read.
	3. Can now fold/unfold the blank thread window (aka 'New' thread window).

Tests cleaning:

	1. Removed unnecessary 'before assertions' in thread window tests.
	   > Solved with this: https://github.com/odoo/odoo/commit/9b1daa1218f7adf9d741afba607ef5b55b16e3e6
	1. Added basic rendering test for a (non-blank) thread window.
	2. Cleaned thread window tests
	   > Split in different files.
	   > Grouped in 'Thread Window' QUnit module.
This commit is contained in:
Alexandre Kühn
2018-08-27 18:32:58 +02:00
parent d578644756
commit eee49f13f0
9 changed files with 885 additions and 484 deletions
@@ -11,8 +11,6 @@ var utils = require('web.utils');
var QWeb = core.qweb;
var _t = core._t;
var THREAD_WINDOW_WIDTH = 325 + 5; // 5 pixels between windows
/**
* Mail Window Manager
*
@@ -24,8 +22,12 @@ MailManager.include({
close_blank_thread_window: '_onCloseBlankThreadWindow',
}),
// tell where to append thread window
// width of 'hidden thread window' dropdown button
HIDDEN_THREAD_WINDOW_DROPDOWN_BUTTON_WIDTH: 50,
// where thread windows are appended
THREAD_WINDOW_APPENDTO: 'body',
// width of a thread window (+ 5 pixels between windows)
THREAD_WINDOW_WIDTH: 325 + 5,
//--------------------------------------------------------------------------
// Public
@@ -152,13 +154,28 @@ MailManager.include({
//--------------------------------------------------------------------------
/**
* Add the thread window such that it will be the left-most visible window
* Add the thread window such that it will be the left-most visible window.
* Note that adding a new thread window may decrement the amount of
* available slots for visible thread windows.
* For example:
*
* - global width of 800px
* - button width of 100px
* - thread width of 250px
*
* Without button: 3 thread windows (3*250px = 750px < 800px)
* With button: 2 thread windows (2*250px + 100px = 600px < 800px)
*
* So in order for the thread window to be the left-most visible window,
* we should compute available slots after insertion of the thread window.
*
* @private
* @param {mail.ThreadWindow} threadWindow
*/
_addThreadWindow: function (threadWindow) {
this._computeAvailableSlotsForThreadWindows(this._threadWindows.length+1);
this._threadWindows.push(threadWindow);
this._computeAvailableSlotsForThreadWindows();
this._threadWindows.pop();
this._threadWindows.splice(this._availableSlotsForThreadWindows-1, 0, threadWindow);
},
/**
@@ -206,22 +223,23 @@ MailManager.include({
* method call.
*
* @private
* @param {integer} nbWindows
*/
_computeAvailableSlotsForThreadWindows: function (nbWindows) {
_computeAvailableSlotsForThreadWindows: function () {
if (config.device.isMobile) {
// one thread window full screen in mobile
this._availableSlotsForThreadWindows = 1;
return;
}
var width = window.innerWidth;
var availableSlots = Math.floor(width/THREAD_WINDOW_WIDTH);
var spaceLeft = width - (Math.min(availableSlots, nbWindows)*THREAD_WINDOW_WIDTH);
if (availableSlots < nbWindows && spaceLeft < 50) {
// leave at least 50px for the hidden windows dropdown button
var GLOBAL_WIDTH = this._getGlobalWidth();
var THREAD_WINDOW_NUM = this._threadWindows.length;
var availableSlots = Math.floor(GLOBAL_WIDTH/this.THREAD_WINDOW_WIDTH);
var spaceLeft = GLOBAL_WIDTH - (Math.min(availableSlots, THREAD_WINDOW_NUM)*this.THREAD_WINDOW_WIDTH);
if (availableSlots < THREAD_WINDOW_NUM && spaceLeft < this.HIDDEN_THREAD_WINDOW_DROPDOWN_BUTTON_WIDTH) {
// leave at least space for the hidden windows dropdown button
availableSlots--;
spaceLeft += THREAD_WINDOW_WIDTH;
spaceLeft += this.THREAD_WINDOW_WIDTH;
}
this._availableSlotsForThreadWindows = availableSlots;
this._spaceLeftForThreadWindows = spaceLeft;
},
@@ -241,6 +259,16 @@ MailManager.include({
return threadWindow.getID() === '_blank';
});
},
/**
* Get the width of the browser, which is useful to determine how many
* open thread windows are visible or hidden.
*
* @private
* @returns {integer}
*/
_getGlobalWidth: function () {
return window.innerWidth;
},
/**
* Get thread window in the hidden windows matching ID `threadID`.
*
@@ -320,7 +348,7 @@ MailManager.include({
if (this._hiddenThreadWindows.length) {
this._$hiddenThreadWindowsDropdown = this._renderHiddenThreadWindowsDropdown();
var $hiddenWindowsDropdown = this._$hiddenThreadWindowsDropdown;
$hiddenWindowsDropdown.css({right: THREAD_WINDOW_WIDTH * this._availableSlotsForThreadWindows, bottom: 0 })
$hiddenWindowsDropdown.css({right: this.THREAD_WINDOW_WIDTH * this._availableSlotsForThreadWindows, bottom: 0 })
.appendTo(this.THREAD_WINDOW_APPENDTO);
this._repositionHiddenWindowsDropdown();
this._keepHiddenThreadWindowsDropdownOpen = false;
@@ -469,15 +497,14 @@ MailManager.include({
* attribute `threadWindows` should be hidden. Those thread windows are put
* in the hidden thread window dropdown menu.
*
* This function assumes that we have already computed the available slots.
*
* @private
* @param {integer} startIndex the index of the first thread window to hide,
* in increasing order of the thread windows in the `threadWindows`
* attribute
*/
_repositionHiddenThreadWindows: function (startIndex) {
_repositionHiddenThreadWindows: function () {
var hiddenWindows = [];
var hiddenUnreadCounter = 0;
var index = startIndex;
var index = this._availableSlotsForThreadWindows;
while (index < this._threadWindows.length) {
var threadWindow = this._threadWindows[index];
hiddenWindows.push(threadWindow);
@@ -508,27 +535,27 @@ MailManager.include({
if (this._areAllThreadWindowsHidden()) {
return;
}
this._computeAvailableSlotsForThreadWindows(this._threadWindows.length);
var availableSlots = this._availableSlotsForThreadWindows;
this._computeAvailableSlotsForThreadWindows();
this._repositionVisibleThreadWindows(availableSlots-1);
this._repositionHiddenThreadWindows(availableSlots);
this._repositionVisibleThreadWindows();
this._repositionHiddenThreadWindows();
},
/**
* Reposition the thread windows that should be visible on the screen.
*
* This function assumes that we have already computed the available slots.
*
* @private
* @param {integer} count how many thread windows can should be visible,
* which are picked in the attribute `_threadWindows` in increasing index
* order of appearance in the array. constraint:
* 0 <= count < this._threadWindows.length
*/
_repositionVisibleThreadWindows: function (count) {
_repositionVisibleThreadWindows: function () {
var index = 0;
while (index < count && index < this._threadWindows.length) {
while (
index < this._availableSlotsForThreadWindows &&
index < this._threadWindows.length
) {
var threadWindow = this._threadWindows[index];
var cssProps = {bottom: 0};
cssProps[_t.database.parameters.direction === 'rtl' ? 'left' : 'right'] = THREAD_WINDOW_WIDTH*index;
cssProps[_t.database.parameters.direction === 'rtl' ? 'left' : 'right'] = this.THREAD_WINDOW_WIDTH*index;
threadWindow.$el.css(cssProps);
threadWindow.do_show();
index++;
@@ -10,9 +10,6 @@ var Widget = require('web.Widget');
var QWeb = core.qweb;
var _t = core._t;
var HEIGHT_OPEN = '400px';
var HEIGHT_FOLDED = '34px';
/**
* This is an abstract widget for rendering thread windows.
*
@@ -38,6 +35,9 @@ var AbstractThreadWindow = Widget.extend({
'keydown .o_composer_text_field': '_onKeydown',
'keypress .o_composer_text_field': '_onKeypress',
},
FOLD_ANIMATION_DURATION: 200, // duration in ms for (un)fold transition
HEIGHT_OPEN: '400px', // height in px of thread window when open
HEIGHT_FOLDED: '34px', // height, in px, of thread window when folded
/**
* Children of this class must make use of `thread`, which is an object that
* represent the thread that is linked to this thread window.
@@ -85,7 +85,7 @@ var AbstractThreadWindow = Widget.extend({
});
if (this.isFolded()) {
this.$el.css('height', HEIGHT_FOLDED);
this.$el.css('height', this.HEIGHT_FOLDED);
} else if (this.options.autofocus) {
this._focusInput();
}
@@ -301,8 +301,8 @@ var AbstractThreadWindow = Widget.extend({
*/
_animateFold: function () {
this.$el.animate({
height: this.isFolded() ? HEIGHT_FOLDED : HEIGHT_OPEN
}, 200);
height: this.isFolded() ? this.HEIGHT_FOLDED : this.HEIGHT_OPEN
}, this.FOLD_ANIMATION_DURATION);
},
/**
* Set the focus on the composer of the thread window. This operation is
@@ -368,6 +368,7 @@ var AbstractThreadWindow = Widget.extend({
},
/**
* Update the fold state of the thread.
*
* This function is called when toggling the fold state of this window.
* If there is no thread linked to this window, it means this is the
* "blank" thread window, therefore we use the internal state 'folded'
@@ -380,6 +381,7 @@ var AbstractThreadWindow = Widget.extend({
this._thread.fold(folded);
} else {
this._folded = folded;
this.updateVisualFoldState();
}
},
/**
@@ -395,7 +397,8 @@ var AbstractThreadWindow = Widget.extend({
//--------------------------------------------------------------------------
/**
* Close the thread
* Close the thread window.
* Mark the thread as read if the thread window was open.
*
* @private
* @param {MouseEvent} ev
@@ -403,10 +406,18 @@ var AbstractThreadWindow = Widget.extend({
_onClickClose: function (ev) {
ev.stopPropagation();
ev.preventDefault();
if (
this.hasThread() &&
this._thread.getUnreadCounter() > 0 &&
!this.isFolded()
) {
this._thread.markAsRead();
}
this.close();
},
/**
* Fold/unfold the thread window
* Fold/unfold the thread window.
* Also mark the thread as read.
*
* @private
*/
@@ -5,7 +5,7 @@
@param {mail.AbstractThreadWindow} widget
-->
<t t-name="mail.AbstractThreadWindow">
<div class="o_thread_window o_in_home_menu">
<div class="o_thread_window o_in_home_menu" t-att-data-thread-id="widget.getID()">
<div class="o_thread_window_header">
<t t-call="mail.AbstractThreadWindow.HeaderContent">
<t t-set="status" t-value="widget.getThreadStatus()"/>
@@ -1,4 +1,4 @@
odoo.define('mail.document_thread_window_tests', function (require) {
odoo.define('mail.documentThreadWindowTests', function (require) {
"use strict";
var mailTestUtils = require('mail.testUtils');
@@ -7,8 +7,8 @@ var MessagingMenu = require('mail.systray.MessagingMenu');
var testUtils = require('web.test_utils');
QUnit.module('mail', {}, function () {
QUnit.module('ThreadWindow (Document Thread)', {
QUnit.module('Thread Window', {}, function () {
QUnit.module('Document Thread', {
beforeEach: function () {
var partnerID = 44;
this.data = {
@@ -277,5 +277,5 @@ QUnit.test('open, fold, unfold and close a document thread window', function (as
});
});
});
});
@@ -0,0 +1,253 @@
odoo.define('mail.basicThreadWindowTests', function (require) {
"use strict";
var mailTestUtils = require('mail.testUtils');
var framework = require('web.framework');
var testUtils = require('web.test_utils');
var Widget = require('web.Widget');
QUnit.module('mail', {}, function () {
QUnit.module('Thread Window', {}, function () {
QUnit.module('Basic', {
beforeEach: function () {
var self = this;
// define channel to link to chat window
this.data = {
'mail.message': {
fields: {},
records: [],
},
initMessaging: {
channel_slots: {
channel_channel: [{
id: 1,
channel_type: "channel",
name: "general",
}],
},
},
};
this.services = mailTestUtils.getMailServices();
this.ORIGINAL_THREAD_WINDOW_APPENDTO = this.services.mail_service.prototype.THREAD_WINDOW_APPENDTO;
this.createParent = function (params) {
var widget = new Widget();
// in non-debug mode, append thread windows in qunit-fixture
// note that it does not hide thread window because it uses fixed
// position, and qunit-fixture uses absolute...
if (params.debug) {
self.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = 'body';
} else {
self.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = '#qunit-fixture';
}
testUtils.addMockEnvironment(widget, params);
return widget;
};
},
afterEach: function () {
// reset thread window append to body
this.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = 'body';
},
});
QUnit.test('basic rendering thread window', function (assert) {
assert.expect(10);
var parent = this.createParent({
data: this.data,
services: this.services,
});
// detach channel 1, so that it opens corresponding thread window.
parent.call('mail_service', 'getChannel', 1).detach();
var $threadWindow = $('.o_thread_window');
assert.strictEqual($threadWindow.length, 1,
"thread window should be open");
assert.strictEqual($threadWindow.data('thread-id'), 1,
"thread window should be related to thread ID 1");
var $header = $threadWindow.find('.o_thread_window_header');
assert.strictEqual($header.length, 1,
"thread window should have a header");
var $title = $header.find('.o_thread_window_title');
assert.strictEqual($title.length, 1,
"thread window should have a title in the header");
assert.strictEqual($title.text().trim(), "#general",
"should have the title of the general channel");
var $buttons = $header.find('.o_thread_window_buttons');
assert.strictEqual($buttons.length, 1,
"should have buttons in the header of the thread window");
assert.strictEqual($buttons.find('.o_thread_window_expand').length, 1,
"should have a button to expand the thread window");
assert.strictEqual($buttons.find('.o_thread_window_close').length, 1,
"should have a button to close the thread window");
assert.strictEqual($threadWindow.find('.o_mail_thread').length, 1,
"should display the content of the general channel in the thread window");
assert.strictEqual($threadWindow.find('.o_thread_composer').length, 1,
"should display a composer in the thread window");
parent.destroy();
});
QUnit.test('close thread window using ESCAPE key', function (assert) {
assert.expect(5);
var parent = this.createParent({
data: this.data,
services: this.services,
mockRPC: function (route, args) {
if (args.method === 'channel_fold') {
assert.ok(true, "should call channel_fold");
return $.when();
}
return this._super.apply(this, arguments);
},
});
// get channel instance to link to thread window
var channel = parent.call('mail_service', 'getChannel', 1);
assert.ok(channel, "there should exist a channel locally with ID 1");
channel.detach();
assert.strictEqual($('.o_thread_window').length, 1,
"there should be a thread window that is opened");
// focus on the thread window and press ESCAPE
$('.o_thread_window .o_composer_text_field').click();
assert.strictEqual(document.activeElement,
$('.o_thread_window .o_composer_text_field')[0],
"thread window's input should now be focused");
var upKeyEvent = $.Event( "keyup", { which: 27 });
$('.o_thread_window .o_composer_text_field').trigger(upKeyEvent);
assert.strictEqual($('.o_thread_window').length, 0,
"the thread window should be closed");
parent.destroy();
});
QUnit.test('thread window\'s input can still be focused when the UI is blocked', function (assert) {
assert.expect(2);
var parent = this.createParent({
data: this.data,
services: this.services,
});
var $dom = $('#qunit-fixture');
// get channel instance to link to thread window
var channel = parent.call('mail_service', 'getChannel', 1);
channel.detach();
var $input = $('<input/>', {type: 'text'}).appendTo($dom);
$input.focus().click();
assert.strictEqual(document.activeElement, $input[0],
"fake input should be focused");
framework.blockUI();
// cannot force focus here otherwise the test
// makes no sense, this test is just about
// making sure that the code which forces the
// focus on click is not removed
$('.o_thread_window .o_composer_text_field').click();
assert.strictEqual(document.activeElement,
$('.o_thread_window .o_composer_text_field')[0],
"thread window's input should now be focused");
framework.unblockUI();
parent.destroy();
});
QUnit.test('emoji popover should open correctly in thread windows', function (assert) {
assert.expect(1);
var parent = this.createParent({
data: this.data,
services: this.services,
});
// get channel instance to link to thread window
var channel = parent.call('mail_service', 'getChannel', 1);
channel.detach();
var $emojiButton = $('.o_composer_button_emoji');
$emojiButton.trigger('focusin').focus().click();
var $popover = $('.o_mail_emoji_container');
var done = assert.async();
// Async is needed as the popover focusout hiding is deferred
setTimeout(function () {
assert.ok($popover.is(':visible'), "emoji popover should have stayed opened");
parent.destroy();
done();
}, 0);
});
QUnit.test('do not increase unread counter when receiving message with myself as author', function (assert) {
assert.expect(4);
var generalChannelID = 1;
var myselfPartnerID = 44;
this.data.initMessaging = {
channel_slots: {
channel_channel: [{
id: generalChannelID,
channel_type: 'channel',
name: "general",
}],
},
};
var parent = this.createParent({
data: this.data,
services: this.services,
session: { partner_id: myselfPartnerID }
});
// get channel instance to link to thread window
var channel = parent.call('mail_service', 'getChannel', 1);
channel.detach();
var threadWindowHeaderText = $('.o_thread_window_header').text().replace(/\s/g, "");
assert.strictEqual(threadWindowHeaderText, "#general",
"thread window header text should not have any unread counter initially");
assert.strictEqual(channel.getUnreadCounter(), 0,
"thread should have unread counter to 0 initially");
// simulate receiving message from myself
var messageData = {
author_id: [myselfPartnerID, "Myself"],
body: "<p>Test message</p>",
id: 2,
model: 'mail.channel',
res_id: 1,
channel_ids: [1],
};
var notification = [[false, 'mail.channel', generalChannelID], messageData];
parent.call('bus_service', 'trigger', 'notification', [notification]);
threadWindowHeaderText = $('.o_thread_window_header').text().replace(/\s/g, "");
assert.strictEqual(threadWindowHeaderText, "#general",
"thread window header text should not have any unread counter after receiving my message");
assert.strictEqual(channel.getUnreadCounter(), 0,
"thread should not have incremented its unread counter after receiving my message");
parent.destroy();
});
});
});
});
@@ -0,0 +1,318 @@
odoo.define('mail.blankThreadWindowTests', function (require) {
"use strict";
var AbstractThreadWindow = require('mail.AbstractThreadWindow');
var mailTestUtils = require('mail.testUtils');
var testUtils = require('web.test_utils');
var Widget = require('web.Widget');
QUnit.module('mail', {}, function () {
QUnit.module('Thread Window', {}, function () {
QUnit.module('Blank', {
beforeEach: function () {
var self = this;
// define channel to link to chat window
this.data = {
'mail.message': {
fields: {},
records: [],
},
initMessaging: {
channel_slots: {
channel_channel: [{
id: 1,
channel_type: "channel",
name: "general",
}],
},
},
};
this.services = mailTestUtils.getMailServices();
this.ORIGINAL_THREAD_WINDOW_APPENDTO = this.services.mail_service.prototype.THREAD_WINDOW_APPENDTO;
this.createParent = function (params) {
var widget = new Widget();
// in non-debug mode, append thread windows in qunit-fixture
// note that it does not hide thread window because it uses fixed
// position, and qunit-fixture uses absolute...
if (params.debug) {
self.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = 'body';
} else {
self.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = '#qunit-fixture';
}
testUtils.addMockEnvironment(widget, params);
return widget;
};
/**
* Patch autocomplete so that we can detect when 'source' or 'select'
* functions end.
*
* @param {Object} params
* @param {$.Deferred} params.selectDef
* @param {$.Deferred} params.sourceDef
*/
this.patchAutocomplete = function (params) {
var selectDef = params.selectDef;
var sourceDef = params.sourceDef;
self.ORIGINAL_AUTOCOMPLETE = $.fn.autocomplete;
$.fn.autocomplete = function (params) {
var select = params.select;
var source = params.source;
params.select = function () {
select.apply(this, arguments);
selectDef.resolve();
};
params.source = function () {
source.apply(this, arguments);
sourceDef.resolve();
};
return self.ORIGINAL_AUTOCOMPLETE.apply(this, arguments);
};
};
/**
* Unpatch autocomplete
*/
this.unpatchAutocomplete = function () {
$.fn.autocomplete = self.ORIGINAL_AUTOCOMPLETE;
};
},
afterEach: function () {
// reset thread window append to body
this.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = 'body';
},
});
QUnit.test('basic rendering blank thread window', function (assert) {
assert.expect(5);
var parent = this.createParent({
data: this.data,
services: this.services,
});
// open blank thread window
parent.call('mail_service', 'openBlankThreadWindow');
assert.strictEqual($('.o_thread_window').length, 1,
"should have a thread window open");
assert.strictEqual($('.o_thread_window_title').text().trim(),
"New message",
"the blank window should have the correct title");
assert.strictEqual($('.o_composer_text_field').length, 0,
"should have no composer in the blank window");
assert.strictEqual($('.o_thread_search_input input').length, 1,
"the blank window should have an input");
assert.strictEqual($('.o_thread_search_input span').text().trim(),
"To:",
"the blank window should propose to type a partner next to the input");
parent.destroy();
});
QUnit.test('close blank thread window', function (assert) {
assert.expect(1);
var parent = this.createParent({
data: this.data,
services: this.services,
});
// open blank thread window
parent.call('mail_service', 'openBlankThreadWindow');
$('.o_thread_window_close').click();
assert.strictEqual($('.o_thread_window').length, 0,
"blank thread window should be closed");
parent.destroy();
});
QUnit.test('fold blank thread window', function (assert) {
// This test requires full height of thread windows when they are open.
// (e.g. 400px)
assert.expect(2);
var parent = this.createParent({
data: this.data,
services: this.services,
});
var HEIGHT_FOLDED = AbstractThreadWindow.prototype.HEIGHT_FOLDED;
var HEIGHT_OPEN = AbstractThreadWindow.prototype.HEIGHT_OPEN;
// Make fold animation instantaneous
testUtils.patch(AbstractThreadWindow, {
FOLD_ANIMATION_DURATION: 0,
});
// Open blank thread window
parent.call('mail_service', 'openBlankThreadWindow');
assert.strictEqual($('.o_thread_window').css('height'), HEIGHT_OPEN,
"blank thread window should be open");
if ($('.o_thread_window').css('height') !== HEIGHT_OPEN) {
console.warn('Assertion above may fail due to too narrow height of browser');
}
$('.o_thread_window_title').click();
assert.strictEqual($('.o_thread_window').css('height'), HEIGHT_FOLDED,
"blank thread window should be open");
parent.destroy();
testUtils.unpatch(AbstractThreadWindow);
});
QUnit.test('open new DM chat from blank thread window', function (assert) {
assert.expect(6);
var done = assert.async();
var self = this;
var selectDef = $.Deferred();
var sourceDef = $.Deferred();
this.patchAutocomplete({
selectDef: selectDef,
sourceDef: sourceDef,
});
var def = $.Deferred();
this.data['res.partner'] = {
fields: {},
records: [],
};
var parent = this.createParent({
data: this.data,
services: this.services,
mockRPC: function (route, args) {
if (args.method === 'im_search') {
def.resolve();
return $.when([
{ id: 1, name: 'DemoUser1' },
{ id: 2, name: 'DemoUser2', }
]);
}
if (args.method === 'channel_get_and_minimize') {
return $.when({
channel_type: 'chat',
direct_partner: [{ id: args.args[0][0], name: 'DemoUser1', im_status: '' }],
id: 50,
is_minimized: true,
name: 'DemoUser1',
});
}
return this._super.apply(this, arguments);
},
});
// open blank thread window
parent.call('mail_service', 'openBlankThreadWindow');
$('.o_thread_search_input input').val("D").trigger('keydown');
$.when(sourceDef, def).then(function () {
assert.strictEqual($('.ui-menu-item a').length, 2,
"should suggest 2 partners for DM");
assert.strictEqual($('.ui-menu-item a').eq(0).text(), "DemoUser1",
"first suggestion should be 'DemoUser1'");
assert.strictEqual($('.ui-menu-item a').eq(1).text(), "DemoUser2",
"second suggestion should be 'DemoUser2'");
$('.ui-menu-item a').eq(0).click();
});
selectDef.then(function () {
assert.strictEqual($('.o_thread_window').length, 1,
"should be a single window");
assert.strictEqual($('.o_thread_window_title').text().trim(), "#DemoUser1",
"should have thread window of the DM chat with 'DemoUser1'");
assert.strictEqual($('.o_composer_text_field').length, 1,
"should have a composer in the DM chat window");
self.unpatchAutocomplete();
parent.destroy();
done();
});
});
QUnit.test('open already detached DM chat from blank thread window', function (assert) {
// when opening an already detach DM chat from the blank thread window,
// the blank thread window should disappear
assert.expect(6);
var done = assert.async();
var self = this;
var selectDef = $.Deferred();
var sourceDef = $.Deferred();
this.patchAutocomplete({
selectDef: selectDef,
sourceDef: sourceDef,
});
var def = $.Deferred();
this.data['res.partner'] = {
fields: {},
records: [],
};
this.data.initMessaging.channel_slots.channel_dm = [{
channel_type: 'chat',
direct_partner: [{ id: 1, name: 'DemoUser1', im_status: '' }],
id: 50,
is_minimized: true,
name: 'DemoUser1',
}];
var parent = this.createParent({
data: this.data,
services: this.services,
mockRPC: function (route, args) {
if (args.method === 'im_search') {
def.resolve();
return $.when([
{ id: 1, name: 'DemoUser1' },
]);
}
return this._super.apply(this, arguments);
},
});
assert.strictEqual($('.o_thread_window').length, 1,
"should be a single window");
assert.strictEqual($('.o_thread_window_title').text().trim(), "#DemoUser1",
"should have thread window of the DM chat with 'DemoUser1'");
assert.strictEqual($('.o_composer_text_field').length, 1,
"should have a composer in the DM chat window");
// open blank thread window
parent.call('mail_service', 'openBlankThreadWindow');
assert.strictEqual($('.o_thread_window').length, 2,
"should have two thread windows open");
$('.o_thread_search_input input').val("D").trigger('keydown');
$.when(sourceDef, def).then(function () {
$('.ui-menu-item a').eq(0).click();
});
selectDef.then(function () {
assert.strictEqual($('.o_thread_window').length, 1,
"should now have a single thread window open");
assert.strictEqual($('.o_thread_window_title').text().trim(), "#DemoUser1",
"the remaining thread window should be the DM chat with 'DemoUser1'");
self.unpatchAutocomplete();
parent.destroy();
done();
});
});
});
});
});
@@ -0,0 +1,227 @@
odoo.define('mail.hiddenThreadWindowTests', function (require) {
"use strict";
var mailTestUtils = require('mail.testUtils');
var testUtils = require('web.test_utils');
var Widget = require('web.Widget');
QUnit.module('mail', {}, function () {
QUnit.module('Thread Window', {}, function () {
QUnit.module('Hidden', {
beforeEach: function () {
var self = this;
// define channel to link to chat window
this.data = {
'mail.message': {
fields: {},
records: [],
},
initMessaging: {
channel_slots: {
channel_channel: [{
id: 1,
channel_type: "channel",
name: "general",
}],
},
},
};
this.services = mailTestUtils.getMailServices();
this.ORIGINAL_THREAD_WINDOW_APPENDTO = this.services.mail_service.prototype.THREAD_WINDOW_APPENDTO;
this.createParent = function (params) {
var widget = new Widget();
// in non-debug mode, append thread windows in qunit-fixture
// note that it does not hide thread window because it uses fixed
// position, and qunit-fixture uses absolute...
if (params.debug) {
self.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = 'body';
} else {
self.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = '#qunit-fixture';
}
testUtils.addMockEnvironment(widget, params);
return widget;
};
},
afterEach: function () {
// reset thread window append to body
this.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = 'body';
},
});
QUnit.test('hidden thread windows dropdown when not enough horizontal space (version 1)', function (assert) {
// This test has hard-set global width, so that it does not depend on
// the width of the screen: at most 2 thread windows visible at the
// same time, and additional thread windows are in hidden while and
// still showing 2 visible thread windows. It assumes that the width
// of the 'hidden thread window' button is less than the width of a
// single thread window.
assert.expect(13);
testUtils.patch(this.services.mail_service, {
HIDDEN_THREAD_WINDOW_DROPDOWN_BUTTON_WIDTH: 100,
THREAD_WINDOW_WIDTH: 300,
_getGlobalWidth: function () { return 800; },
});
var channels = [];
for (var i = 0; i < 3; i++) {
channels.push({
id: i,
channel_type: 'channel',
name: "channel" + i,
});
}
this.data.initMessaging = {
channel_slots: {
channel_channel: channels,
},
};
var parent = this.createParent({
data: this.data,
services: this.services,
});
parent.call('mail_service', 'getChannel', 0).detach();
parent.call('mail_service', 'getChannel', 1).detach();
var $visibleThreadWindows = $('.o_thread_window:not(.o_thread_window_dropdown, .o_hidden)');
assert.strictEqual($visibleThreadWindows.length, 2,
"should have 2 thread windows visible (as many as available slots)");
assert.strictEqual($visibleThreadWindows.filter('[data-thread-id="0"]').length, 1,
"the thread window with ID 0 should be visible");
assert.strictEqual($visibleThreadWindows.filter('[data-thread-id="1"]').length, 1,
"the thread window with ID 1 should be visible");
assert.strictEqual($('.o_thread_window.o_hidden').length, 0,
"there should be no hidden thread when less or exactly as many as available slots");
assert.strictEqual($('.o_thread_window_dropdown').length, 0,
"there should be no thread window dropdown when all thread windows are visible");
// detach a channel so that it exceeds available slots
parent.call('mail_service', 'getChannel', 2).detach();
// update list of visible thread windows
$visibleThreadWindows = $('.o_thread_window:not(.o_thread_window_dropdown, .o_hidden)');
assert.strictEqual($visibleThreadWindows.length, 2,
"should have as many thread window visible as available slots");
assert.strictEqual($visibleThreadWindows.filter('[data-thread-id="0"]').length, 1,
"the thread window with ID 0 should be visible");
assert.strictEqual($visibleThreadWindows.filter('[data-thread-id="2"]').length, 1,
"the thread window with ID 2 should be visible (swapped with ID 1)");
assert.strictEqual($('.o_thread_window.o_hidden').length, 1,
"there should be a hidden thread when more windows than available slots");
assert.strictEqual($('.o_thread_window.o_hidden').data('thread-id'), 1,
"hidden thread window should be thread window with ID 1 (swapped with ID 2)");
var $hiddenDropdown = $('.o_thread_window_dropdown');
assert.strictEqual($hiddenDropdown.length, 1,
"there should be a thread window dropdown");
assert.strictEqual($('.o_thread_window_dropdown_toggler').text().trim(), "1",
"should display that there is one hidden thread window");
assert.strictEqual($hiddenDropdown.find('.o_thread_window_header[data-thread-id="1"]').length,
1, "should contain thread window with ID 1 in hidden dropdown menu");
parent.destroy();
testUtils.unpatch(this.services.mail_service);
});
QUnit.test('hidden thread windows dropdown when not enough horizontal space (version 2)', function (assert) {
// This is almost the same test as the one before, except there are
// at most 3 thread windows visible, and 2 thread windows are visible
// when it shows the 'hidden thread window' button.
// This case occurs when the amount of available slots depends on
// whether the hidden button should be displayed or not
// Example:
// - global width of 800px
// - button width of 100px
// - thread width of 250px
//
// Without button: 3 thread windows (3*250px = 750px < 800px)
// With button: 2 thread windows (2*250px + 100px = 600px < 800px)
assert.expect(16);
testUtils.patch(this.services.mail_service, {
HIDDEN_THREAD_WINDOW_DROPDOWN_BUTTON_WIDTH: 100,
THREAD_WINDOW_WIDTH: 250,
_getGlobalWidth: function () { return 800; },
});
var channels = [];
for (var i = 0; i < 4; i++) {
channels.push({
id: i,
channel_type: 'channel',
name: "channel" + i,
});
}
this.data.initMessaging = {
channel_slots: {
channel_channel: channels,
},
};
var parent = this.createParent({
data: this.data,
services: this.services,
});
parent.call('mail_service', 'getChannel', 0).detach();
parent.call('mail_service', 'getChannel', 1).detach();
parent.call('mail_service', 'getChannel', 2).detach();
var $visibleThreadWindows = $('.o_thread_window:not(.o_thread_window_dropdown, .o_hidden)');
assert.strictEqual($visibleThreadWindows.length, 3,
"should have 3 thread windows visible (as many as available slots)");
assert.strictEqual($visibleThreadWindows.filter('[data-thread-id="0"]').length, 1,
"the thread window with ID 0 should be visible");
assert.strictEqual($visibleThreadWindows.filter('[data-thread-id="1"]').length, 1,
"the thread window with ID 1 should be visible");
assert.strictEqual($visibleThreadWindows.filter('[data-thread-id="2"]').length, 1,
"the thread window with ID 2 should be visible");
assert.strictEqual($('.o_thread_window.o_hidden').length, 0,
"there should be no hidden thread when exactly as many as available slots");
assert.strictEqual($('.o_thread_window_dropdown').length, 0,
"there should be no thread window dropdown when all thread windows are visible");
// detach a channel so that it exceeds available slots
parent.call('mail_service', 'getChannel', 3).detach();
// update list of visible thread windows
$visibleThreadWindows = $('.o_thread_window:not(.o_thread_window_dropdown, .o_hidden)');
assert.strictEqual($visibleThreadWindows.length, 2,
"should have 2 thread windows visible (as many as available slots)");
assert.strictEqual($visibleThreadWindows.filter('[data-thread-id="0"]').length, 1,
"the thread window with ID 0 should be visible");
assert.strictEqual($visibleThreadWindows.filter('[data-thread-id="3"]').length, 1,
"the thread window with ID 3 should be visible (swapped with IDs 1 and 2)");
assert.strictEqual($('.o_thread_window.o_hidden').length, 2,
"there should be two hidden thread when more windows than available slots");
assert.strictEqual($('.o_thread_window.o_hidden[data-thread-id="1"]').length, 1,
"thread window with ID 1 should be hidden");
assert.strictEqual($('.o_thread_window.o_hidden[data-thread-id="2"]').length, 1,
"thread window with ID 2 should be hidden");
var $hiddenDropdown = $('.o_thread_window_dropdown');
assert.strictEqual($hiddenDropdown.length, 1,
"there should be a thread window dropdown");
assert.strictEqual($('.o_thread_window_dropdown_toggler').text().trim(), "2",
"should display that there is 2 hidden thread windows");
assert.strictEqual($hiddenDropdown.find('.o_thread_window_header[data-thread-id="1"]').length,
1, "should contain thread window with ID 1 in hidden dropdown menu");
assert.strictEqual($hiddenDropdown.find('.o_thread_window_header[data-thread-id="2"]').length,
1, "should contain thread window with ID 2 in hidden dropdown menu");
parent.destroy();
testUtils.unpatch(this.services.mail_service);
});
});
});
});
@@ -1,439 +0,0 @@
odoo.define('mail.thread_window_tests', function (require) {
"use strict";
var mailTestUtils = require('mail.testUtils');
var framework = require('web.framework');
var testUtils = require('web.test_utils');
var Widget = require('web.Widget');
QUnit.module('mail', {
beforeEach: function (assert) {
var self = this;
this.BEFORE_EACH_ASSERTIONS_NUM = 1;
assert.strictEqual($('.o_thread_window').length, 0,
"should have no thread windows open before the test");
// define channel to link to chat window
this.data = {
'mail.message': {
fields: {},
records: [],
},
initMessaging: {
channel_slots: {
channel_channel: [{
id: 1,
channel_type: "channel",
name: "general",
}],
},
},
};
this.services = mailTestUtils.getMailServices();
this.ORIGINAL_THREAD_WINDOW_APPENDTO = this.services.mail_service.prototype.THREAD_WINDOW_APPENDTO;
this.createParent = function (params) {
var widget = new Widget();
// in non-debug mode, append thread windows in qunit-fixture
// note that it does not hide thread window because it uses fixed
// position, and qunit-fixture uses absolute...
if (params.debug) {
self.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = 'body';
} else {
self.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = '#qunit-fixture';
}
testUtils.addMockEnvironment(widget, params);
return widget;
};
/**
* Patch autocomplete so that we can detect when 'source' or 'select'
* functions end.
*
* @param {Object} params
* @param {$.Deferred} params.selectDef
* @param {$.Deferred} params.sourceDef
*/
this.patchAutocomplete = function (params) {
var selectDef = params.selectDef;
var sourceDef = params.sourceDef;
self.ORIGINAL_AUTOCOMPLETE = $.fn.autocomplete;
$.fn.autocomplete = function (params) {
var select = params.select;
var source = params.source;
params.select = function () {
select.apply(this, arguments);
selectDef.resolve();
};
params.source = function () {
source.apply(this, arguments);
sourceDef.resolve();
};
return self.ORIGINAL_AUTOCOMPLETE.apply(this, arguments);
};
};
/**
* Unpatch autocomplete
*/
this.unpatchAutocomplete = function () {
$.fn.autocomplete = self.ORIGINAL_AUTOCOMPLETE;
};
},
afterEach: function () {
// reset thread window append to body
this.services.mail_service.prototype.THREAD_WINDOW_APPENDTO = 'body';
},
}, function () {
QUnit.module('ThreadWindow');
QUnit.test('close thread window using ESCAPE key', function (assert) {
assert.expect(5 + this.BEFORE_EACH_ASSERTIONS_NUM);
var parent = this.createParent({
data: this.data,
services: this.services,
mockRPC: function (route, args) {
if (args.method === 'channel_fold') {
assert.ok(true, "should call channel_fold");
return $.when();
}
return this._super.apply(this, arguments);
},
});
// get channel instance to link to thread window
var channel = parent.call('mail_service', 'getChannel', 1);
assert.ok(channel, "there should exist a channel locally with ID 1");
channel.detach();
assert.strictEqual($('.o_thread_window').length, 1,
"there should be a thread window that is opened");
// focus on the thread window and press ESCAPE
$('.o_thread_window .o_composer_text_field').click();
assert.strictEqual(document.activeElement,
$('.o_thread_window .o_composer_text_field')[0],
"thread window's input should now be focused");
var upKeyEvent = $.Event( "keyup", { which: 27 });
$('.o_thread_window .o_composer_text_field').trigger(upKeyEvent);
assert.strictEqual($('.o_thread_window').length, 0,
"the thread window should be closed");
parent.destroy();
});
QUnit.test('thread window\'s input can still be focused when the UI is blocked', function (assert) {
assert.expect(2 + this.BEFORE_EACH_ASSERTIONS_NUM);
var parent = this.createParent({
data: this.data,
services: this.services,
});
var $dom = $('#qunit-fixture');
// get channel instance to link to thread window
var channel = parent.call('mail_service', 'getChannel', 1);
channel.detach();
var $input = $('<input/>', {type: 'text'}).appendTo($dom);
$input.focus().click();
assert.strictEqual(document.activeElement, $input[0],
"fake input should be focused");
framework.blockUI();
// cannot force focus here otherwise the test
// makes no sense, this test is just about
// making sure that the code which forces the
// focus on click is not removed
$('.o_thread_window .o_composer_text_field').click();
assert.strictEqual(document.activeElement,
$('.o_thread_window .o_composer_text_field')[0],
"thread window's input should now be focused");
framework.unblockUI();
parent.destroy();
});
QUnit.test('emoji popover should open correctly in thread windows', function (assert) {
assert.expect(1 + this.BEFORE_EACH_ASSERTIONS_NUM);
var parent = this.createParent({
data: this.data,
services: this.services,
});
// get channel instance to link to thread window
var channel = parent.call('mail_service', 'getChannel', 1);
channel.detach();
var $emojiButton = $('.o_composer_button_emoji');
$emojiButton.trigger('focusin').focus().click();
var $popover = $('.o_mail_emoji_container');
var done = assert.async();
// Async is needed as the popover focusout hiding is deferred
setTimeout(function () {
assert.ok($popover.is(':visible'), "emoji popover should have stayed opened");
parent.destroy();
done();
}, 0);
});
QUnit.test('do not increase unread counter when receiving message with myself as author', function (assert) {
assert.expect(4 + this.BEFORE_EACH_ASSERTIONS_NUM);
var generalChannelID = 1;
var myselfPartnerID = 44;
this.data.initMessaging = {
channel_slots: {
channel_channel: [{
id: generalChannelID,
channel_type: 'channel',
name: "general",
}],
},
};
var parent = this.createParent({
data: this.data,
services: this.services,
session: { partner_id: myselfPartnerID }
});
// get channel instance to link to thread window
var channel = parent.call('mail_service', 'getChannel', 1);
channel.detach();
var threadWindowHeaderText = $('.o_thread_window_header').text().replace(/\s/g, "");
assert.strictEqual(threadWindowHeaderText, "#general",
"thread window header text should not have any unread counter initially");
assert.strictEqual(channel.getUnreadCounter(), 0,
"thread should have unread counter to 0 initially");
// simulate receiving message from myself
var messageData = {
author_id: [myselfPartnerID, "Myself"],
body: "<p>Test message</p>",
id: 2,
model: 'mail.channel',
res_id: 1,
channel_ids: [1],
};
var notification = [[false, 'mail.channel', generalChannelID], messageData];
parent.call('bus_service', 'trigger', 'notification', [notification]);
threadWindowHeaderText = $('.o_thread_window_header').text().replace(/\s/g, "");
assert.strictEqual(threadWindowHeaderText, "#general",
"thread window header text should not have any unread counter after receiving my message");
assert.strictEqual(channel.getUnreadCounter(), 0,
"thread should not have incremented its unread counter after receiving my message");
parent.destroy();
});
QUnit.module('Blank ThreadWindow');
QUnit.test('basic rendering blank thread window', function (assert) {
assert.expect(5 + this.BEFORE_EACH_ASSERTIONS_NUM);
var parent = this.createParent({
data: this.data,
services: this.services,
});
// open blank thread window
parent.call('mail_service', 'openBlankThreadWindow');
assert.strictEqual($('.o_thread_window').length, 1,
"should have a thread window open");
assert.strictEqual($('.o_thread_window_title').text().trim(),
"New message",
"the blank window should have the correct title");
assert.strictEqual($('.o_composer_text_field').length, 0,
"should have no composer in the blank window");
assert.strictEqual($('.o_thread_search_input input').length, 1,
"the blank window should have an input");
assert.strictEqual($('.o_thread_search_input span').text().trim(),
"To:",
"the blank window should propose to type a partner next to the input");
parent.destroy();
});
QUnit.test('close blank thread window', function (assert) {
assert.expect(1 + this.BEFORE_EACH_ASSERTIONS_NUM);
var parent = this.createParent({
data: this.data,
services: this.services,
});
// open blank thread window
parent.call('mail_service', 'openBlankThreadWindow');
$('.o_thread_window_close').click();
assert.strictEqual($('.o_thread_window').length, 0,
"blank thread window should be closed");
parent.destroy();
});
QUnit.test('open new DM chat from blank thread window', function (assert) {
assert.expect(6 + this.BEFORE_EACH_ASSERTIONS_NUM);
var done = assert.async();
var self = this;
var selectDef = $.Deferred();
var sourceDef = $.Deferred();
this.patchAutocomplete({
selectDef: selectDef,
sourceDef: sourceDef,
});
var def = $.Deferred();
this.data['res.partner'] = {
fields: {},
records: [],
};
var parent = this.createParent({
data: this.data,
services: this.services,
mockRPC: function (route, args) {
if (args.method === 'im_search') {
def.resolve();
return $.when([
{ id: 1, name: 'DemoUser1' },
{ id: 2, name: 'DemoUser2', }
]);
}
if (args.method === 'channel_get_and_minimize') {
return $.when({
channel_type: 'chat',
direct_partner: [{ id: args.args[0][0], name: 'DemoUser1', im_status: '' }],
id: 50,
is_minimized: true,
name: 'DemoUser1',
});
}
return this._super.apply(this, arguments);
},
});
// open blank thread window
parent.call('mail_service', 'openBlankThreadWindow');
$('.o_thread_search_input input').val("D").trigger('keydown');
$.when(sourceDef, def).then(function () {
assert.strictEqual($('.ui-menu-item a').length, 2,
"should suggest 2 partners for DM");
assert.strictEqual($('.ui-menu-item a').eq(0).text(), "DemoUser1",
"first suggestion should be 'DemoUser1'");
assert.strictEqual($('.ui-menu-item a').eq(1).text(), "DemoUser2",
"second suggestion should be 'DemoUser2'");
$('.ui-menu-item a').eq(0).click();
});
selectDef.then(function () {
assert.strictEqual($('.o_thread_window').length, 1,
"should be a single window");
assert.strictEqual($('.o_thread_window_title').text().trim(), "#DemoUser1",
"should have thread window of the DM chat with 'DemoUser1'");
assert.strictEqual($('.o_composer_text_field').length, 1,
"should have a composer in the DM chat window");
self.unpatchAutocomplete();
parent.destroy();
done();
});
});
QUnit.test('open already detached DM chat from blank thread window', function (assert) {
// when opening an already detach DM chat from the blank thread window,
// the blank thread window should disappear
assert.expect(6 + this.BEFORE_EACH_ASSERTIONS_NUM);
var done = assert.async();
var self = this;
var selectDef = $.Deferred();
var sourceDef = $.Deferred();
this.patchAutocomplete({
selectDef: selectDef,
sourceDef: sourceDef,
});
var def = $.Deferred();
this.data['res.partner'] = {
fields: {},
records: [],
};
this.data.initMessaging.channel_slots.channel_dm = [{
channel_type: 'chat',
direct_partner: [{ id: 1, name: 'DemoUser1', im_status: '' }],
id: 50,
is_minimized: true,
name: 'DemoUser1',
}];
var parent = this.createParent({
data: this.data,
services: this.services,
mockRPC: function (route, args) {
if (args.method === 'im_search') {
def.resolve();
return $.when([
{ id: 1, name: 'DemoUser1' },
]);
}
return this._super.apply(this, arguments);
},
});
assert.strictEqual($('.o_thread_window').length, 1,
"should be a single window");
assert.strictEqual($('.o_thread_window_title').text().trim(), "#DemoUser1",
"should have thread window of the DM chat with 'DemoUser1'");
assert.strictEqual($('.o_composer_text_field').length, 1,
"should have a composer in the DM chat window");
// open blank thread window
parent.call('mail_service', 'openBlankThreadWindow');
assert.strictEqual($('.o_thread_window').length, 2,
"should have two thread windows open");
$('.o_thread_search_input input').val("D").trigger('keydown');
$.when(sourceDef, def).then(function () {
$('.ui-menu-item a').eq(0).click();
});
selectDef.then(function () {
assert.strictEqual($('.o_thread_window').length, 1,
"should now have a single thread window open");
assert.strictEqual($('.o_thread_window_title').text().trim(), "#DemoUser1",
"the remaining thread window should be the DM chat with 'DemoUser1'");
self.unpatchAutocomplete();
parent.destroy();
done();
});
});
});
});
+6 -2
View File
@@ -64,7 +64,8 @@
<script type="text/javascript" src="/mail/static/src/js/systray/systray_activity_menu.js"></script>
<script type="text/javascript" src="/mail/static/src/js/systray/systray_messaging_menu.js"></script>
<script type="text/javascript" src="/mail/static/src/js/tour.js"></script>
<script type="text/javascript" src="/mail/static/src/js/utils.js"></script>
<!-- utils -->
<script type="text/javascript" src="/mail/static/src/js/utils.js"></script>
<script type="text/javascript" src="/mail/static/src/js/activity.js"></script>
<!-- Activity view type -->
<script type="text/javascript" src="/mail/static/src/js/views/activity/activity_view.js"></script>
@@ -98,7 +99,10 @@
<template id="qunit_suite" name="mail_tests" inherit_id="web.qunit_suite">
<xpath expr="//t[@t-set='head']" position="inside">
<script type="text/javascript" src="/mail/static/tests/thread_window_tests.js"></script>
<!-- thread window -->
<script type="text/javascript" src="/mail/static/tests/thread_window/basic_thread_window_tests.js"></script>
<script type="text/javascript" src="/mail/static/tests/thread_window/blank_thread_window_tests.js"></script>
<script type="text/javascript" src="/mail/static/tests/thread_window/hidden_thread_window_tests.js"></script>
<script type="text/javascript" src="/mail/static/tests/document_thread_window_tests.js"></script>
<script type="text/javascript" src="/mail/static/tests/chatter_tests.js"></script>
<script type="text/javascript" src="/mail/static/tests/mail_utils_tests.js"></script>