[IMP] web_tour, *: allow to properly extend tours

* crm, project, website, website_event, website_blog, website_forum,
website_sale

Eg: the tour 'shop_buy_product' is extended by the website_sale_options
addons to add a step to close a modal.

The current solution was requiring the module that defines the tour
to extend, then add/remove steps in the "step" key of the tour
definition.
Some of the problems with this method were:
* The "register" method calls the "update" method to immediately
search for tip to place once registered (as register may be called
after the DOM is ready). So extensions of tours were happening after
the tours were started (and the tours were not restarted).
* The addition/removal of steps was happening after they were filtered
according to the "edition" key.

To allow extension, the system is changed as follow:
* The "register" method now only saves the steps and options without
modifying them and does not call the "update" method.
* Once the DOM was ready, the tour service started listening to DOM
mutations and called the "update" tour method. Now, this "update" call
is replaced by a "_register_all" call, on DOM ready and at the end of
the current call stack (which makes sure all modules are loaded). This
"_register_all" method marks the registered tours as ready after having
filtered the steps according to the "edition" key and initialized the
current step to trigger.
* Also, tours can now define a "wait_for" option which allow them to
be marked as ready for run and update after the given deferred. Those
tours can now also be extended without having to wait for the deferred.
PhamtomJS must wait for the "ready" key to be true to run the tour.

15 files changed, 320 insertions, 305 deletions

diff --git a/addons/crm/tests/test_crm_ui.py b/addons/crm/tests/test_crm_ui.py
index 12291c65fe1..7df4c97b4f7 100644
--- a/addons/crm/tests/test_crm_ui.py
+++ b/addons/crm/tests/test_crm_ui.py
@@ -8,4 +8,4 @@ import odoo.tests
 class TestUi(odoo.tests.HttpCase):
 
     def test_01_crm_tour(self):
-        self.phantom_js("/web", "odoo.__DEBUG__.services['web_tour.tour'].run('crm_tour')", "odoo.__DEBUG__.services['web_tour.tour'].tours.crm_tour", login="admin")
+        self.phantom_js("/web", "odoo.__DEBUG__.services['web_tour.tour'].run('crm_tour')", "odoo.__DEBUG__.services['web_tour.tour'].tours.crm_tour.ready", login="admin")
diff --git a/addons/point_of_sale/tests/test_point_of_sale_ui.py b/addons/point_of_sale/tests/test_point_of_sale_ui.py
index 3be0d3095e6..afd9c16e240 100644
--- a/addons/point_of_sale/tests/test_point_of_sale_ui.py
+++ b/addons/point_of_sale/tests/test_point_of_sale_ui.py
@@ -8,4 +8,4 @@ import odoo.tests
 class TestUi(odoo.tests.HttpCase):
 
     def test_01_point_of_sale_tour(self):
-        self.phantom_js("/web", "odoo.__DEBUG__.services['web_tour.tour'].run('point_of_sale_tour')", "odoo.__DEBUG__.services['web_tour.tour'].tours.point_of_sale_tour", login="admin")
+        self.phantom_js("/web", "odoo.__DEBUG__.services['web_tour.tour'].run('point_of_sale_tour')", "odoo.__DEBUG__.services['web_tour.tour'].tours.point_of_sale_tour.ready", login="admin")
diff --git a/addons/project/tests/test_project_ui.py b/addons/project/tests/test_project_ui.py
index 4246f0ebb10..7648fdbeb1b 100644
--- a/addons/project/tests/test_project_ui.py
+++ b/addons/project/tests/test_project_ui.py
@@ -8,4 +8,4 @@ import odoo.tests
 class TestUi(odoo.tests.HttpCase):
 
     def test_01_project_tour(self):
