[FIX] web: truncate m2o dropdown item's text

Before this commit, when a record had a very long
display name, the name could be cut in the middle of a
word in the many2one's dropdown.
Now, these names are truncated and have ellipsis to tell
the text continues.

task id: 3234714

closes odoo/odoo#115712

X-original-commit: ed9f9098e3b85c8c739ed7fa5ff6b28bfa2e3584
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
This commit is contained in:
Michael (mcm)
2023-03-17 22:27:14 +01:00
parent d8890195db
commit c57fcf4e9e
2 changed files with 4 additions and 6 deletions
@@ -39,7 +39,7 @@
>
<a
href="#"
class="dropdown-item ui-menu-item-wrapper"
class="dropdown-item ui-menu-item-wrapper text-truncate"
t-att-class="{ 'ui-state-active': isActiveSourceOption([source_index, option_index]) }"
>
<t t-if="source.optionTemplate">
@@ -4093,9 +4093,6 @@ QUnit.module("Fields", (hooks) => {
});
QUnit.test("many2one dropdown disappears on scroll", async function (assert) {
serverData.models.partner.records[0].display_name =
"Veeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeery Loooooooooooooooooooooooooooooooooooooooooooong Naaaaaaaaaaaaaaaaaaaaaaaaaaaaaaame";
await makeView({
type: "form",
resModel: "partner",
@@ -4113,8 +4110,9 @@ QUnit.module("Fields", (hooks) => {
assert.containsOnce(target, ".o_field_many2one .dropdown-menu");
const dropdown = document.querySelector(".o_field_many2one .dropdown-menu");
await triggerScroll(dropdown, { left: 50 }, false);
assert.strictEqual(dropdown.scrollLeft, 50, "a scroll happened");
dropdown.style = "max-height: 40px;";
await triggerScroll(dropdown, { top: 50 }, false);
assert.strictEqual(dropdown.scrollTop, 50, "a scroll happened");
assert.containsOnce(target, ".o_field_many2one .dropdown-menu");
await triggerScroll(target, { top: 50 });