pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] mail: restore close of other menus on click of messaging menu

Browse Source 
task-2278830

closes odoo/odoo#53566

X-original-commit: 0407151b34da16ca54066bb15e578dc1db85f365
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
Signed-off-by: Sébastien Theys (seb) <seb@odoo.com>
This commit is contained in:
Sébastien Theys
2020-06-24 10:22:58 +00:00
parent ba744be937
commit 652d835f77
6 changed files with 67 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/mail/static/src/components/messaging_menu/messaging_menu.js
+5 -5
View File
@@ -113,6 +113,8 @@ class MessagingMenu extends Component {
//--------------------------------------------------------------------------
/**
* Closes the menu when clicking outside, if appropriate.
*
* @private
* @param {MouseEvent} ev
*/
@@ -126,7 +128,7 @@ class MessagingMenu extends Component {
) {
return;
}
// closes the menu when clicking outside
// ignore click inside the menu
if (this.el.contains(ev.target)) {
return;
}
@@ -142,7 +144,6 @@ class MessagingMenu extends Component {
* @param {MouseEvent} ev
*/
_onClickDesktopTabButton(ev) {
ev.stopPropagation();
this.messagingMenu.update({ activeTabId: ev.currentTarget.dataset.tabId });
}
@@ -151,9 +152,8 @@ class MessagingMenu extends Component {
* @param {MouseEvent} ev
*/
_onClickNewMessage(ev) {
ev.stopPropagation();
if (!this.env.messaging.device.isMobile) {
this.env.models['mail.thread'].openNewMessage();
this.env.messaging.chatWindowManager.openNewMessage();
this.messagingMenu.close();
} else {
this.messagingMenu.toggleMobileNewMessage();
@@ -165,7 +165,7 @@ class MessagingMenu extends Component {
* @param {MouseEvent} ev
*/
_onClickToggler(ev) {
ev.stopPropagation();
// avoid following dummy href
ev.preventDefault();
this.messagingMenu.toggleOpen();
}
addons/mail/static/src/components/messaging_menu/messaging_menu.scss
+1 -1
View File
@@ -99,7 +99,7 @@
// ------------------------------------------------------------------
// Make hightlight more consistent, due to messaging menu looking quite similar to discuss app in mobile
.o_MessagingMenu.show {
.o_MessagingMenu.o-is-open {
background-color: rgba(black, 0.1);
}
addons/mail/static/src/components/messaging_menu/messaging_menu.xml
+2 -2
View File
@@ -2,10 +2,10 @@
<templates xml:space="preserve">
<t t-name="mail.MessagingMenu" owl="1">
<li class="o_MessagingMenu" t-att-class="{ show: messagingMenu.isOpen, 'o-mobile': env.messaging.device.isMobile }">
<li class="o_MessagingMenu" t-att-class="{ 'o-is-open': messagingMenu.isOpen, 'o-mobile': env.messaging.device.isMobile }">
<!-- TODO FIXME restore mobile stuff here (activeMobileThread) -->
<t t-if="!env.messaging.device.isMobile or true">
<a class="o_MessagingMenu_toggler o-no-caret" t-att-class="{ show: messagingMenu.isOpen, 'o-no-notification': !messagingMenu.counter }" href="#" t-on-click="_onClickToggler" data-toggle="dropdown" data-display="static" title="Conversations" role="button" aria-expanded="false">
<a class="o_MessagingMenu_toggler" t-att-class="{ 'o-no-notification': !messagingMenu.counter }" href="#" title="Conversations" role="button" t-att-aria-expanded="messagingMenu.isOpen ? 'true' : 'false'" aria-haspopup="true" t-on-click="_onClickToggler">
<i class="o_MessagingMenu_icon fa fa-comments" role="img" aria-label="Messages"/>
<t t-if="!env.messaging.isInitialized">
<i class="o_MessagingMenu_loading fa fa-spinner fa-spin"/>
addons/mail/static/src/components/messaging_menu/messaging_menu_tests.js
+11 -7
View File
@@ -140,13 +140,10 @@ QUnit.test('basic rendering', async function (assert) {
);
await afterNextRender(() => document.querySelector(`.o_MessagingMenu_toggler`).click());
assert.ok(
document.querySelector('.o_MessagingMenu').classList.contains('show'),
"should mark messaging menu item as shown"
);
assert.ok(
document.querySelector(`.o_MessagingMenu_toggler`).classList.contains('show'),
"should mark messaging menu clickable item as shown"
assert.hasClass(
document.querySelector('.o_MessagingMenu'),
"o-is-open",
"should mark messaging menu as opened"
);
assert.strictEqual(
document.querySelectorAll(`.o_MessagingMenu_dropdownMenu`).length,
@@ -220,6 +217,13 @@ QUnit.test('basic rendering', async function (assert) {
1,
"should display no conversation in thread preview list"
);
await afterNextRender(() => document.querySelector(`.o_MessagingMenu_toggler`).click());
assert.doesNotHaveClass(
document.querySelector('.o_MessagingMenu'),
"o-is-open",
"should mark messaging menu as closed"
);
});
QUnit.test('counter is taking into account failure notification', async function (assert) {
addons/mail/static/src/models/thread/thread.js
-12
View File
@@ -366,18 +366,6 @@ function factory(dependencies) {
}
}
/**
* @static
*/
static openNewMessage() {
const discuss = this.env.messaging.discuss;
if (discuss.isOpen) {
discuss.openNewMessage();
} else {
this.env.messaging.chatWindowManager.openNewMessage();
}
}
/**
* @param {string} [stringifiedDomain='[]']
* @returns {mail.thread_cache}
addons/mail/static/tests/systray/systray_activity_menu_tests.js
+48 -8
View File
@@ -1,7 +1,10 @@
odoo.define('mail.systray.ActivityMenuTests', function (require) {
"use strict";
const { start } = require('mail/static/src/utils/test_utils.js');
const {
afterNextRender,
start,
} = require('mail/static/src/utils/test_utils.js');
var ActivityMenu = require('mail.systray.ActivityMenu');
var testUtils = require('web.test_utils');
@@ -15,10 +18,10 @@ QUnit.module('ActivityMenu', {
name: { type: "char" },
model: { type: "char" },
type: { type: "char" },
planned_count: { type: "integer"},
today_count: { type: "integer"},
overdue_count: { type: "integer"},
total_count: { type: "integer"},
planned_count: { type: "integer" },
today_count: { type: "integer" },
overdue_count: { type: "integer" },
total_count: { type: "integer" },
actions: [{
icon: { type: "char" },
name: { type: "char" },
@@ -181,17 +184,17 @@ QUnit.test('activity menu widget: activity view icon', async function (assert) {
var $second = activityMenu.$('.o_mail_activity_action').eq(1);
assert.strictEqual($first.data('model_name'), "Issue",
"first activity action should link to 'Issue'");
assert.hasClass($first,'fa-clock-o', "should display the activity action icon");
assert.hasClass($first, 'fa-clock-o', "should display the activity action icon");
assert.strictEqual($second.data('model_name'), "Note",
"Second activity action should link to 'Note'");
assert.hasClass($second,'fa-clock-o', "should display the activity action icon");
assert.hasClass($second, 'fa-clock-o', "should display the activity action icon");
testUtils.mock.intercept(activityMenu, 'do_action', function (ev) {
if (ev.data.action.name) {
assert.ok(ev.data.action.domain, "should define a domain on the action");
assert.deepEqual(ev.data.action.domain, [["activity_ids.user_id", "=", 10]],
"should set domain to user's activity only")
"should set domain to user's activity only");
assert.step('do_action:' + ev.data.action.name);
} else {
assert.step('do_action:' + ev.data.action);
@@ -218,5 +221,42 @@ QUnit.test('activity menu widget: activity view icon', async function (assert) {
widget.destroy();
});
QUnit.test('activity menu widget: close on messaging menu click', async function (assert) {
assert.expect(2);
const { widget } = await start({
hasMessagingMenu: true,
async mockRPC(route, args) {
if (args.method === 'systray_get_activities') {
return [];
}
return this._super(route, args);
},
});
const activityMenu = new ActivityMenu(widget);
await activityMenu.appendTo($('#qunit-fixture'));
await testUtils.nextTick();
await testUtils.dom.click(activityMenu.$('.dropdown-toggle'));
assert.hasClass(
activityMenu.el.querySelector('.o_mail_systray_dropdown'),
'show',
"activity menu should be shown after click on itself"
);
await afterNextRender(() =>
document.querySelector(`.o_MessagingMenu_toggler`).click()
);
assert.doesNotHaveClass(
activityMenu.el.querySelector('.o_mail_systray_dropdown'),
'show',
"activity menu should be hidden after click on messaging menu"
);
widget.destroy();
});
});
});