[FIX] website_slides: close fullscreen mode when opening web editor

The web editor does not work well with the e-learning fullscreen view.
It actually completely closes the fullscreen view and opens the edition on a
blank page.

To avoid this, we intercept the click on the 'edit' button and redirect to the
non-fullscreen view of this slide with the editor enabled, whose layout is more
suited to edit in-place anyway.

A small testing tour was added to ensure this behavior is kept.

Task-2507179

closes odoo/odoo#70606

X-original-commit: dcb6a3cea27f32d722d1a8dc87c34a846cf5ac23
Signed-off-by: Thibault Delavallee (tde) <tde@openerp.com>
Signed-off-by: awa-odoo <awa-odoo@users.noreply.github.com>

2 files changed, 61 insertions, 1 deletions

diff --git a/addons/website_slides/static/src/js/slides_course_fullscreen_player.js b/addons/website_slides/static/src/js/slides_course_fullscreen_player.js
index 41ae5c59615..d9aa707ce12 100644
--- a/addons/website_slides/static/src/js/slides_course_fullscreen_player.js
+++ b/addons/website_slides/static/src/js/slides_course_fullscreen_player.js
@@ -711,11 +711,32 @@ odoo.define('website_slides.fullscreen', function (require) {
         selector: '.o_wslides_fs_main',
         xmlDependencies: ['/website_slides/static/src/xml/website_slides_fullscreen.xml', '/website_slides/static/src/xml/website_slides_share.xml'],
         start: function (){
+            var self = this;
             var proms = [this._super.apply(this, arguments)];
             var fullscreen = new Fullscreen(this, this._getSlides(), this._getCurrentSlideID(), this._extractChannelData());
             proms.push(fullscreen.attachTo(".o_wslides_fs_main"));
-            return Promise.all(proms);
+            return Promise.all(proms).then(function () {
+                $('#edit-page-menu a[data-action="edit"]').on('click', self._onWebEditorClick.bind(self));
+            });
+        },
+
+        /**
+         * The web editor does not work well with the e-learning fullscreen view.
+         * It actually completely closes the fullscreen view and opens the edition on a blank page.
+         *
+         * To avoid this, we intercept the click on the 'edit' button and redirect to the
+         * non-fullscreen view of this slide with the editor enabled, which is more suited to edit
+         * in-place anyway.
+         *
+         * @param {MouseEvent} e
+         */
+        _onWebEditorClick: function (e) {
+            e.preventDefault();
+            e.stopPropagation();
+
+            window.location = `${window.location.pathname}?fullscreen=0&enable_editor=1`;
         },
+
         _extractChannelData: function (){
             return this.$el.data();
         },
diff --git a/addons/website_slides/static/src/tests/tours/slides_full_screen_web_editor.js b/addons/website_slides/static/src/tests/tours/slides_full_screen_web_editor.js
new file mode 100644
index 00000000000..26aeafe0bfa
--- /dev/null
+++ b/addons/website_slides/static/src/tests/tours/slides_full_screen_web_editor.js
@@ -0,0 +1,39 @@
+odoo.define('website_slides.tour.fullscreen.edition.publisher', function (require) {
+'use strict';
+
+var tour = require('web_tour.tour');
+
+/**
+ * Global use case:
+ * - a user (website publisher) lands on the fullscreen view of a course ;
+ * - he clicks on the website editor "Edit" button ;
+ * - he is redirected to the non-fullscreen view with the editor opened.
+ *
+ * This tour tests a fix made when editing a course in fullscreen view.
+ * See "Fullscreen#_onWebEditorClick" for more information.
+ *
+ */
+tour.register('full_screen_web_editor', {
+    url: '/slides',
+    test: true
+}, [{
+    // open to the course
+    trigger: 'a:contains("Basics of Gardening")'
+}, {
+    // click on a slide to open the fullscreen view
+    trigger: 'a.o_wslides_js_slides_list_slide_link:contains("Home Gardening")'
+}, {
+    trigger: '.o_wslides_fs_main',
+    run: function () {} // check we land on the fullscreen view
+}, {
+    // click on the main "Edit" button to open the web editor
+    trigger: '#edit-page-menu a[data-action="edit"]',
+}, {
+    trigger: '.o_wslides_lesson_main',
+    run: function () {} // check we are redirected on the detailed view
+}, {
+    trigger: 'body.editor_enable',
+    run: function () {} // check the editor is automatically opened on the detailed view
+}]);
+
+});