This module improves the usability of translating HTML fields.
+The standard translation dialog of an HTML field splits its content into +individual source terms (chunks) and asks the user to translate each one +separately. This is technical and hard to use for end users, especially +on rich content.
+With this module, the translation button next to an HTML field opens a +dialog that shows one full rich-text editor per installed language. +The user reads and edits the whole translation of each language as a +single block, exactly as the field is edited in the form.
+The standard term-by-term dialog is kept untouched for char and +text translatable fields.
+Table of contents
+Bugs are tracked on GitHub Issues. +In case of trouble, please check there if your issue has already been reported. +If you spotted it first, help us to smash it by providing a detailed and welcomed +feedback.
+Do not contact contributors directly about support or help with technical issues.
+This module is maintained by the OCA.
+ +
+
+OCA, or the Odoo Community Association, is a nonprofit organization whose +mission is to support the collaborative development of Odoo features and +promote its widespread use.
+This module is part of the OCA/web project on GitHub.
+You are welcome to contribute. To learn how please visit https://odoo-community.org/page/Contribute.
+Hello
"}]; +} + +class User extends models.Model { + _name = "res.users"; + has_group() { + return true; + } +} + +defineModels([Partner, User]); + +test("html translatable field opens a per-language rich-text dialog", async () => { + serverState.lang = "en_US"; + serverState.multiLang = true; + + onRpc("has_group", () => true); + onRpc("res.lang", "get_installed", () => [ + ["en_US", "English"], + ["fr_FR", "French"], + ]); + onRpc("web_get_field_translations_full", ({args}) => { + expect(args[1]).toBe("txt"); + return [ + {lang: "en_US", value: "Hello
"}, + {lang: "fr_FR", value: "Bonjour
"}, + ]; + }); + + await mountView({ + type: "form", + resModel: "partner", + resId: 1, + arch: /* xml */ ``, + }); + + expect(".o_field_html .btn.o_field_translate").toHaveCount(1, { + message: "the translate button should be displayed next to the HTML field", + }); + + await click(".o_field_html .btn.o_field_translate"); + await animationFrame(); + + expect(".modal .o_html_translation_dialog").toHaveCount(1, { + message: "the per-language HTML translation dialog should open", + }); + expect(".o_translation_dialog").toHaveCount(0, { + message: "the standard term-by-term dialog should not be used for HTML fields", + }); + expect(".o_html_translation_editor").toHaveCount(2, { + message: "there should be one full editor per installed language", + }); + // The HTML must be rendered, not displayed as escaped markup. + const editors = queryAll(".o_html_translation_editor [contenteditable=true]"); + expect(editors[0]).toHaveText("Hello", { + message: "the editor should render the HTML, not show the raw tags", + }); + expect(editors[0].querySelector("p")).not.toBe(null, { + message: "the value should be parsed as HTML (aelement is present)", + }); +}); + +test("the per-language dialog saves the full value of every language", async () => { + serverState.lang = "en_US"; + serverState.multiLang = true; + + onRpc("has_group", () => true); + onRpc("res.lang", "get_installed", () => [ + ["en_US", "English"], + ["fr_FR", "French"], + ]); + onRpc("web_get_field_translations_full", () => [ + {lang: "en_US", value: "
Hello
"}, + {lang: "fr_FR", value: "Bonjour
"}, + ]); + onRpc("web_set_field_translations_full", ({args}) => { + expect(args[1]).toBe("txt"); + expect(Object.keys(args[2]).sort()).toEqual(["en_US", "fr_FR"], { + message: "the full value of every language should be sent on save", + }); + expect.step("web_set_field_translations_full"); + return true; + }); + + await mountView({ + type: "form", + resModel: "partner", + resId: 1, + arch: /* xml */ ``, + }); + + await click(".o_field_html .btn.o_field_translate"); + await animationFrame(); + + const saveButton = queryAll(".modal footer .btn-primary")[0]; + await click(saveButton); + await animationFrame(); + + expect.verifySteps(["web_set_field_translations_full"]); + expect(".modal .o_html_translation_dialog").toHaveCount(0, { + message: "the dialog should close after saving", + }); +}); diff --git a/web_html_field_translate_dialog/tests/__init__.py b/web_html_field_translate_dialog/tests/__init__.py new file mode 100644 index 000000000000..59d42a3dbbf0 --- /dev/null +++ b/web_html_field_translate_dialog/tests/__init__.py @@ -0,0 +1,2 @@ +from . import test_html_field_translation +from . import test_html_translation_dialog_ui diff --git a/web_html_field_translate_dialog/tests/test_html_field_translation.py b/web_html_field_translate_dialog/tests/test_html_field_translation.py new file mode 100644 index 000000000000..9da7e949e5e9 --- /dev/null +++ b/web_html_field_translate_dialog/tests/test_html_field_translation.py @@ -0,0 +1,85 @@ +# Copyright 2025 ForgeFlow S.L. +# License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl). + +from odoo.tests import Form, TransactionCase + + +class TestHtmlFieldTranslation(TransactionCase): + """Exercise the per-language full-value translation helpers on a + translatable HTML field that is shown in a form view. + + A small custom model with a translatable ``html`` field (which becomes a + ``html_translate`` callable field, i.e. exactly the kind whose standard + dialog splits the content into terms) and its own form view are created so + the behaviour can be reproduced through a :class:`~odoo.tests.Form`. + """ + + @classmethod + def setUpClass(cls): + super().setUpClass() + cls.env["res.lang"]._activate_lang("fr_FR") + model = cls.env["ir.model"].create( + {"name": "HTML Translate Test", "model": "x_html_translate_test"} + ) + cls.env["ir.model.fields"].create( + { + "name": "x_body", + "field_description": "Body", + "model_id": model.id, + "ttype": "html", + # In Odoo 19 ir.model.fields.translate is a Selection; + # "html_translate" yields a term-translated HTML field. + "translate": "html_translate", + } + ) + cls.view = cls.env["ir.ui.view"].create( + { + "name": "x_html_translate_test.form", + "model": "x_html_translate_test", + "type": "form", + "arch": """ + + """, + } + ) + cls.TestModel = cls.env["x_html_translate_test"] + # Set the source (en_US) value the way a user would: through a Form. + with Form(cls.TestModel.with_context(lang="en_US"), view=cls.view) as form: + form.x_body = "Hello world
" + cls.record = form.record + + def test_get_field_translations_full_returns_value_per_language(self): + result = self.record.web_get_field_translations_full("x_body") + by_lang = {term["lang"]: term["value"] for term in result} + # Both the source language and the activated language are present. + self.assertIn("en_US", by_lang) + self.assertIn("fr_FR", by_lang) + # The full value is returned, not chunked source terms. + self.assertIn("Hello world", by_lang["en_US"]) + # Without a translation yet, the field falls back to the source value. + self.assertIn("Hello world", by_lang["fr_FR"]) + + def test_set_field_translations_full_writes_each_language(self): + self.record.web_set_field_translations_full( + "x_body", + { + "en_US": "Hello world
", + "fr_FR": "Bonjour le monde
", + }, + ) + record_en = self.record.with_context(lang="en_US") + record_fr = self.record.with_context(lang="fr_FR") + self.assertIn("Hello world", record_en.x_body) + self.assertIn("Bonjour le monde", record_fr.x_body) + # Each language keeps its own full value; the source is not corrupted by + # a structurally different translation. + self.assertNotIn("Bonjour", record_en.x_body) + self.assertNotIn("Hello", record_fr.x_body) + + def test_set_field_translations_full_ignores_non_translatable(self): + # ``display_name`` is not translatable here: the method must be a no-op + # returning False rather than writing garbage. + result = self.record.web_set_field_translations_full("x_name", {"fr_FR": "Nom"}) + self.assertFalse(result) diff --git a/web_html_field_translate_dialog/tests/test_html_translation_dialog_ui.py b/web_html_field_translate_dialog/tests/test_html_translation_dialog_ui.py new file mode 100644 index 000000000000..571c2f06e53d --- /dev/null +++ b/web_html_field_translate_dialog/tests/test_html_translation_dialog_ui.py @@ -0,0 +1,19 @@ +# Copyright 2025 ForgeFlow S.L. +# License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl). + +from odoo.tests import HttpCase, tagged + + +@tagged("post_install", "-at_install") +class TestHtmlTranslationDialogUI(HttpCase): + def test_html_translation_dialog_ui(self): + """Run the dialog's web unit (hoot) tests through a headless browser.""" + self.browser_js( + "/web/tests?headless&loglevel=2&preset=desktop" + "&timeout=15000&filter=per-language", + "", + "", + login="admin", + timeout=900, + success_signal="[HOOT] Test suite succeeded", + )