diff --git a/addons/web_editor/static/src/js/editor/snippets.options.js b/addons/web_editor/static/src/js/editor/snippets.options.js index 202f6385546..8df28c0ee0f 100644 --- a/addons/web_editor/static/src/js/editor/snippets.options.js +++ b/addons/web_editor/static/src/js/editor/snippets.options.js @@ -6821,12 +6821,29 @@ registry.BackgroundImage = SnippetOptionWidget.extend({ */ setTarget: function () { // When we change the target of this option we need to transfer the - // background-image from the old target to the new one. + // background-image and the dataset information relative to this image + // from the old target to the new one. const oldBgURL = getBgImageURL(this.$target); + const isModifiedImage = this.$target[0].classList.contains("o_modified_image_to_save"); + const filteredOldDataset = Object.entries(this.$target[0].dataset).filter(([key]) => { + return isBackgroundImageAttribute(key); + }); + // Delete the dataset information relative to the background-image of + // the old target. + filteredOldDataset.forEach(([key]) => { + delete this.$target[0].dataset[key]; + }); + // It is important to delete ".o_modified_image_to_save" from the old + // target as its image source will be deleted. + this.$target[0].classList.remove("o_modified_image_to_save"); this._setBackground(''); this._super(...arguments); if (oldBgURL) { this._setBackground(oldBgURL); + filteredOldDataset.forEach(([key, value]) => { + this.$target[0].dataset[key] = value; + }); + this.$target[0].classList.toggle("o_modified_image_to_save", isModifiedImage); } // TODO should be automatic for all options as equal to the start method diff --git a/addons/website/static/tests/tours/parallax.js b/addons/website/static/tests/tours/parallax.js new file mode 100644 index 00000000000..b8a29453979 --- /dev/null +++ b/addons/website/static/tests/tours/parallax.js @@ -0,0 +1,50 @@ +/** @odoo-module **/ + +import wTourUtils from "website.tour_utils"; + +const coverSnippet = {id: "s_cover", name: "Cover"}; + +wTourUtils.registerWebsitePreviewTour("test_parallax", { + test: true, + url: "/", + edition: true, +}, [ + wTourUtils.dragNDrop(coverSnippet), + wTourUtils.clickOnSnippet(coverSnippet), + wTourUtils.changeOption("BackgroundOptimize", "we-toggler"), + wTourUtils.changeOption("BackgroundOptimize", 'we-button[data-gl-filter="blur"]'), +{ + content: "Check that the Cover snippet has the Blur filter on its background image", + trigger: "iframe .s_cover span[data-gl-filter='blur']", + isCheck: true, +}, + wTourUtils.changeOption("Parallax", "we-toggler"), + wTourUtils.changeOption("Parallax", 'we-button[data-select-data-attribute="0"]'), +{ + content: "Check that the data related to the filter have been transferred to the new target", + trigger: "iframe .s_cover[data-gl-filter='blur']", + isCheck: true, +}, +{ + content: "Check that the 'o_modified_image_to_save' class has been transferred to the new target", + trigger: "iframe .s_cover.o_modified_image_to_save", + isCheck: true, +}, + wTourUtils.changeOption("Parallax", "we-toggler"), + wTourUtils.changeOption("Parallax", 'we-button[data-select-data-attribute="1"]'), +{ + content: "Check that the 'o_modified_image_to_save' class has been deleted from the old target", + trigger: "iframe .s_cover:not(.o_modified_image_to_save)", + isCheck: true, +}, +{ + content: "Check that the 'o_modified_image_to_save' class has been transferred to the new target", + trigger: "iframe span.s_parallax_bg.o_modified_image_to_save", + isCheck: true, +}, +{ + content: "Check that the data related to the filter have been transferred to the new target", + trigger: "iframe span.s_parallax_bg[data-gl-filter='blur']", + isCheck: true, +}, +]); diff --git a/addons/website/tests/test_snippets.py b/addons/website/tests/test_snippets.py index 9cb3e985bdc..7a1504f95f4 100644 --- a/addons/website/tests/test_snippets.py +++ b/addons/website/tests/test_snippets.py @@ -71,3 +71,6 @@ class TestSnippets(HttpCase): 'url': base + '/web/image/website.s_banner_default_image.jpg', }) self.start_tour("/", "snippet_image_gallery_remove", login='admin') + + def test_10_parallax(self): + self.start_tour(self.env['website'].get_client_action_url('/'), 'test_parallax', login='admin')