-        self.phantom_js("/web", "odoo.__DEBUG__.services['web_tour.tour'].run('project_tour')", "odoo.__DEBUG__.services['web_tour.tour'].tours.project_tour", login="admin")
+        self.phantom_js("/web", "odoo.__DEBUG__.services['web_tour.tour'].run('project_tour')", "odoo.__DEBUG__.services['web_tour.tour'].tours.project_tour.ready", login="admin")
diff --git a/addons/web_tour/static/src/js/tour_manager.js b/addons/web_tour/static/src/js/tour_manager.js
index 73c988ab1b1..0126a7f12c1 100644
--- a/addons/web_tour/static/src/js/tour_manager.js
+++ b/addons/web_tour/static/src/js/tour_manager.js
@@ -149,7 +149,6 @@ return core.Class.extend({
      * @param [Array] dict of steps, each step being a dict containing a tip description
      */
     register: function() {
-        var self = this;
         var args = Array.prototype.slice.call(arguments);
         var last_arg = args[args.length - 1];
         var name = args[0];
@@ -161,12 +160,10 @@ return core.Class.extend({
         var steps = last_arg instanceof Array ? last_arg : [last_arg];
         var tour = {
             name: name,
-            current_step: parseInt(local_storage.getItem(get_step_key(name))) || 0,
-            steps: _.filter(steps, function (step) {
-                return !step.edition || step.edition === self.edition;
-            }),
+            steps: steps,
             url: options.url,
             test: options.test,
+            wait_for: options.wait_for || $.when(),
         };
         if (options.skip_enabled) {
             tour.skip_link = '<p><span class="o_skip_tour">' + _t('Skip tour') + '</span></p>';
@@ -176,13 +173,29 @@ return core.Class.extend({
             };
         }
         this.tours[name] = tour;
-        if (this.running_tour === name || (!tour.test && !_.contains(this.consumed_tours, name))) {
-            this._to_next_step(name, 0);
-        }
+    },
+    _register_all: function (do_update) {
+        if (this._all_registered) return;
+        this._all_registered = true;
 
-        if (!this.running_tour || this.running_tour === name) {
-            this.update(name);
-        }
+        _.each(this.tours, this._register.bind(this, do_update));
+    },
+    _register: function (do_update, tour, name) {
+        if (tour.ready) return $.when();
+
+        return tour.wait_for.then((function () {
+            tour.current_step = parseInt(local_storage.getItem(get_step_key(name))) || 0;
+            tour.steps = _.filter(tour.steps, (function (step) {
+                return !step.edition || step.edition === this.edition;
+            }).bind(this));
+
+            tour.ready = true;
+
+            if (do_update && (this.running_tour === name || (!this.running_tour && !tour.test && !_.contains(this.consumed_tours, name)))) {
+                this._to_next_step(name, 0);
+                this.update(name);
+            }
+        }).bind(this));
     },
     run: function (tour_name, step_delay) {
         if (this.running_tour) {
@@ -204,8 +217,8 @@ return core.Class.extend({
         this._deactivate_tip(this.active_tooltips[tour_name]);
 
         tour.current_step = 0;
+        this._to_next_step(tour_name, 0);
         local_storage.setItem(get_step_key(tour_name), tour.current_step);
-        this.active_tooltips[tour_name] = tour.steps[tour.current_step];
 
         if (tour.url) {
             this.pause();
@@ -232,16 +245,16 @@ return core.Class.extend({
     update: function (tour_name) {
         if (this.paused) return;
 
-        if (this.running_tour) {
-            if (this.tours[this.running_tour] === undefined) return;
-            if (this.running_tour_timeout === undefined) {
-                this._set_running_tour_timeout(this.running_tour, this.active_tooltips[this.running_tour]);
-            }
-        }
-
         this.$modal_displayed = $('.modal:visible').last();
+
         tour_name = this.running_tour || tour_name;
         if (tour_name) {
+            var tour = this.tours[tour_name];
+            if (!tour || !tour.ready) return;
+
+            if (this.running_tour && this.running_tour_timeout === undefined) {
+                this._set_running_tour_timeout(this.running_tour, this.active_tooltips[this.running_tour]);
+            }
             this._check_for_tooltip(this.active_tooltips[tour_name], tour_name);
         } else {
             _.each(this.active_tooltips, this._check_for_tooltip.bind(this));
diff --git a/addons/web_tour/static/src/js/tour_service.js b/addons/web_tour/static/src/js/tour_service.js
index 14755066c4c..261b4c13fe9 100644
--- a/addons/web_tour/static/src/js/tour_service.js
+++ b/addons/web_tour/static/src/js/tour_service.js
@@ -51,27 +51,34 @@ return session.is_bound.then(function () {
             }
         }, 500);
         var observer = new MutationObserver(check_tooltip);
-        var observe = function () {
+        var start_service = function (observe) {
             $(function () {
-                observer.observe(document.body, {
-                    attributes: true,
-                    childList: true,
-                    subtree: true,
+                /**
+                 * Once the DOM is ready, we still have to wait all the modules are loaded before completing the tours
+                 * registration and starting listening for DOM mutations.
+                 */
+                _.defer(function () {
+                    tour._register_all(observe);
+                    if (observe) {
+                        observer.observe(document.body, {
+                            attributes: true,
+                            childList: true,
+                            subtree: true,
+                        });
+                    }
                 });
-                tour.update();
             });
         };
 
         // Enable the MutationObserver for the admin or if a tour is running, when the DOM is ready
-        if (session.is_superuser || tour.running_tour) {
-            observe();
-        }
+        start_service(session.is_superuser || tour.running_tour);
+
         // Override the TourManager so that it enables/disables the observer when necessary
         if (!session.is_superuser) {
             var run = tour.run;
             tour.run = function () {
                 run.apply(this, arguments);
-                if (this.running_tour) { observe(); }
+                if (this.running_tour) { start_service(true); }
             };
             var _consume_tour = tour._consume_tour;
             tour._consume_tour = function () {
diff --git a/addons/website/static/src/js/website.tour.banner.js b/addons/website/static/src/js/website.tour.banner.js
index 8c3dfe6aa09..cc7bcf56867 100644
--- a/addons/website/static/src/js/website.tour.banner.js
+++ b/addons/website/static/src/js/website.tour.banner.js
@@ -7,51 +7,50 @@ odoo.define("website.tour.banner", function (require) {
 
     var _t = core._t;
 
-    base.ready().done(function () {
-        tour.register("banner", {
-            url: "/",
-        }, [{
-            trigger: "a[data-action=edit]",
-            content: _t("<b>Click Edit</b> to start designing your homepage."),
-            position: "bottom",
-        }, {
-            trigger: "#snippet_structure .oe_snippet:eq(1) .oe_snippet_thumbnail",
-            content: _t("Drag the <i>Cover</i> block and drop it in your page."),
-            position: "bottom",
-            run: "drag_and_drop",
-        }, {
-            trigger: "#wrapwrap .s_text_block_image_fw h2",
-            content: _t("<b>Click on a text</b> to start editing it. <i>It's that easy to edit your content!</i>"),
-            position: "left",
-            width: 150,
-            run: "text",
-        }, {
-            trigger: ".oe_overlay_options .oe_options",
-            extra_trigger: "#wrapwrap .s_text_block_image_fw h2:not(:containsExact(\"Headline\"))",
-            content: _t("Customize any block through this menu. Try to change the background of the banner."),
-            position: "bottom",
-        }, {
-            trigger: "#snippet_structure .oe_snippet:eq(3) .oe_snippet_thumbnail",
-            content: _t("Drag another block in your page, below the cover."),
-            position: "bottom",
-            run: "drag_and_drop",
-        }, {
-            trigger: "button[data-action=save]",
-            extra_trigger: ".oe_overlay_options .oe_options",
-            content: _t("Publish your page by clicking on the <b>Save</b> button."),
-            position: "bottom",
-        }, {
-            trigger: "a[data-action=show-mobile-preview]",
-            content: _t("Good Job! You created your first page. Let's check how this page looks like on <b>mobile devices</b>."),
-            position: "bottom",
-        }, {
-            trigger: ".modal-dialog:has(#mobile-viewport) button[data-dismiss=modal]",
-            content: _t("After having checked how it looks on mobile, <b>close the preview</b>."),
-            position: "right",
-        }, {
-            trigger: "#oe_main_menu_navbar a[data-action=new_page]",
-            content: _t("<p><b>That's it.</b> Your homepage is live.</p><p>Continue adding more pages to your site or edit this page to make it even more awesome.</p>"),
-            position: "bottom",
-        }]);
-    });
+    tour.register("banner", {
+        url: "/",
+        wait_for: base.ready(),
+    }, [{
+        trigger: "a[data-action=edit]",
+        content: _t("<b>Click Edit</b> to start designing your homepage."),
+        position: "bottom",
+    }, {
+        trigger: "#snippet_structure .oe_snippet:eq(1) .oe_snippet_thumbnail",
+        content: _t("Drag the <i>Cover</i> block and drop it in your page."),
+        position: "bottom",
+        run: "drag_and_drop",
+    }, {
+        trigger: "#wrapwrap .s_text_block_image_fw h2",
+        content: _t("<b>Click on a text</b> to start editing it. <i>It's that easy to edit your content!</i>"),
+        position: "left",
+        width: 150,
+        run: "text",
+    }, {
+        trigger: ".oe_overlay_options .oe_options",
+        extra_trigger: "#wrapwrap .s_text_block_image_fw h2:not(:containsExact(\"Headline\"))",
+        content: _t("Customize any block through this menu. Try to change the background of the banner."),
+        position: "bottom",
+    }, {
+        trigger: "#snippet_structure .oe_snippet:eq(3) .oe_snippet_thumbnail",
+        content: _t("Drag another block in your page, below the cover."),
+        position: "bottom",
+        run: "drag_and_drop",
+    }, {
+        trigger: "button[data-action=save]",
+        extra_trigger: ".oe_overlay_options .oe_options",
+        content: _t("Publish your page by clicking on the <b>Save</b> button."),
+        position: "bottom",
+    }, {
+        trigger: "a[data-action=show-mobile-preview]",
+        content: _t("Good Job! You created your first page. Let's check how this page looks like on <b>mobile devices</b>."),
+        position: "bottom",
+    }, {
+        trigger: ".modal-dialog:has(#mobile-viewport) button[data-dismiss=modal]",
+        content: _t("After having checked how it looks on mobile, <b>close the preview</b>."),
+        position: "right",
+    }, {
+        trigger: "#oe_main_menu_navbar a[data-action=new_page]",
+        content: _t("<p><b>That's it.</b> Your homepage is live.</p><p>Continue adding more pages to your site or edit this page to make it even more awesome.</p>"),
+        position: "bottom",
+    }]);
 });
diff --git a/addons/website/tests/test_ui.py b/addons/website/tests/test_ui.py
index cb5ab3cf7f8..a249b7c14a7 100644
--- a/addons/website/tests/test_ui.py
+++ b/addons/website/tests/test_ui.py
@@ -14,7 +14,7 @@ class TestUi(odoo.tests.HttpCase):
         self.phantom_js("/", "console.log('ok')", "'website.snippets.editor' in odoo.__DEBUG__.services", login='admin')
 
     def test_03_admin_tour_banner(self):
-        self.phantom_js("/", "odoo.__DEBUG__.services['web_tour.tour'].run('banner')", "odoo.__DEBUG__.services['web_tour.tour'].tours.banner", login='admin')
+        self.phantom_js("/", "odoo.__DEBUG__.services['web_tour.tour'].run('banner')", "odoo.__DEBUG__.services['web_tour.tour'].tours.banner.ready", login='admin')
 
     def test_03_admin_tour_rte_translator(self):
         self.phantom_js("/", "odoo.__DEBUG__.services['web.Tour'].run('rte_translator', 'test')", "odoo.__DEBUG__.services['web.Tour'].tours.rte_translator", login='admin')
diff --git a/addons/website_blog/static/src/js/website.tour.blog.js b/addons/website_blog/static/src/js/website.tour.blog.js
index 39c2a76ad83..f8c16df1eeb 100644
--- a/addons/website_blog/static/src/js/website.tour.blog.js
+++ b/addons/website_blog/static/src/js/website.tour.blog.js
@@ -7,72 +7,71 @@ odoo.define("website_blog.tour", function (require) {
 
     var _t = core._t;
 
-    base.ready().done(function () {
-        tour.register("blog", {
-            url: "/",
-        }, [tour.STEPS.WEBSITE_NEW_PAGE, {
-            trigger: "a[data-action=new_blog_post]",
-            content: _t("Select this menu item to create a new blog post."),
-            position: "bottom",
-        }, {
-            trigger: "h1[data-oe-expression=\"blog_post.name\"]",
-            extra_trigger: "body.editor_has_snippets",
-            content: _t("Write a title, the subtitle is optional."),
-            position: "top",
-            run: "text",
-        }, {
-            trigger: "#oe_manipulators .oe_overlay.oe_active a.btn.btn-primary.btn-sm",
-            extra_trigger: "#wrap h1[data-oe-expression=\"blog_post.name\"]:not(:containsExact(\"\"))",
-            content: _t("Set a blog post <b>cover</b>."),
-            position: "bottom",
-        }, {
-            trigger: "a:containsExact(" + _t("Change Cover")+ "):eq(1)",
-            content: _t("Clich here to change your post cover."),
-            position: "right",
-        }, {
-            trigger: ".o_select_media_dialog .o_existing_attachment_cell:nth(1) img",
-            extra_trigger: ".modal:has(.o_existing_attachment_cell:nth(1))",
-            content: _t("Choose an image from the library."),
-            position: "top",
-        }, {
-            trigger: ".o_select_media_dialog .btn.o_save_button",
-            extra_trigger: ".o_existing_attachment_cell.o_selected",
-            content: _t("Click on <b>Save</b> to set the picture as cover."),
-            position: "top",
-        }, {
-            trigger: ".blog_content section.mt16",
-            content: _t("<b>Write your story here.</b> Use the top toolbar to style your text: add an image or table, set bold or italic, etc. Drag and drop building blocks for more graphical blogs."),
-            position: "top",
-            run: function (actions) {
-                actions.auto();
-                actions.text("Blog content", this.$anchor.find("p"));
-            },
-        }, {
-            trigger: "button[data-action=save]",
-            extra_trigger: "#blog_content section:first p:first:not(:containsExact(" + _t("Start writing here...") + "))",
-            content: _t("<b>Click on Save</b> to record yoru changes."),
-            position: "bottom",
-        }, {
-            trigger: "a[data-action=show-mobile-preview]",
-            extra_trigger: "body:not(.editor_enable)",
-            content: _t("Use this icon to preview your blog post on <b>mobile devices</b>."),
-            position: "bottom",
-        }, {
-            trigger: "button[data-dismiss=modal]",
-            extra_trigger: ".modal:has(#mobile-viewport)",
-            content: _t("Once you have reviewed the content on mobile, close the preview."),
-            position: "right",
-        }, {
-            trigger: "button.btn-danger.js_publish_btn",
-            extra_trigger: "body:not(.editor_enable)",
-            position: "bottom",
-            content: _t("<b>Publish your blog post</b> to make it visible to your visitors."),
-        }, {
-            trigger: "#customize-menu-button",
-            extra_trigger: "body:not(.editor_enable) .js_publish_management button.js_publish_btn.btn-success:visible",
-            content: _t("<b>That's it, your blog post is published!</b> Discover more features through the <i>Customize</i> menu."),
-            position: "bottom",
-            width: 500,
-        }]);
-    });
+    tour.register("blog", {
+        url: "/",
+        wait_for: base.ready(),
+    }, [tour.STEPS.WEBSITE_NEW_PAGE, {
+        trigger: "a[data-action=new_blog_post]",
+        content: _t("Select this menu item to create a new blog post."),
+        position: "bottom",
+    }, {
+        trigger: "h1[data-oe-expression=\"blog_post.name\"]",
+        extra_trigger: "body.editor_has_snippets",
+        content: _t("Write a title, the subtitle is optional."),
+        position: "top",
+        run: "text",
+    }, {
+        trigger: "#oe_manipulators .oe_overlay.oe_active a.btn.btn-primary.btn-sm",
+        extra_trigger: "#wrap h1[data-oe-expression=\"blog_post.name\"]:not(:containsExact(\"\"))",
+        content: _t("Set a blog post <b>cover</b>."),
+        position: "bottom",
+    }, {
+        trigger: "a:containsExact(" + _t("Change Cover")+ "):eq(1)",
+        content: _t("Clich here to change your post cover."),
+        position: "right",
+    }, {
+        trigger: ".o_select_media_dialog .o_existing_attachment_cell:nth(1) img",
+        extra_trigger: ".modal:has(.o_existing_attachment_cell:nth(1))",
+        content: _t("Choose an image from the library."),
+        position: "top",
+    }, {
+        trigger: ".o_select_media_dialog .btn.o_save_button",
+        extra_trigger: ".o_existing_attachment_cell.o_selected",
+        content: _t("Click on <b>Save</b> to set the picture as cover."),
+        position: "top",
+    }, {
+        trigger: ".blog_content section.mt16",
+        content: _t("<b>Write your story here.</b> Use the top toolbar to style your text: add an image or table, set bold or italic, etc. Drag and drop building blocks for more graphical blogs."),
+        position: "top",
+        run: function (actions) {
+            actions.auto();
+            actions.text("Blog content", this.$anchor.find("p"));
+        },
+    }, {
+        trigger: "button[data-action=save]",
+        extra_trigger: "#blog_content section:first p:first:not(:containsExact(" + _t("Start writing here...") + "))",
+        content: _t("<b>Click on Save</b> to record yoru changes."),
+        position: "bottom",
+    }, {
+        trigger: "a[data-action=show-mobile-preview]",
+        extra_trigger: "body:not(.editor_enable)",
+        content: _t("Use this icon to preview your blog post on <b>mobile devices</b>."),
+        position: "bottom",
+    }, {
+        trigger: "button[data-dismiss=modal]",
+        extra_trigger: ".modal:has(#mobile-viewport)",
+        content: _t("Once you have reviewed the content on mobile, close the preview."),
+        position: "right",
+    }, {
+        trigger: "button.btn-danger.js_publish_btn",
+        extra_trigger: "body:not(.editor_enable)",
+        position: "bottom",
+        content: _t("<b>Publish your blog post</b> to make it visible to your visitors."),
+    }, {
+        trigger: "#customize-menu-button",
+        extra_trigger: "body:not(.editor_enable) .js_publish_management button.js_publish_btn.btn-success:visible",
+        content: _t("<b>That's it, your blog post is published!</b> Discover more features through the <i>Customize</i> menu."),
+        position: "bottom",
+        width: 500,
+    }]);
 });
diff --git a/addons/website_blog/tests/test_ui.py b/addons/website_blog/tests/test_ui.py
index ef6ea770f94..152b4b980c1 100644
--- a/addons/website_blog/tests/test_ui.py
+++ b/addons/website_blog/tests/test_ui.py
@@ -7,4 +7,4 @@ import odoo.tests
 @odoo.tests.common.post_install(True)
 class TestUi(odoo.tests.HttpCase):
     def test_admin(self):
-        self.phantom_js("/", "odoo.__DEBUG__.services['web_tour.tour'].run('blog')", "odoo.__DEBUG__.services['web_tour.tour'].tours.blog", login='admin')
+        self.phantom_js("/", "odoo.__DEBUG__.services['web_tour.tour'].run('blog')", "odoo.__DEBUG__.services['web_tour.tour'].tours.blog.ready", login='admin')
diff --git a/addons/website_event/static/src/js/website.tour.event.js b/addons/website_event/static/src/js/website.tour.event.js
index d9144df2d2f..215c9a5253c 100644
--- a/addons/website_event/static/src/js/website.tour.event.js
+++ b/addons/website_event/static/src/js/website.tour.event.js
@@ -7,41 +7,40 @@ odoo.define("website_event.tour", function (require) {
 
     var _t = core._t;
 
-    base.ready().done(function () {
-        tour.register("event", {
-            url: "/",
-        }, [tour.STEPS.WEBSITE_NEW_PAGE, {
-            trigger: "a[data-action=new_event]",
-            content: _t("Click here to create a new event."),
-            position: "bottom",
-        }, {
-            trigger: ".modal-dialog #editor_new_event input[type=text]",
-            content: _t("Create a name for your new event and click <em>\"Continue\"</em>. e.g: Technical Training"),
-            position: "right",
-        }, {
-            trigger: ".modal-dialog button.btn-primary.btn-continue",
-            extra_trigger: ".modal-dialog #editor_new_event input[type=text][value!=\"\"]",
-            content: _t("Click <em>Continue</em> to create the event."),
-            position: "right",
-        }, {
-            trigger: "#snippet_structure .oe_snippet:eq(2) .oe_snippet_thumbnail",
-            content: _t("Drag this block and drop it in your page."),
-            position: "bottom",
-            run: "drag_and_drop",
-        }, {
-            trigger: "button[data-action=save]",
-            content: _t("Once you click on save, your event is updated."),
-            position: "bottom",
-        }, {
-            trigger: "button.btn-danger.js_publish_btn",
-            extra_trigger: "body:not(.editor_enable)",
-            content: _t("Click to publish your event."),
-            position: "top",
-        }, {
-            trigger: ".js_publish_management button[data-toggle=\"dropdown\"]",
-            extra_trigger: ".js_publish_management button.js_publish_btn.btn-success:visible",
-            content: _t("Click here to customize your event further."),
-            position: "left",
-        }]);
-    });
+    tour.register("event", {
+        url: "/",
+        wait_for: base.ready(),
+    }, [tour.STEPS.WEBSITE_NEW_PAGE, {
+        trigger: "a[data-action=new_event]",
+        content: _t("Click here to create a new event."),
+        position: "bottom",
+    }, {
+        trigger: ".modal-dialog #editor_new_event input[type=text]",
+        content: _t("Create a name for your new event and click <em>\"Continue\"</em>. e.g: Technical Training"),
+        position: "right",
+    }, {
+        trigger: ".modal-dialog button.btn-primary.btn-continue",
+        extra_trigger: ".modal-dialog #editor_new_event input[type=text][value!=\"\"]",
+        content: _t("Click <em>Continue</em> to create the event."),
+        position: "right",
+    }, {
+        trigger: "#snippet_structure .oe_snippet:eq(2) .oe_snippet_thumbnail",
+        content: _t("Drag this block and drop it in your page."),
+        position: "bottom",
+        run: "drag_and_drop",
+    }, {
+        trigger: "button[data-action=save]",
+        content: _t("Once you click on save, your event is updated."),
+        position: "bottom",
+    }, {
+        trigger: "button.btn-danger.js_publish_btn",
+        extra_trigger: "body:not(.editor_enable)",
+        content: _t("Click to publish your event."),
+        position: "top",
+    }, {
+        trigger: ".js_publish_management button[data-toggle=\"dropdown\"]",
+        extra_trigger: ".js_publish_management button.js_publish_btn.btn-success:visible",
+        content: _t("Click here to customize your event further."),
+        position: "left",
+    }]);
 });
diff --git a/addons/website_event/tests/test_ui.py b/addons/website_event/tests/test_ui.py
index a8de31fbfbb..ad78445d184 100644
--- a/addons/website_event/tests/test_ui.py
+++ b/addons/website_event/tests/test_ui.py
@@ -5,4 +5,4 @@ import odoo.tests
 @odoo.tests.common.post_install(True)
 class TestUi(odoo.tests.HttpCase):
     def test_admin(self):
-        self.phantom_js("/", "odoo.__DEBUG__.services['web_tour.tour'].run('event')", "odoo.__DEBUG__.services['web_tour.tour'].tours.event", login='admin')
+        self.phantom_js("/", "odoo.__DEBUG__.services['web_tour.tour'].run('event')", "odoo.__DEBUG__.services['web_tour.tour'].tours.event.ready", login='admin')
diff --git a/addons/website_forum/static/src/js/website_tour_forum.js b/addons/website_forum/static/src/js/website_tour_forum.js
index 508ca40b4c4..ba1c9906bc4 100644
--- a/addons/website_forum/static/src/js/website_tour_forum.js
+++ b/addons/website_forum/static/src/js/website_tour_forum.js
@@ -7,69 +7,68 @@ odoo.define("website_forum.tour_forum", function (require) {
 
     var _t = core._t;
 
-    base.ready().done(function () {
-        tour.register("question", {
-            url: "/",
-        }, [tour.STEPS.WEBSITE_NEW_PAGE, {
-            trigger: "a[data-action=new_forum]",
-            content: _t("Select this menu item to create a new forum."),
-            position: "bottom",
-        }, {
-            trigger: "#editor_new_forum input[type=text]",
-            content: _t("Enter a name for your new forum."),
-            position: "right",
-        }, {
-            trigger: "button.btn-primary",
-            extra_trigger: ".modal #editor_new_forum input[type=text]:not(:propValue(\"\"))",
-            content: _t("Click <em>Continue</em> to create the forum."),
-            position: "right",
-        }, {
-            trigger: ".btn-block a:first",
-            position: "left",
-            content: _t("Ask the question in this forum by clicking on the button."),
-        }, {
-            trigger: "input[name=post_name]",
-            position: "top",
-            content: _t("Give your question title."),
-        }, {
-            trigger: ".note-editable p",
-            extra_trigger: "input[name=post_name]:not(:propValue(\"\"))",
-            content: _t("Put your question here."),
-            position: "bottom",
-            run: "text",
-        }, {
-            trigger: ".select2-choices",
-            extra_trigger: ".note-editable p:not(:containsExact(\"<br>\"))",
-            content: _t("Insert tags related to your question."),
-            position: "top",
-            run: function (actions) {
-                actions.auto("input[id=s2id_autogen2]");
-            },
-        }, {
-            trigger: "button:contains(\"Post Your Question\")",
-            extra_trigger: "input[id=s2id_autogen2]:not(:propValue(\"Tags\"))",
-            content: _t("Click to post your question."),
-            position: "bottom",
-        }, {
-            trigger: ".modal-header button.close",
-            auto: true,
-        }, {
-            trigger: ".note-editable p",
-            content: _t("Put your answer here."),
-            position: "bottom",
-            run: "text",
-        }, {
-            trigger: "button:contains(\"Post Answer\")",
-            extra_trigger: ".note-editable p:not(:containsExact(\"<br>\"))",
-            content: _t("Click to post your answer."),
-            position: "bottom",
-        }, {
-            trigger: ".modal-header button.close",
-            auto: true,
-        }, {
-            trigger: "a[data-karma=\"20\"]:first",
-            content: _t("Click here to accept this answer."),
-            position: "right",
-        }]);
-    });
+    tour.register("question", {
+        url: "/",
+        wait_for: base.ready(),
+    }, [tour.STEPS.WEBSITE_NEW_PAGE, {
+        trigger: "a[data-action=new_forum]",
+        content: _t("Select this menu item to create a new forum."),
+        position: "bottom",
+    }, {
+        trigger: "#editor_new_forum input[type=text]",
+        content: _t("Enter a name for your new forum."),
+        position: "right",
+    }, {
+        trigger: "button.btn-primary",
+        extra_trigger: ".modal #editor_new_forum input[type=text]:not(:propValue(\"\"))",
+        content: _t("Click <em>Continue</em> to create the forum."),
+        position: "right",
+    }, {
+        trigger: ".btn-block a:first",
+        position: "left",
+        content: _t("Ask the question in this forum by clicking on the button."),
+    }, {
+        trigger: "input[name=post_name]",
+        position: "top",
+        content: _t("Give your question title."),
+    }, {
+        trigger: ".note-editable p",
+        extra_trigger: "input[name=post_name]:not(:propValue(\"\"))",
+        content: _t("Put your question here."),
+        position: "bottom",
+        run: "text",
+    }, {
+        trigger: ".select2-choices",
+        extra_trigger: ".note-editable p:not(:containsExact(\"<br>\"))",
+        content: _t("Insert tags related to your question."),
+        position: "top",
+        run: function (actions) {
+            actions.auto("input[id=s2id_autogen2]");
+        },
+    }, {
+        trigger: "button:contains(\"Post Your Question\")",
+        extra_trigger: "input[id=s2id_autogen2]:not(:propValue(\"Tags\"))",
+        content: _t("Click to post your question."),
+        position: "bottom",
+    }, {
+        trigger: ".modal-header button.close",
+        auto: true,
+    }, {
+        trigger: ".note-editable p",
+        content: _t("Put your answer here."),
+        position: "bottom",
+        run: "text",
+    }, {
+        trigger: "button:contains(\"Post Answer\")",
+        extra_trigger: ".note-editable p:not(:containsExact(\"<br>\"))",
+        content: _t("Click to post your answer."),
+        position: "bottom",
+    }, {
+        trigger: ".modal-header button.close",
+        auto: true,
+    }, {
+        trigger: "a[data-karma=\"20\"]:first",
+        content: _t("Click here to accept this answer."),
+        position: "right",
+    }]);
 });
diff --git a/addons/website_forum/tests/test_forum_process.py b/addons/website_forum/tests/test_forum_process.py
index d580a79c428..a81140c6cd3 100644
--- a/addons/website_forum/tests/test_forum_process.py
+++ b/addons/website_forum/tests/test_forum_process.py
@@ -7,7 +7,7 @@ import odoo.tests
 @odoo.tests.common.post_install(True)
 class TestUi(odoo.tests.HttpCase):
     def test_01_admin_forum_tour(self):
-        self.phantom_js("/", "odoo.__DEBUG__.services['web_tour.tour'].run('question')", "odoo.__DEBUG__.services['web_tour.tour'].tours.question", login="admin")
+        self.phantom_js("/", "odoo.__DEBUG__.services['web_tour.tour'].run('question')", "odoo.__DEBUG__.services['web_tour.tour'].tours.question.ready", login="admin")
 
     def test_02_demo_question(self):
         with self.cursor() as test_cr:
diff --git a/addons/website_sale/static/src/js/website_sale_tour_shop.js b/addons/website_sale/static/src/js/website_sale_tour_shop.js
index 0df707739bd..b9268b2c376 100644
--- a/addons/website_sale/static/src/js/website_sale_tour_shop.js
+++ b/addons/website_sale/static/src/js/website_sale_tour_shop.js
@@ -7,55 +7,54 @@ odoo.define("website_sale.tour_shop", function (require) {
 
     var _t = core._t;
 
-    base.ready().done(function () {
-        tour.register("shop", {
-            url: "/",
-        }, [tour.STEPS.WEBSITE_NEW_PAGE, {
-            trigger: "a[data-action=new_product]",
-            content: _t("Select <b>New Product</b> to create it and manage its properties to boost your sales."),
-            position: "bottom",
-        }, {
-            trigger: ".modal-dialog #editor_new_product input[type=text]",
-            content: _t("Enter a name for your new product"),
-            position: "right",
-        }, {
-            trigger: ".modal-dialog button.btn-primary.btn-continue",
-            content: _t("Click on <em>Continue</em> to create the product."),
-            position: "right",
-        }, {
-            trigger: ".product_price .o_is_inline_editable .oe_currency_value",
-            content: _t("Edit the price of this product by clicking on the amount."),
-            position: "bottom",
-            run: "text 1.99",
-        }, {
-            trigger: "#wrap img.product_detail_img",
-            extra_trigger: ".product_price .o_is_inline_editable .oe_currency_value:not(:containsExact(1.00))",
-            content: _t("Click here to set an image describing your product."),
-            position: "top",
-        }, {
-            trigger: ".o_select_media_dialog img:first",
-            content: _t("Choose an image from the library."),
-            position: "bottom",
-        }, {
-            trigger: ".o_select_media_dialog .btn.o_save_button",
-            extra_trigger: ".o_existing_attachment_cell.o_selected",
-            content: _t("Click on <b>Save</b> to add the image to the product description."),
-            position: "right",
-        }, {
-            trigger: "#snippet_structure .oe_snippet:eq(8) .oe_snippet_thumbnail",
-            extra_trigger: "body:not(.modal-open)",
-            content: _t("Drag this website block and drop it in your page."),
-            position: "bottom",
-            run: "drag_and_drop",
-        }, {
-            trigger: "button[data-action=save]",
-            content: _t("Once you click on <b>Save</b>, your product is updated."),
-            position: "bottom",
-        }, {
-            trigger: ".js_publish_management button.js_publish_btn.btn-danger",
-            extra_trigger: "body:not(.editor_enable)",
-            content: _t("Click on this button so your customers can see it."),
-            position: "top",
-        }]);
-    });
+    tour.register("shop", {
+        url: "/",
+        wait_for: base.ready(),
+    }, [tour.STEPS.WEBSITE_NEW_PAGE, {
+        trigger: "a[data-action=new_product]",
+        content: _t("Select <b>New Product</b> to create it and manage its properties to boost your sales."),
+        position: "bottom",
+    }, {
+        trigger: ".modal-dialog #editor_new_product input[type=text]",
+        content: _t("Enter a name for your new product"),
+        position: "right",
+    }, {
+        trigger: ".modal-dialog button.btn-primary.btn-continue",
+        content: _t("Click on <em>Continue</em> to create the product."),
+        position: "right",
+    }, {
+        trigger: ".product_price .o_is_inline_editable .oe_currency_value",
+        content: _t("Edit the price of this product by clicking on the amount."),
+        position: "bottom",
+        run: "text 1.99",
+    }, {
+        trigger: "#wrap img.product_detail_img",
+        extra_trigger: ".product_price .o_is_inline_editable .oe_currency_value:not(:containsExact(1.00))",
+        content: _t("Click here to set an image describing your product."),
+        position: "top",
+    }, {
+        trigger: ".o_select_media_dialog img:first",
+        content: _t("Choose an image from the library."),
+        position: "bottom",
+    }, {
+        trigger: ".o_select_media_dialog .btn.o_save_button",
+        extra_trigger: ".o_existing_attachment_cell.o_selected",
+        content: _t("Click on <b>Save</b> to add the image to the product description."),
+        position: "right",
+    }, {
+        trigger: "#snippet_structure .oe_snippet:eq(8) .oe_snippet_thumbnail",
+        extra_trigger: "body:not(.modal-open)",
+        content: _t("Drag this website block and drop it in your page."),
+        position: "bottom",
+        run: "drag_and_drop",
+    }, {
+        trigger: "button[data-action=save]",
+        content: _t("Once you click on <b>Save</b>, your product is updated."),
+        position: "bottom",
+    }, {
+        trigger: ".js_publish_management button.js_publish_btn.btn-danger",
+        extra_trigger: "body:not(.editor_enable)",
+        content: _t("Click on this button so your customers can see it."),
+        position: "top",
+    }]);
 });
diff --git a/addons/website_sale/tests/test_sale_process.py b/addons/website_sale/tests/test_sale_process.py
index 5d33d767be9..767cc4bbb9c 100644
--- a/addons/website_sale/tests/test_sale_process.py
+++ b/addons/website_sale/tests/test_sale_process.py
@@ -7,7 +7,7 @@ import odoo.tests
 @odoo.tests.common.post_install(True)
 class TestUi(odoo.tests.HttpCase):
     def test_01_admin_shop_tour(self):
-        self.phantom_js("/", "odoo.__DEBUG__.services['web_tour.tour'].run('shop')", "odoo.__DEBUG__.services['web_tour.tour'].tours.shop", login="admin")
+        self.phantom_js("/", "odoo.__DEBUG__.services['web_tour.tour'].run('shop')", "odoo.__DEBUG__.services['web_tour.tour'].tours.shop.ready", login="admin")
 
     def test_02_admin_checkout(self):
         self.phantom_js("/", "odoo.__DEBUG__.services['web.Tour'].run('shop_buy_product', 'test')", "odoo.__DEBUG__.services['web.Tour'].tours.shop_buy_product", login="admin")