[IMP] mail: avatar card preview v2
This commit changes the behavior of the avatar card preview so that it is now triggered on click instead of on hover and the previous behavior of the click event (open chat) is therefore removed. It also adds the functionality to the Message and Activity components of discuss so that clicking on the avatar inside these components will also show the card. It also makes sure that the id of the user is added to the persona even if nothing indicates that it should. task-3442819 closes odoo/odoo#131355 Related: odoo/enterprise#47084 Signed-off-by: Francois Georis (fge) <fge@odoo.com>
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
<templates xml:space="preserve">
|
||||
<t t-inherit="mail.AvatarCardPopover" t-inherit-mode="extension">
|
||||
<xpath expr="//div[hasclass('o_avatar_card_buttons')]" position="inside">
|
||||
<button class="btn btn-secondary btn-sm" t-on-click.stop="onClickViewEmployee"> View profile </button>
|
||||
<button class="btn btn-secondary btn-sm" t-if="user.employee_id" t-on-click.stop="onClickViewEmployee">View profile</button>
|
||||
</xpath>
|
||||
</t>
|
||||
|
||||
|
||||
@@ -59,34 +59,34 @@ QUnit.test("many2one_avatar_employee widget in list view", async function (asser
|
||||
document.querySelectorAll(".o_data_cell div[name='employee_id']")[2].innerText,
|
||||
"Mario"
|
||||
);
|
||||
|
||||
// TODO: avatar card employee
|
||||
// click on first employee
|
||||
dom.click(document.querySelector(".o_data_cell .o_m2o_avatar > img"));
|
||||
await contains(".o-mail-ChatWindow-name");
|
||||
assert.verifySteps([`read hr.employee.public ${employeeId_1}`]);
|
||||
assert.strictEqual(document.querySelector(".o-mail-ChatWindow-name").textContent, "Mario");
|
||||
// dom.click(document.querySelector(".o_data_cell .o_m2o_avatar > img"));
|
||||
// await contains(".o-mail-ChatWindow-name");
|
||||
// assert.verifySteps([`read hr.employee.public ${employeeId_1}`]);
|
||||
// assert.strictEqual(document.querySelector(".o-mail-ChatWindow-name").textContent, "Mario");
|
||||
|
||||
// click on second employee
|
||||
dom.click(document.querySelectorAll(".o_data_cell .o_m2o_avatar > img")[1]);
|
||||
await contains(".o-mail-ChatWindow-name", { count: 2 });
|
||||
assert.verifySteps([`read hr.employee.public ${employeeId_2}`]);
|
||||
assert.strictEqual(
|
||||
document.querySelectorAll(".o-mail-ChatWindow-name")[1].textContent,
|
||||
"Luigi"
|
||||
);
|
||||
// // click on second employee
|
||||
// dom.click(document.querySelectorAll(".o_data_cell .o_m2o_avatar > img")[1]);
|
||||
// await contains(".o-mail-ChatWindow-name", { count: 2 });
|
||||
// assert.verifySteps([`read hr.employee.public ${employeeId_2}`]);
|
||||
// assert.strictEqual(
|
||||
// document.querySelectorAll(".o-mail-ChatWindow-name")[1].textContent,
|
||||
// "Luigi"
|
||||
// );
|
||||
|
||||
// click on third employee (same as first)
|
||||
dom.click(document.querySelectorAll(".o_data_cell .o_m2o_avatar > img")[2]);
|
||||
assert.containsN(
|
||||
document.body,
|
||||
".o-mail-ChatWindow-name",
|
||||
2,
|
||||
"should still have only 2 chat windows because third is the same partner as first"
|
||||
);
|
||||
assert.verifySteps(
|
||||
[],
|
||||
"employee should not have been read again because we already know its partner"
|
||||
);
|
||||
// // click on third employee (same as first)
|
||||
// dom.click(document.querySelectorAll(".o_data_cell .o_m2o_avatar > img")[2]);
|
||||
// assert.containsN(
|
||||
// document.body,
|
||||
// ".o-mail-ChatWindow-name",
|
||||
// 2,
|
||||
// "should still have only 2 chat windows because third is the same partner as first"
|
||||
// );
|
||||
// assert.verifySteps(
|
||||
// [],
|
||||
// "employee should not have been read again because we already know its partner"
|
||||
// );
|
||||
});
|
||||
|
||||
QUnit.test("many2one_avatar_employee widget in kanban view", async function (assert) {
|
||||
@@ -158,10 +158,8 @@ QUnit.test(
|
||||
});
|
||||
await contains(".o_field_widget[name=employee_id] input", { value: "Mario" });
|
||||
await dom.click(document.querySelector(".o_m2o_avatar > img"));
|
||||
await contains(
|
||||
".o_notification.border-info:contains(You can only chat with employees that have a dedicated user.)"
|
||||
);
|
||||
assert.verifySteps([`web_read m2x.avatar.employee ${avatarId}`]);
|
||||
// Nothing should happen
|
||||
}
|
||||
);
|
||||
|
||||
@@ -218,12 +216,10 @@ QUnit.test("many2many_avatar_employee widget in form view", async function (asse
|
||||
await dom.click(
|
||||
document.querySelectorAll(".o_field_many2many_avatar_employee .o_tag .o_m2m_avatar")[1]
|
||||
);
|
||||
// TODO: avatar card employee
|
||||
assert.verifySteps([
|
||||
`web_read m2x.avatar.employee ${avatarId_1}`,
|
||||
`read hr.employee.public ${employeeId_1}`,
|
||||
`read hr.employee.public ${employeeId_2}`,
|
||||
]);
|
||||
await contains(".o-mail-ChatWindow-name", { count: 2 });
|
||||
});
|
||||
|
||||
QUnit.test("many2many_avatar_employee widget in list view", async function (assert) {
|
||||
@@ -265,21 +261,21 @@ QUnit.test("many2many_avatar_employee widget in list view", async function (asse
|
||||
2,
|
||||
"should have two avatar"
|
||||
);
|
||||
// TODO: avatar card employee
|
||||
// // click on first employee badge
|
||||
// dom.click(document.querySelector(".o_data_cell .o_m2m_avatar"));
|
||||
// await contains(".o-mail-ChatWindow-name");
|
||||
// assert.verifySteps([`read hr.employee.public ${employeeId_1}`]);
|
||||
// assert.strictEqual(document.querySelector(".o-mail-ChatWindow-name").textContent, "Mario");
|
||||
|
||||
// click on first employee badge
|
||||
dom.click(document.querySelector(".o_data_cell .o_m2m_avatar"));
|
||||
await contains(".o-mail-ChatWindow-name");
|
||||
assert.verifySteps([`read hr.employee.public ${employeeId_1}`]);
|
||||
assert.strictEqual(document.querySelector(".o-mail-ChatWindow-name").textContent, "Mario");
|
||||
|
||||
// click on second employee
|
||||
dom.click(document.querySelectorAll(".o_data_cell .o_m2m_avatar")[1]);
|
||||
await contains(".o-mail-ChatWindow-name", { count: 2 });
|
||||
assert.verifySteps([`read hr.employee.public ${employeeId_2}`]);
|
||||
assert.strictEqual(
|
||||
document.querySelectorAll(".o-mail-ChatWindow-name")[1].textContent,
|
||||
"Yoshi"
|
||||
);
|
||||
// // click on second employee
|
||||
// dom.click(document.querySelectorAll(".o_data_cell .o_m2m_avatar")[1]);
|
||||
// await contains(".o-mail-ChatWindow-name", { count: 2 });
|
||||
// assert.verifySteps([`read hr.employee.public ${employeeId_2}`]);
|
||||
// assert.strictEqual(
|
||||
// document.querySelectorAll(".o-mail-ChatWindow-name")[1].textContent,
|
||||
// "Yoshi"
|
||||
// );
|
||||
});
|
||||
|
||||
QUnit.test("many2many_avatar_employee widget in kanban view", async function (assert) {
|
||||
@@ -346,12 +342,9 @@ QUnit.test("many2many_avatar_employee widget in kanban view", async function (as
|
||||
`/web/image/hr.employee.public/${employeeId_1}/avatar_128`
|
||||
);
|
||||
|
||||
await dom.click(document.querySelectorAll(".o_kanban_record img.o_m2m_avatar")[1]);
|
||||
await dom.click(document.querySelectorAll(".o_kanban_record img.o_m2m_avatar")[0]);
|
||||
assert.verifySteps([
|
||||
`read hr.employee.public ${employeeId_1}`,
|
||||
`read hr.employee.public ${employeeId_2}`,
|
||||
]);
|
||||
await dom.click(document.querySelectorAll('.o_kanban_record img.o_m2m_avatar')[1]);
|
||||
await dom.click(document.querySelectorAll('.o_kanban_record img.o_m2m_avatar')[0]);
|
||||
// TODO: avatar card employee
|
||||
});
|
||||
|
||||
QUnit.test(
|
||||
@@ -400,14 +393,9 @@ QUnit.test(
|
||||
await dom.click(
|
||||
document.querySelectorAll(".o_field_many2many_avatar_employee .o_tag .o_m2m_avatar")[1]
|
||||
);
|
||||
await contains(
|
||||
".o_notification.border-info:contains(You can only chat with employees that have a dedicated user.)"
|
||||
);
|
||||
assert.verifySteps([
|
||||
`web_read m2x.avatar.employee ${employeeId_1}`,
|
||||
`read hr.employee.public ${employeeId_1}`,
|
||||
`read hr.employee.public ${employeeId_2}`,
|
||||
]);
|
||||
await contains(".o-mail-ChatWindow-name");
|
||||
// TODO: avtar card employee
|
||||
}
|
||||
);
|
||||
|
||||
@@ -1,9 +1,8 @@
|
||||
/* @odoo-module */
|
||||
|
||||
import { startServer } from "@bus/../tests/helpers/mock_python_environment";
|
||||
|
||||
import { start } from "@mail/../tests/helpers/test_utils";
|
||||
import { patchWithCleanup, triggerEvent, getFixture, getNodesTextContent } from "@web/../tests/helpers/utils";
|
||||
import { startServer } from "@bus/../tests/helpers/mock_python_environment";
|
||||
import { click, patchWithCleanup, getFixture, getNodesTextContent } from "@web/../tests/helpers/utils";
|
||||
import { registry } from "@web/core/registry";
|
||||
import { browser } from "@web/core/browser/browser";
|
||||
import { EventBus } from "@odoo/owl";
|
||||
@@ -71,6 +70,7 @@ QUnit.module("M2XAvatarUser", ({ beforeEach }) => {
|
||||
"email",
|
||||
"phone",
|
||||
"im_status",
|
||||
"share",
|
||||
"work_phone",
|
||||
"work_email",
|
||||
"job_title",
|
||||
@@ -107,13 +107,12 @@ QUnit.module("M2XAvatarUser", ({ beforeEach }) => {
|
||||
},
|
||||
});
|
||||
// Open card
|
||||
await triggerEvent(target, ".o_m2o_avatar > img", "mouseover");
|
||||
assert.verifySteps(["setTimeout of 350ms", "setTimeout of 250ms", "user read"]);
|
||||
await click(document, ".o_m2o_avatar > img");
|
||||
assert.verifySteps(["setTimeout of 250ms", "user read"]);
|
||||
assert.containsOnce(target, ".o_avatar_card");
|
||||
assert.deepEqual(getNodesTextContent(target.querySelectorAll(".o_card_user_infos > *")), ['Mario', 'sub manager', 'Managemment', ' Mario@odoo.pro', ' +585555555']);
|
||||
assert.deepEqual(getNodesTextContent(target.querySelectorAll(".o_card_user_infos > *")), ['Mario', 'sub manager', 'Managemment', 'Mario@odoo.pro', '+585555555']);
|
||||
// Close card
|
||||
await triggerEvent(target, ".o_control_panel", "mouseover");
|
||||
assert.verifySteps(["setTimeout of 400ms"]);
|
||||
await click(document, ".o_action_manager");
|
||||
assert.containsNone(target, ".o_avatar_card");
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user