From 8b522e5c4b7ef406446596b719be84692a712c44 Mon Sep 17 00:00:00 2001
From: xO-Tx <mou@odoo.com>
Date: Fri, 12 May 2023 14:11:51 +0000
Subject: [PATCH] [FIX] website: correctly mark translatable attributes
Steps to reproduce:
- Go to a website page > Add a 'Form' block > Set an input "Placeholder"
value.
- Go to the page (in 'edit_translations' mode) > The translation of the
input "Placeholder" attribute doesn't mark the input as translated and
even after saving the translation, the input is still marked as
"to_translate".
The goal of this commit is to fix this issue by extending the same
behaviour on the translated `<select/>` options (using `.oe_translated`
class) and setting the right translation state on the input from the
linked attribute translation `<span/>`.
task-3323245
closes odoo/odoo#121128
Signed-off-by: Benoit Socias (bso) <bso@odoo.com>
---
.../src/js/editor/wysiwyg_multizone_translate.js | 10 ++++++++--
addons/website/static/src/scss/website.wysiwyg.scss | 6 +++---
addons/website/static/tests/tours/rte.js | 4 ++++
3 files changed, 15 insertions(+), 5 deletions(-)
diff --git a/addons/website/static/src/js/editor/wysiwyg_multizone_translate.js b/addons/website/static/src/js/editor/wysiwyg_multizone_translate.js
index 02e506d4a476..01864bbbdca4 100644
--- a/addons/website/static/src/js/editor/wysiwyg_multizone_translate.js
+++ b/addons/website/static/src/js/editor/wysiwyg_multizone_translate.js
@@ -97,7 +97,7 @@ const SelectTranslateDialog = Dialog.extend({
this.optionEl.textContent = inputEl.value;
const translationUpdated = inputEl.value !== this.optionEl.dataset.initialTranslationValue;
this.translationObject.classList.toggle('o_dirty', translationUpdated);
- this.optionEl.classList.add('o_option_translated');
+ this.optionEl.classList.toggle('oe_translated', translationUpdated);
});
this.el.appendChild(inputEl);
return this._super(...arguments);
@@ -276,7 +276,12 @@ var WysiwygTranslate = WysiwygMultizone.extend({
$p.after($p.html()).remove();
});
var trans = this._getTranlationObject($node[0]);
- $node.toggleClass('o_dirty', trans.value !== $node.html().replace(/[ \t\n\r]+/, ' '));
+ const updated = trans.value !== $node.html().replace(/[ \t\n\r]+/, ' ');
+ $node.toggleClass('o_dirty', updated);
+ const $target = $node.data('$node');
+ if ($target) {
+ $target.toggleClass('oe_translated', updated);
+ }
},
/**
* Returns a translation object.
@@ -325,6 +330,7 @@ var WysiwygTranslate = WysiwygMultizone.extend({
_.each(translation, function (node, attr) {
var trans = self._getTranlationObject(node);
trans.value = (trans.value ? trans.value : $node.html() ).replace(/[ \t\n\r]+/, ' ');
+ trans.state = node.dataset.oeTranslationState;
$node.attr('data-oe-translation-state', (trans.state || 'to_translate'));
});
});
diff --git a/addons/website/static/src/scss/website.wysiwyg.scss b/addons/website/static/src/scss/website.wysiwyg.scss
index e6edd90358b3..5de8a9c20f08 100644
--- a/addons/website/static/src/scss/website.wysiwyg.scss
+++ b/addons/website/static/src/scss/website.wysiwyg.scss
@@ -81,17 +81,17 @@
}
html[lang] > body.editor_enable [data-oe-translation-state] {
- &, & .o_translation_select_option {
+ &, .o_translation_select_option {
background: rgba($o-we-content-to-translate-color, 0.5) !important;
}
&[data-oe-translation-state="translated"] {
- &, & .o_translation_select_option {
+ &, .o_translation_select_option {
background: rgba($o-we-translated-content-color, 0.5) !important;
}
}
- &.o_dirty, & .o_option_translated {
+ &.o_dirty, &.oe_translated, .oe_translated {
background: rgba($o-we-translated-content-color, 0.25) !important;
}
}
diff --git a/addons/website/static/tests/tours/rte.js b/addons/website/static/tests/tours/rte.js
index 88ba9f79edb3..1680ae3d530b 100644
--- a/addons/website/static/tests/tours/rte.js
+++ b/addons/website/static/tests/tours/rte.js
@@ -120,6 +120,10 @@ tour.register('rte_translator', {
content: "close modal",
trigger: '.modal-footer .btn-primary',
extra_trigger: '.modal input:propValue(test Parseltongue placeholder)',
+}, {
+ content: "check: input marked as translated",
+ trigger: '#wrap input[placeholder="test Parseltongue placeholder"].oe_translated',
+ run: () => {},
}, {
content: "save translation",
trigger: 'button[data-action=save]',
--
GitLab