[FIX] web: field translate button unapplied style

Before this commit
There is  an issue about the translatable field button not properly
shown.
A translatable field <input/> or <textarea/> should have a right padding
in order to ensure its text content does not go behind the translate
button.

After this commit
Existing style regarding this is reapplied.

Part-of: odoo/odoo#94952
This commit is contained in:
Bruno Boi
2022-07-05 17:32:51 +02:00
parent 25e1b12f49
commit 8eaddda496
4 changed files with 17 additions and 11 deletions
@@ -8,6 +8,7 @@
<t t-else="">
<input
class="o_input"
t-att-class="{'o_field_translate': props.isTranslatable}"
t-att-id="props.id"
t-att-type="props.isPassword ? 'password' : 'text'"
t-att-autocomplete="props.autocomplete or (props.isPassword ? 'new-password' : 'off')"
@@ -8,6 +8,7 @@
<t t-else="">
<textarea
class="o_input"
t-att-class="{'o_field_translate': props.isTranslatable}"
t-att-id="props.id"
t-att-placeholder="props.placeholder"
t-att-rows="rowCount"
@@ -307,7 +307,7 @@ QUnit.module("Fields", (hooks) => {
});
QUnit.test("char field translatable", async function (assert) {
assert.expect(12);
assert.expect(13);
serverData.models.partner.fields.foo.translate = true;
serviceRegistry.add("localization", makeFakeLocalizationService({ multiLang: true }), {
@@ -367,17 +367,19 @@ QUnit.module("Fields", (hooks) => {
await click(target, ".o_form_button_edit");
assert.hasClass(target.querySelector("[name=foo] input"), "o_field_translate");
assert.containsOnce(
target,
".o_field_char .o_field_translate",
".o_field_char .btn.o_field_translate",
"should have a translate button"
);
assert.strictEqual(
target.querySelector(".o_field_char .o_field_translate").textContent,
target.querySelector(".o_field_char .btn.o_field_translate").textContent,
"EN",
"the button should have as test the current language"
);
await click(target, ".o_field_char .o_field_translate");
await click(target, ".o_field_char .btn.o_field_translate");
assert.containsOnce(target, ".modal", "a translate modal should be visible");
assert.containsN(
@@ -405,7 +407,7 @@ QUnit.module("Fields", (hooks) => {
);
await editInput(target, `.o_field_char input[type="text"]`, "new english value");
await click(target, ".o_field_char .o_field_translate");
await click(target, ".o_field_char .btn.o_field_translate");
enFields = target.querySelectorAll(".modal .o_translation_dialog .translation input");
assert.strictEqual(
@@ -509,7 +511,7 @@ QUnit.module("Fields", (hooks) => {
"<p>first paragraph</p><p>second paragraph</p>"
);
await click(target, ".o_field_char .o_field_translate");
await click(target, ".o_field_char .btn.o_field_translate");
assert.containsOnce(target, ".modal", "a translate modal should be visible");
assert.containsN(
target,
@@ -559,7 +561,7 @@ QUnit.module("Fields", (hooks) => {
assert.containsOnce(
target,
`.o_field_char .o_field_translate`,
`.o_field_char .btn.o_field_translate`,
"should have a translate button in create mode"
);
});
@@ -372,7 +372,7 @@ QUnit.module("Fields", (hooks) => {
});
QUnit.test("text field translatable", async function (assert) {
assert.expect(3);
assert.expect(4);
serverData.models.partner.fields.txt.translate = true;
serviceRegistry.add("localization", makeFakeLocalizationService({ multiLang: true }), {
@@ -412,12 +412,14 @@ QUnit.module("Fields", (hooks) => {
await click(target, ".o_form_button_edit");
assert.hasClass(target.querySelector("[name=txt] textarea"), "o_field_translate");
assert.containsOnce(
target,
".o_field_text .o_field_translate",
".o_field_text .btn.o_field_translate",
"should have a translate button"
);
await click(target, ".o_field_text .o_field_translate");
await click(target, ".o_field_text .btn.o_field_translate");
assert.containsOnce(target, ".modal", "there should be a translation modal");
});
@@ -444,7 +446,7 @@ QUnit.module("Fields", (hooks) => {
assert.containsOnce(
target,
".o_field_text .o_field_translate",
".o_field_text .btn.o_field_translate",
"should have a translate button in create mode"
);
});