diff --git a/addons/web/static/src/legacy/js/widgets/translation_dialog.js b/addons/web/static/src/legacy/js/widgets/translation_dialog.js
index fa866bb9c4e..9c6db4f2159 100644
--- a/addons/web/static/src/legacy/js/widgets/translation_dialog.js
+++ b/addons/web/static/src/legacy/js/widgets/translation_dialog.js
@@ -159,7 +159,8 @@ odoo.define('web.TranslationDialog', function (require) {
                     if (!translations[term.lang]) {
                        translations[term.lang] = {};
                     }
-                    translations[term.lang][term.initialValue] = term.value;
+                    const source = term.initialValue ? term.initialValue : term.source;
+                    translations[term.lang][source] = term.value;
                 });
             }
             else { // model translation
diff --git a/addons/web/static/src/views/fields/translation_dialog.js b/addons/web/static/src/views/fields/translation_dialog.js
index 23d5a3e3288..fde698b7141 100644
--- a/addons/web/static/src/views/fields/translation_dialog.js
+++ b/addons/web/static/src/views/fields/translation_dialog.js
@@ -79,7 +79,8 @@ export class TranslationDialog extends Component {
                     if (!translations[term.lang]) {
                         translations[term.lang] = {};
                     }
-                    translations[term.lang][term.value] = updatedTermValue;
+                    const source = term.value ? term.value : term.source;
+                    translations[term.lang][source] = updatedTermValue;
                 } else {
                     translations[term.lang] = updatedTermValue;
                 }
diff --git a/addons/web/static/tests/legacy/fields/basic_fields_tests.js b/addons/web/static/tests/legacy/fields/basic_fields_tests.js
index f670e72f84c..773355a2910 100644
--- a/addons/web/static/tests/legacy/fields/basic_fields_tests.js
+++ b/addons/web/static/tests/legacy/fields/basic_fields_tests.js
@@ -1749,7 +1749,7 @@ QUnit.module('Legacy basic_fields', {
     });
 
     QUnit.test('html field translatable', async function (assert) {
-        assert.expect(7);
+        assert.expect(8);
 
         this.data.partner.fields.foo.translate = true;
 
@@ -1777,7 +1777,7 @@ QUnit.module('Legacy basic_fields', {
                     return Promise.resolve([
                         [{lang: "en_US", source: "first paragraph", value: "first paragraph"},
                             {lang: "en_US", source: "second paragraph", value: "second paragraph"},
-                            {lang: "fr_BE", source: "first paragraph", value: "premier paragraphe"},
+                            {lang: "fr_BE", source: "first paragraph", value: ""},
                             {lang: "fr_BE", source: "second paragraph", value: "deuxième paragraphe"}],
                         {translation_type: "char", translation_show_source: true},
                     ]);
@@ -1788,7 +1788,10 @@ QUnit.module('Legacy basic_fields', {
                 if (route === "/web/dataset/call_kw/partner/update_field_translations") {
                     assert.deepEqual(args.args, [[1], "foo", {
                         "en_US": {"first paragraph": "first paragraph modified"},
-                        "fr_BE": {"deuxième paragraphe": "deuxième paragraphe modifié"},
+                        "fr_BE": {
+                            "first paragraph": "premier paragraphe modifié",
+                            "deuxième paragraphe": "deuxième paragraphe modifié",
+                        },
                     }], "the new translation value should be written");
                     return Promise.resolve();
                 }
@@ -1810,17 +1813,24 @@ QUnit.module('Legacy basic_fields', {
         assert.containsN($('.modal .o_translation_dialog'), '.translation', 4,
             'four rows should be visible');
 
-        var $enField = $('.modal .o_translation_dialog .translation:first() input');
-        assert.strictEqual($enField.val(), 'first paragraph',
+        const $translations = $('.modal .o_translation_dialog .translation input');
+        const enField1 = $translations[0];
+        assert.strictEqual(enField1.value, 'first paragraph',
             'first part of english translation should be filled');
 
-        await testUtils.fields.editInput($enField, "first paragraph modified");
+        await testUtils.fields.editInput(enField1, "first paragraph modified");
 
-        const $frField = $('.modal .o_translation_dialog .translation:last() input');
-        assert.strictEqual($frField.val(), 'deuxième paragraphe',
+        const frField1 = $translations[2];
+        assert.strictEqual(frField1.value, '',
+            'first part of french translation should not be filled');
+
+        await testUtils.fields.editInput(frField1, "premier paragraphe modifié");
+
+        const frField2 = $translations[3];
+        assert.strictEqual(frField2.value, 'deuxième paragraphe',
             'second part of french translation should be filled');
 
-        await testUtils.fields.editInput($frField, "deuxième paragraphe modifié");
+        await testUtils.fields.editInput(frField2, "deuxième paragraphe modifié");
         await testUtils.dom.click($('.modal button.btn-primary'));  // save
         await testUtils.nextTick();
 
diff --git a/addons/web/static/tests/views/fields/html_field_tests.js b/addons/web/static/tests/views/fields/html_field_tests.js
index e07c083da66..6c757f3bf82 100644
--- a/addons/web/static/tests/views/fields/html_field_tests.js
+++ b/addons/web/static/tests/views/fields/html_field_tests.js
@@ -115,7 +115,7 @@ QUnit.module("Fields", ({ beforeEach }) => {
     });
 
     QUnit.test("field html translatable", async (assert) => {
-        assert.expect(9);
+        assert.expect(10);
 
         serverData.models.partner.fields.txt.translate = true;
         serviceRegistry.add("localization", makeFakeLocalizationService({ multiLang: true }), {
@@ -156,7 +156,7 @@ QUnit.module("Fields", ({ beforeEach }) => {
                             {
                                 lang: "fr_BE",
                                 source: "first paragraph",
-                                value: "premier paragraphe",
+                                value: "",
                             },
                             {
                                 lang: "fr_BE",
@@ -181,7 +181,10 @@ QUnit.module("Fields", ({ beforeEach }) => {
                             "txt",
                             {
                                 en_US: { "first paragraph": "first paragraph modified" },
-                                fr_BE: { "deuxième paragraphe": "deuxième paragraphe modifié" },
+                                fr_BE: {
+                                    "first paragraph": "premier paragraphe modifié",
+                                    "deuxième paragraphe": "deuxième paragraphe modifié",
+                                },
                             },
                         ],
                         "the new translation value should be written"
@@ -212,21 +215,29 @@ QUnit.module("Fields", ({ beforeEach }) => {
             ".modal .o_translation_dialog .translation input"
         );
 
-        const $enField1 = translations[0];
+        const enField1 = translations[0];
         assert.strictEqual(
-            $enField1.value,
+            enField1.value,
             "first paragraph",
             "first part of english translation should be filled"
         );
-        await editInput($enField1, null, "first paragraph modified");
+        await editInput(enField1, null, "first paragraph modified");
 
-        const $frField2 = translations[3];
+        const frField1 = translations[2];
         assert.strictEqual(
-            $frField2.value,
+            frField1.value,
+            "",
+            "first part of french translation should not be filled"
+        );
+        await editInput(frField1, null, "premier paragraphe modifié");
+
+        const frField2 = translations[3];
+        assert.strictEqual(
+            frField2.value,
             "deuxième paragraphe",
             "second part of french translation should be filled"
         );
-        await editInput($frField2, null, "deuxième paragraphe modifié");
+        await editInput(frField2, null, "deuxième paragraphe modifié");
 
         await click(target, ".modal button.btn-primary"); // save
     });