From 0e552b96da70e72b3e6711f4869f1a2cdb31d725 Mon Sep 17 00:00:00 2001
From: Xavier Morel <xmo@odoo.com>
Date: Mon, 26 Apr 2021 14:02:06 +0000
Subject: [PATCH] [FIX] *: convert tip contents to t-out

Requires markup every markup-using tip content as Markup. Would be a
nice occasion to migrate everything to a markup-safe markdown I think,
especially if we could migrate the translations so we don't lose them.
---
 addons/account/static/src/js/tours/account.js |  7 +--
 addons/crm/static/src/js/tours/crm.js         | 21 ++++----
 .../static/src/js/tours/crm_iap_lead.js       |  5 +-
 .../event/static/src/js/tours/event_tour.js   | 18 +++----
 .../static/src/js/tours/hr_expense.js         | 19 ++++---
 .../static/src/js/tours/hr_recruitment.js     | 17 +++---
 addons/mail/static/src/js/tours/mail.js       | 17 +++---
 .../static/src/js/tours/mass_mailing_tour.js  | 14 ++---
 .../static/src/js/tours/point_of_sale.js      | 11 ++--
 addons/project/static/src/js/tours/project.js | 39 +++++++-------
 addons/sale/static/src/js/tours/sale.js       |  9 ++--
 .../static/tests/tours/sale_timesheet_tour.js |  7 +--
 addons/web_tour/static/src/js/tour_manager.js |  5 +-
 .../web_tour/static/src/js/tour_step_utils.js |  8 +--
 addons/web_tour/static/src/xml/tip.xml        |  2 +-
 .../website/static/src/js/tours/tour_utils.js | 39 +++++++-------
 .../static/src/js/tours/website_blog.js       | 17 +++---
 .../static/src/js/tours/event_tour.js         | 14 ++---
 .../static/tests/tours/website_event.js       |  9 ++--
 .../static/src/js/tours/website_sale_shop.js  | 10 ++--
 .../static/src/js/tours/slides_tour.js        | 53 +++++++++----------
 .../static/tests/tours/main_flow.js           | 33 ++++++------
 22 files changed, 185 insertions(+), 189 deletions(-)

diff --git a/addons/account/static/src/js/tours/account.js b/addons/account/static/src/js/tours/account.js
index e854f1c3bd0..8410249f275 100644
--- a/addons/account/static/src/js/tours/account.js
+++ b/addons/account/static/src/js/tours/account.js
@@ -2,6 +2,7 @@ odoo.define('account.tour', function(require) {
 "use strict";
 
 var core = require('web.core');
+const {Markup} = require('web.utils');
 var tour = require('web_tour.tour');
 
 var _t = core._t;
@@ -36,7 +37,7 @@ tour.register('account_tour', {
     }, {
         trigger: "div[name=partner_id] input",
         extra_trigger: "[name=move_type][raw-value=out_invoice]",
-        content: _t("Write a company name to <b>create one</b> or <b>see suggestions</b>."),
+        content: Markup(_t("Write a company name to <b>create one</b> or <b>see suggestions</b>.")),
         position: "bottom",
     }, {
         trigger: ".o_m2o_dropdown_option a:contains('Create')",
@@ -46,7 +47,7 @@ tour.register('account_tour', {
     }, {
         trigger: ".modal-content button.btn-primary",
         extra_trigger: "[name=move_type][raw-value=out_invoice]",
-        content: _t("Once everything is set, you are good to continue. You will be able to edit this later in the <b>Customers</b> menu."),
+        content: Markup(_t("Once everything is set, you are good to continue. You will be able to edit this later in the <b>Customers</b> menu.")),
         auto: true,
     }, {
         trigger: "div[name=invoice_line_ids] .o_field_x2many_list_row_add a:not([data-context])",
@@ -74,7 +75,7 @@ tour.register('account_tour', {
     }, {
         trigger: "input[name=email]",
         extra_trigger: "[name=move_type][raw-value=out_invoice]",
-        content: _t("Write here <b>your own email address</b> to test the flow."),
+        content: Markup(_t("Write here <b>your own email address</b> to test the flow.")),
         run: 'text customer@example.com',
         auto: true,
     }, {
diff --git a/addons/crm/static/src/js/tours/crm.js b/addons/crm/static/src/js/tours/crm.js
index 8c2e13506fb..12893ba0f15 100644
--- a/addons/crm/static/src/js/tours/crm.js
+++ b/addons/crm/static/src/js/tours/crm.js
@@ -2,6 +2,7 @@ odoo.define('crm.tour', function(require) {
 "use strict";
 
 var core = require('web.core');
+const {Markup} = require('web.utils');
 var tour = require('web_tour.tour');
 
 var _t = core._t;
@@ -12,22 +13,22 @@ tour.register('crm_tour', {
     sequence: 10,
 }, [tour.stepUtils.showAppsMenuItem(), {
     trigger: '.o_app[data-menu-xmlid="crm.crm_menu_root"]',
-    content: _t('Ready to boost your sales? Let\'s have a look at your <b>Pipeline</b>.'),
+    content: Markup(_t('Ready to boost your sales? Let\'s have a look at your <b>Pipeline</b>.')),
     position: 'bottom',
     edition: 'community',
 }, {
     trigger: '.o_app[data-menu-xmlid="crm.crm_menu_root"]',
-    content: _t('Ready to boost your sales? Let\'s have a look at your <b>Pipeline</b>.'),
+    content: Markup(_t('Ready to boost your sales? Let\'s have a look at your <b>Pipeline</b>.')),
     position: 'bottom',
     edition: 'enterprise',
 }, {
     trigger: '.o-kanban-button-new',
     extra_trigger: '.o_opportunity_kanban',
-    content: _t("<b>Create your first opportunity.</b>"),
+    content: Markup(_t("<b>Create your first opportunity.</b>")),
     position: 'bottom',
 }, {
     trigger: ".o_kanban_quick_create .o_field_widget[name='partner_id']",
-    content: _t('<b>Write a few letters</b> to look for a company, or create a new one.'),
+    content: Markup(_t('<b>Write a few letters</b> to look for a company, or create a new one.')),
     position: "top",
     run: function (actions) {
         actions.text("Brandon Freeman", this.$anchor.find("input"));
@@ -38,28 +39,28 @@ tour.register('crm_tour', {
     in_modal: false,
 }, {
     trigger: ".o_kanban_quick_create .o_kanban_add",
-    content: _t("Now, <b>add your Opportunity</b> to your Pipeline."),
+    content: Markup(_t("Now, <b>add your Opportunity</b> to your Pipeline.")),
     position: "bottom",
 }, {
     trigger: ".o_opportunity_kanban .o_kanban_group:first-child .o_kanban_record:last-child .oe_kanban_content",
     extra_trigger: ".o_opportunity_kanban",
-    content: _t("<b>Drag &amp; drop opportunities</b> between columns as you progress in your sales cycle."),
+    content: Markup(_t("<b>Drag &amp; drop opportunities</b> between columns as you progress in your sales cycle.")),
     position: "right",
     run: "drag_and_drop .o_opportunity_kanban .o_kanban_group:eq(2) ",
 }, {
     trigger: ".o_kanban_record:not(.o_updating) .o_activity_color_default",
     extra_trigger: ".o_opportunity_kanban",
-    content: _t("Looks like nothing is planned. :(<br><br><i>Tip : Schedule activities to keep track of everything you have to do!</i>"),
+    content: Markup(_t("Looks like nothing is planned. :(<br><br><i>Tip : Schedule activities to keep track of everything you have to do!</i>")),
     position: "bottom",
 }, {
     trigger: ".o_schedule_activity",
     extra_trigger: ".o_opportunity_kanban",
-    content: _t("Let's <b>Schedule an Activity.</b>"),
+    content: Markup(_t("Let's <b>Schedule an Activity.</b>")),
     position: "bottom",
     width: 200,
 }, {
     trigger: '.modal-footer button[name="action_close_dialog"]',
-    content: _t("All set. Let’s <b>Schedule</b> it."),
+    content: Markup(_t("All set. Let’s <b>Schedule</b> it.")),
     position: "top",  // dot NOT move to bottom, it would cause a resize flicker, see task-2476595
     run: function (actions) {
         actions.auto('.modal-footer button[special=cancel]');
@@ -67,7 +68,7 @@ tour.register('crm_tour', {
 }, {
     id: "drag_opportunity_to_won_step",
     trigger: ".o_opportunity_kanban .o_kanban_record:last-child",
-    content: _t("Drag your opportunity to <b>Won</b> when you get the deal. Congrats !"),
+    content: Markup(_t("Drag your opportunity to <b>Won</b> when you get the deal. Congrats !")),
     position: "bottom",
     run: "drag_and_drop .o_opportunity_kanban .o_kanban_group:eq(3) ",
 },  {
diff --git a/addons/crm_iap_lead/static/src/js/tours/crm_iap_lead.js b/addons/crm_iap_lead/static/src/js/tours/crm_iap_lead.js
index 577b6cd14d9..8d9b913645b 100644
--- a/addons/crm_iap_lead/static/src/js/tours/crm_iap_lead.js
+++ b/addons/crm_iap_lead/static/src/js/tours/crm_iap_lead.js
@@ -2,6 +2,7 @@ odoo.define('crm_iap_lead.generate_leads_steps', function (require) {
 "use strict";
 
 var tour = require('web_tour.tour');
+const {Markup} = require('web.utils');
 var core = require('web.core');
 
 require('crm.tour');
@@ -20,7 +21,7 @@ tour.tours.crm_tour.steps.splice(DragOppToWonStepIndex + 1, 0, {
      *
      */
     trigger: ".o_button_generate_leads",
-    content: _t("Looking for more opportunities ?<br>Try the <b>Lead Generation</b> tool."),
+    content: Markup(_t("Looking for more opportunities ?<br>Try the <b>Lead Generation</b> tool.")),
     position: "bottom",
     run: function (actions) {
         actions.auto('.o_button_generate_leads');
@@ -38,4 +39,4 @@ tour.tours.crm_tour.steps.splice(DragOppToWonStepIndex + 1, 0, {
 }
 });
 
-});
\ No newline at end of file
+});
diff --git a/addons/event/static/src/js/tours/event_tour.js b/addons/event/static/src/js/tours/event_tour.js
index d336729357e..88caff125db 100644
--- a/addons/event/static/src/js/tours/event_tour.js
+++ b/addons/event/static/src/js/tours/event_tour.js
@@ -18,8 +18,8 @@ return EventAdditionalTourSteps;
 odoo.define('event.event_tour', function (require) {
 "use strict";
 
-var core = require('web.core');
-var _t = core._t;
+const {_t} = require('web.core');
+const {Markup} = require('web.utils');
 
 var tour = require('web_tour.tour');
 var EventAdditionalTourSteps = require('event.event_steps');
@@ -30,33 +30,33 @@ tour.register('event_tour', {
     sequence: 210,
 }, [tour.stepUtils.showAppsMenuItem(), {
     trigger: '.o_app[data-menu-xmlid="event.event_main_menu"]',
-    content: _t("Ready to <b>organize events</b> in a few minutes? Let's get started!"),
+    content: Markup(_t("Ready to <b>organize events</b> in a few minutes? Let's get started!")),
     position: 'bottom',
     edition: 'enterprise',
 }, {
     trigger: '.o_app[data-menu-xmlid="event.event_main_menu"]',
-    content: _t("Ready to <b>organize events</b> in a few minutes? Let's get started!"),
+    content: Markup(_t("Ready to <b>organize events</b> in a few minutes? Let's get started!")),
     edition: 'community',
 }, {
     trigger: '.o-kanban-button-new',
     extra_trigger: '.o_event_kanban_view',
-    content: _t("Let's create your first <b>event</b>."),
+    content: Markup(_t("Let's create your first <b>event</b>.")),
     position: 'bottom',
     width: 175,
 }, {
     trigger: '.o_event_form_view input[name="name"]',
-    content: _t("This is the <b>name</b> your guests will see when registering."),
+    content: Markup(_t("This is the <b>name</b> your guests will see when registering.")),
     run: 'text Odoo Experience 2020',
 }, {
     trigger: '.o_event_form_view input[name="date_end"]',
-    content: _t("When will your event take place? <b>Select</b> the start and end dates <b>and click Apply</b>."),
+    content: Markup(_t("When will your event take place? <b>Select</b> the start and end dates <b>and click Apply</b>.")),
     run: function () {
         $('input[name="date_begin"]').val('09/30/2020 08:00:00').change();
         $('input[name="date_end"]').val('10/02/2020 23:00:00').change();
     },
 }, {
     trigger: '.o_event_form_view div[name="event_ticket_ids"] .o_field_x2many_list_row_add a',
-    content: _t("Ticket types allow you to distinguish your attendees. Let's <b>create</b> a new one."),
+    content: Markup(_t("Ticket types allow you to distinguish your attendees. Let's <b>create</b> a new one.")),
 }, ...new EventAdditionalTourSteps()._get_website_event_steps(), {
     trigger: '.o_event_form_view div[name="stage_id"]',
     extra_trigger: 'div.o_form_buttons_view:not(.o_hidden)',
@@ -65,7 +65,7 @@ tour.register('event_tour', {
 }, {
     trigger: 'ol.breadcrumb li.breadcrumb-item:first',
     extra_trigger: '.o_event_form_view div[name="stage_id"]',
-    content: _t("Use the <b>breadcrumbs</b> to go back to your kanban overview."),
+    content: Markup(_t("Use the <b>breadcrumbs</b> to go back to your kanban overview.")),
     position: 'bottom',
     run: 'click',
 }].filter(Boolean));
diff --git a/addons/hr_expense/static/src/js/tours/hr_expense.js b/addons/hr_expense/static/src/js/tours/hr_expense.js
index 66662f601b2..b8200677c51 100644
--- a/addons/hr_expense/static/src/js/tours/hr_expense.js
+++ b/addons/hr_expense/static/src/js/tours/hr_expense.js
@@ -1,11 +1,10 @@
 odoo.define('hr_expense.tour', function(require) {
 "use strict";
 
-var core = require('web.core');
+const {_t} = require('web.core');
+const {Markup} = require('web.utils');
 var tour = require('web_tour.tour');
 
-var _t = core._t;
-
 tour.register('hr_expense_tour' , {
     url: "/web"
 }, [tour.stepUtils.showAppsMenuItem(), {
@@ -20,7 +19,7 @@ tour.register('hr_expense_tour' , {
     edition: 'enterprise'
 }, {
     trigger: '.o_form_button_save',
-    content: _t("<p>Once your <b> Expense </b> is ready, you can save it.</p>"),
+    content: Markup(_t("<p>Once your <b> Expense </b> is ready, you can save it.</p>")),
     position: 'bottom',
 }, {
     trigger: '.o_attach_document',
@@ -29,28 +28,28 @@ tour.register('hr_expense_tour' , {
 }, {
     trigger: '.o_expense_submit',
     extra_triggger: ".o_expense_form",
-    content: _t('<p>Click on <b> Create Report </b> to create the report.</p>'),
+    content: Markup(_t('<p>Click on <b> Create Report </b> to create the report.</p>')),
     position: 'right',
 }, {
     trigger: '.o_expense_tree input[type=checkbox]',
-    content: _t('<p>Select expenses to submit them to your manager</p>'),
+    content: Markup(_t('<p>Select expenses to submit them to your manager</p>')),
     position: 'bottom'
 }, {
     trigger: '.o_dropdown_toggler',
     extra_trigger: ".o_expense_tree",
-    content: _t('<p>Click on <b> Action Create Report </b> to submit selected expenses to your manager</p>'),
+    content: Markup(_t('<p>Click on <b> Action Create Report </b> to submit selected expenses to your manager</p>')),
     position: 'right',
 },  {
     trigger: '.o_expense_sheet_submit',
-    content: _t('Once your <b>Expense report</b> is ready, you can submit it to your manager and wait for the approval from your manager.'),
+    content: Markup(_t('Once your <b>Expense report</b> is ready, you can submit it to your manager and wait for the approval from your manager.')),
     position: 'bottom',
 }, {
     trigger: '.o_expense_sheet_approve',
-    content: _t("<p>Approve the report here.</p><p>Tip: if you refuse, don’t forget to give the reason thanks to the hereunder message tool</p>"),
+    content: Markup(_t("<p>Approve the report here.</p><p>Tip: if you refuse, don’t forget to give the reason thanks to the hereunder message tool</p>")),
     position: 'bottom',
 }, {
     trigger: '.o_expense_sheet_post',
-    content: _t("<p>The accountant receive approved expense reports.</p><p>He can post journal entries in one click if taxes and accounts are right.</p>"),
+    content: Markup(_t("<p>The accountant receive approved expense reports.</p><p>He can post journal entries in one click if taxes and accounts are right.</p>")),
     position: 'bottom',
 }, {
     trigger: '.o_expense_sheet_pay',
diff --git a/addons/hr_recruitment/static/src/js/tours/hr_recruitment.js b/addons/hr_recruitment/static/src/js/tours/hr_recruitment.js
index e2bb77bfe61..0b2874f5fd4 100644
--- a/addons/hr_recruitment/static/src/js/tours/hr_recruitment.js
+++ b/addons/hr_recruitment/static/src/js/tours/hr_recruitment.js
@@ -1,11 +1,10 @@
 odoo.define('hr_recruitment.tour', function(require) {
 "use strict";
 
-var core = require('web.core');
+const {_t} = require('web.core');
+const {Markup} = require('web.utils');
 var tour = require('web_tour.tour');
 
-var _t = core._t;
-
 tour.register('hr_recruitment_tour',{
     url: "/web",
     rainbowManMessage: _t("<div>Great job! You hired a new colleague!</div><div>Try the Website app to publish job offers online.</div>"),
@@ -13,12 +12,12 @@ tour.register('hr_recruitment_tour',{
     sequence: 230,
 }, [tour.stepUtils.showAppsMenuItem(), {
     trigger: '.o_app[data-menu-xmlid="hr_recruitment.menu_hr_recruitment_root"]',
-    content: _t("Let's have a look at how to <b>improve</b> your <b>hiring process</b>."),
+    content: Markup(_t("Let's have a look at how to <b>improve</b> your <b>hiring process</b>.")),
     position: 'right',
     edition: 'community'
 }, {
     trigger: '.o_app[data-menu-xmlid="hr_recruitment.menu_hr_recruitment_root"]',
-    content: _t("Let's have a look at how to <b>improve</b> your <b>hiring process</b>."),
+    content: Markup(_t("Let's have a look at how to <b>improve</b> your <b>hiring process</b>.")),
     position: 'bottom',
     edition: 'enterprise'
 }, {
@@ -62,24 +61,24 @@ tour.register('hr_recruitment_tour',{
 }, {
     trigger: ".oe_kanban_action_button",
     extra_trigger: '.o_hr_recruitment_kanban',
-    content: _t("<b>Did you apply by sending an email?</b> Check incoming applications."),
+    content: Markup(_t("<b>Did you apply by sending an email?</b> Check incoming applications.")),
     position: "bottom"
 }, {
     trigger: ".oe_kanban_card",
     extra_trigger: '.o_kanban_applicant',
-    content: _t("<b>Drag this card</b>, to qualify him for a first interview."),
+    content: Markup(_t("<b>Drag this card</b>, to qualify him for a first interview.")),
     position: "bottom",
     run: "drag_and_drop .o_kanban_group:eq(1) ",
 }, {
     trigger: ".oe_kanban_card",
     extra_trigger: '.o_kanban_applicant',
-    content: _t("<b>Click to view</b> the application."),
+    content: Markup(_t("<b>Click to view</b> the application.")),
     position: "bottom",
     width: 195
 }, {
     trigger: ".o_Chatter .o_ChatterTopbar_buttonSendMessage",
     extra_trigger: '.o_applicant_form',
-    content: _t("<div><b>Try to send an email</b> to the applicant.</div><div><i>Tips: All emails sent or received are saved in the history here</i>"),
+    content: Markup(_t("<div><b>Try to send an email</b> to the applicant.</div><div><i>Tips: All emails sent or received are saved in the history here</i>")),
     position: "bottom"
 }, {
     trigger: ".o_Chatter .o_Composer_buttonSend",
diff --git a/addons/mail/static/src/js/tours/mail.js b/addons/mail/static/src/js/tours/mail.js
index 90b6a49ad62..85b16cc592b 100644
--- a/addons/mail/static/src/js/tours/mail.js
+++ b/addons/mail/static/src/js/tours/mail.js
@@ -1,20 +1,19 @@
 /** @odoo-module **/
 
-import core from 'web.core';
+import {_t} from 'web.core';
+import {Markup} from 'web.utils';
 import tour from 'web_tour.tour';
 
-var _t = core._t;
-
 tour.register('mail_tour', {
     url: "/web#action=mail.widgets.discuss",
     sequence: 80,
 }, [{
     trigger: '.o_DiscussSidebar_groupChannel .o_DiscussSidebar_groupHeaderItemAdd',
-    content: _t("<p>Channels make it easy to organize information across different topics and groups.</p> <p>Try to <b>create your first channel</b> (e.g. sales, marketing, product XYZ, after work party, etc).</p>"),
+    content: Markup(_t("<p>Channels make it easy to organize information across different topics and groups.</p> <p>Try to <b>create your first channel</b> (e.g. sales, marketing, product XYZ, after work party, etc).</p>")),
     position: 'bottom',
 }, {
     trigger: '.o_DiscussSidebar_itemNewInput',
-    content: _t("<p>Create a channel here.</p>"),
+    content: Markup(_t("<p>Create a channel here.</p>")),
     position: 'bottom',
     auto: true,
     run: function (actions) {
@@ -23,14 +22,14 @@ tour.register('mail_tour', {
     },
 }, {
     trigger: ".o_DiscussSidebar_newChannelAutocompleteSuggestions",
-    content: _t("<p>Create a public or private channel.</p>"),
+    content: Markup(_t("<p>Create a public or private channel.</p>")),
     position: 'right',
     run() {
         this.$consumeEventAnchors.find('li:first').click();
     },
 }, {
     trigger: '.o_Discuss_thread .o_ComposerTextInput_textarea',
-    content: _t("<p><b>Write a message</b> to the members of the channel here.</p> <p>You can notify someone with <i>'@'</i> or link another channel with <i>'#'</i>. Start your message with <i>'/'</i> to get the list of possible commands.</p>"),
+    content: Markup(_t("<p><b>Write a message</b> to the members of the channel here.</p> <p>You can notify someone with <i>'@'</i> or link another channel with <i>'#'</i>. Start your message with <i>'/'</i> to get the list of possible commands.</p>")),
     position: "top",
     width: 350,
     run: function (actions) {
@@ -43,7 +42,7 @@ tour.register('mail_tour', {
     position: "top",
 }, {
     trigger: '.o_Discuss_thread .o_Message_commandStar',
-    content: _t("Messages can be <b>starred</b> to remind you to check back later."),
+    content: Markup(_t("Messages can be <b>starred</b> to remind you to check back later.")),
     position: "bottom",
 }, {
     trigger: '.o_DiscussSidebarItem.o-starred-box',
@@ -51,6 +50,6 @@ tour.register('mail_tour', {
     position: "bottom",
 }, {
     trigger: '.o_DiscussSidebar_groupChat .o_DiscussSidebar_groupHeaderItemAdd',
-    content: _t("<p><b>Chat with coworkers</b> in real-time using direct messages.</p><p><i>You might need to invite users from the Settings app first.</i></p>"),
+    content: Markup(_t("<p><b>Chat with coworkers</b> in real-time using direct messages.</p><p><i>You might need to invite users from the Settings app first.</i></p>")),
     position: 'bottom',
 }]);
diff --git a/addons/mass_mailing/static/src/js/tours/mass_mailing_tour.js b/addons/mass_mailing/static/src/js/tours/mass_mailing_tour.js
index 47dad7b1b24..b9189c261a3 100644
--- a/addons/mass_mailing/static/src/js/tours/mass_mailing_tour.js
+++ b/addons/mass_mailing/static/src/js/tours/mass_mailing_tour.js
@@ -1,8 +1,8 @@
 odoo.define('mass_mailing.mass_mailing_tour', function (require) {
     "use strict";
 
-    var core = require('web.core');
-    var _t = core._t;
+    const {_t} = require('web.core');
+    const {Markup} = require('web.utils');
     var tour = require('web_tour.tour');
     var now = moment();
 
@@ -22,11 +22,11 @@ odoo.define('mass_mailing.mass_mailing_tour', function (require) {
         edition: 'community',
     }, {
         trigger: '.o-kanban-button-new',
-        content: _t("Start by creating your first <b>Mailing</b>."),
+        content: Markup(_t("Start by creating your first <b>Mailing</b>.")),
         position: 'bottom',
     }, {
         trigger: 'input[name="subject"]',
-        content: _t('Pick the <b>email subject</b>.'),
+        content: Markup(_t('Pick the <b>email subject</b>.')),
         position: 'right',
         run: 'text ' + now.format("MMMM") + " Newsletter",
     }, {
@@ -39,13 +39,13 @@ odoo.define('mass_mailing.mass_mailing_tour', function (require) {
         auto: true,
     }, {
         trigger: 'div[name="body_arch"] iframe #newsletter',
-        content: _t('Choose this <b>theme</b>.'),
+        content: Markup(_t('Choose this <b>theme</b>.')),
         position: 'left',
         edition: 'enterprise',
         run: 'click',
     }, {
         trigger: 'div[name="body_arch"] iframe #default',
-        content: _t('Choose this <b>theme</b>.'),
+        content: Markup(_t('Choose this <b>theme</b>.')),
         position: 'right',
         edition: 'community',
         run: 'click',
@@ -80,7 +80,7 @@ odoo.define('mass_mailing.mass_mailing_tour', function (require) {
         run: "click",
     }, {
         trigger: '.o_back_button',
-        content: _t("By using the <b>Breadcrumb</b>, you can navigate back to the overview."),
+        content: Markup(_t("By using the <b>Breadcrumb</b>, you can navigate back to the overview.")),
         position: 'bottom',
         run: 'click',
     }]
diff --git a/addons/point_of_sale/static/src/js/tours/point_of_sale.js b/addons/point_of_sale/static/src/js/tours/point_of_sale.js
index 49a6fc0ac3e..37bc8736206 100644
--- a/addons/point_of_sale/static/src/js/tours/point_of_sale.js
+++ b/addons/point_of_sale/static/src/js/tours/point_of_sale.js
@@ -1,30 +1,29 @@
 odoo.define('point_of_sale.tour', function(require) {
 "use strict";
 
-var core = require('web.core');
+const {_t} = require('web.core');
+const {Markup} = require('web.utils');
 var tour = require('web_tour.tour');
 
-var _t = core._t;
-
 tour.register('point_of_sale_tour', {
     url: "/web",
     rainbowMan: false,
     sequence: 45,
 }, [tour.stepUtils.showAppsMenuItem(), {
     trigger: '.o_app[data-menu-xmlid="point_of_sale.menu_point_root"]',
-    content: _t("Ready to launch your <b>point of sale</b>?"),
+    content: Markup(_t("Ready to launch your <b>point of sale</b>?")),
     width: 215,
     position: 'right',
     edition: 'community'
 }, {
     trigger: '.o_app[data-menu-xmlid="point_of_sale.menu_point_root"]',
-    content: _t("Ready to launch your <b>point of sale</b>?"),
+    content: Markup(_t("Ready to launch your <b>point of sale</b>?")),
     width: 215,
     position: 'bottom',
     edition: 'enterprise'
 }, {
     trigger: ".o_pos_kanban button.oe_kanban_action_button",
-    content: _t("<p>Ready to have a look at the <b>POS Interface</b>? Let's start our first session.</p>"),
+    content: Markup(_t("<p>Ready to have a look at the <b>POS Interface</b>? Let's start our first session.</p>")),
     position: "bottom"
 }]);
 
diff --git a/addons/project/static/src/js/tours/project.js b/addons/project/static/src/js/tours/project.js
index a0984eff0c8..c90d2eab0bb 100644
--- a/addons/project/static/src/js/tours/project.js
+++ b/addons/project/static/src/js/tours/project.js
@@ -1,46 +1,45 @@
 odoo.define('project.tour', function(require) {
 "use strict";
 
-var core = require('web.core');
+const {_t} = require('web.core');
+const {Markup} = require('web.utils');
 var tour = require('web_tour.tour');
 
-var _t = core._t;
-
 tour.register('project_tour', {
     sequence: 110,
     url: "/web",
     rainbowManMessage: "Congratulations, you are now a master of project management.",
 }, [tour.stepUtils.showAppsMenuItem(), {
     trigger: '.o_app[data-menu-xmlid="project.menu_main_pm"]',
-    content: _t('Want a better way to <b>manage your projects</b>? <i>It starts here.</i>'),
+    content: Markup(_t('Want a better way to <b>manage your projects</b>? <i>It starts here.</i>')),
     position: 'right',
     edition: 'community',
 }, {
     trigger: '.o_app[data-menu-xmlid="project.menu_main_pm"]',
-    content: _t('Want a better way to <b>manage your projects</b>? <i>It starts here.</i>'),
+    content: Markup(_t('Want a better way to <b>manage your projects</b>? <i>It starts here.</i>')),
     position: 'bottom',
     edition: 'enterprise',
 }, {
     trigger: '.o-kanban-button-new',
     extra_trigger: '.o_project_kanban',
-    content: _t('Let\'s create your first <b>project</b>.'),
+    content: Markup(_t('Let\'s create your first <b>project</b>.')),
     position: 'bottom',
     width: 200,
 }, {
     trigger: 'input.o_project_name',
-    content: _t('Choose a <b>name</b> for your project. <i>It can be anything you want: the name of a customer,\
-     of a product, of a team, of a construction site, etc.</i>'),
+    content: Markup(_t('Choose a <b>name</b> for your project. <i>It can be anything you want: the name of a customer,\
+     of a product, of a team, of a construction site, etc.</i>')),
     position: 'right',
 }, {
     trigger: '.o_open_tasks',
-    content: _t('Let\'s create your first <b>project</b>.'),
+    content: Markup(_t('Let\'s create your first <b>project</b>.')),
     position: 'top',
     run: function (actions) {
         actions.auto('.modal:visible .btn.btn-primary');
     },
 }, {
     trigger: ".o_kanban_project_tasks .o_column_quick_create .input-group",
-    content: _t("Add columns to organize your tasks into <b>stages</b> <i>e.g. New - In Progress - Done</i>."),
+    content: Markup(_t("Add columns to organize your tasks into <b>stages</b> <i>e.g. New - In Progress - Done</i>.")),
     position: 'right',
     run: function (actions) {
         actions.text("Test", this.$anchor.find("input"));
@@ -51,7 +50,7 @@ tour.register('project_tour', {
 }, {
     trigger: ".o_kanban_project_tasks .o_column_quick_create .input-group",
     extra_trigger: '.o_kanban_group',
-    content: _t("Add columns to organize your tasks into <b>stages</b> <i>e.g. New - In Progress - Done</i>."),
+    content: Markup(_t("Add columns to organize your tasks into <b>stages</b> <i>e.g. New - In Progress - Done</i>.")),
     position: 'right',
     run: function (actions) {
         actions.text("Test", this.$anchor.find("input"));
@@ -62,13 +61,13 @@ tour.register('project_tour', {
 }, {
     trigger: '.o-kanban-button-new',
     extra_trigger: '.o_kanban_group:eq(1)',
-    content: _t("Let's create your first <b>task</b>."),
+    content: Markup(_t("Let's create your first <b>task</b>.")),
     position: 'bottom',
     width: 200,
 }, {
     trigger: '.o_kanban_quick_create input.o_field_char[name=name]',
     extra_trigger: '.o_kanban_project_tasks',
-    content: _t('Choose a task <b>name</b> <i>(e.g. Website Design, Purchase Goods...)</i>'),
+    content: Markup(_t('Choose a task <b>name</b> <i>(e.g. Website Design, Purchase Goods...)</i>')),
     position: 'right',
 }, {
     trigger: '.o_kanban_quick_create .o_kanban_add',
@@ -78,7 +77,7 @@ tour.register('project_tour', {
 }, {
     trigger: ".o_kanban_record .oe_kanban_content",
     extra_trigger: '.o_kanban_project_tasks',
-    content: _t("<b>Drag &amp; drop</b> the card to change your task from stage."),
+    content: Markup(_t("<b>Drag &amp; drop</b> the card to change your task from stage.")),
     position: "bottom",
     run: "drag_and_drop .o_kanban_group:eq(1) ",
 }, {
@@ -88,20 +87,20 @@ tour.register('project_tour', {
     position: "bottom",
 }, {
     trigger: ".o_ChatterTopbar_buttonSendMessage",
-    content: _t("Use the chatter to <b>send emails</b> and communicate efficiently with your customers. \
-    Add new people to the followers' list to make them aware of the main changes about this task."),
+    content: Markup(_t("Use the chatter to <b>send emails</b> and communicate efficiently with your customers. \
+    Add new people to the followers' list to make them aware of the main changes about this task.")),
     width: 350,
     position: "bottom",
 }, {
     trigger: ".o_ChatterTopbar_buttonLogNote",
-    content: _t("<b>Log notes</b> for internal communications <i>(the people following this task won't be notified \
+    content: Markup(_t("<b>Log notes</b> for internal communications <i>(the people following this task won't be notified \
     of the note you are logging unless you specifically tag them)</i>. Use @ <b>mentions</b> to ping a colleague \
-    or # <b>mentions</b> to reach an entire team."),
+    or # <b>mentions</b> to reach an entire team.")),
     width: 350,
     position: "bottom"
 }, {
     trigger: ".o_ChatterTopbar_buttonScheduleActivity",
-    content: _t("Use <b>activities</b> to organize your daily work."),
+    content: Markup(_t("Use <b>activities</b> to organize your daily work.")),
 }, {
     trigger: ".modal-dialog .btn-primary",
     content: "Schedule your activity once it is ready.",
@@ -110,7 +109,7 @@ tour.register('project_tour', {
 }, {
     trigger: ".breadcrumb-item:not(.active):last",
     extra_trigger: '.o_form_project_tasks.o_form_readonly',
-    content: _t("Let's go back to the <b>kanban view</b> to have an overview of your next tasks."),
+    content: Markup(_t("Let's go back to the <b>kanban view</b> to have an overview of your next tasks.")),
     position: "right",
     run: 'click',
 }]);
diff --git a/addons/sale/static/src/js/tours/sale.js b/addons/sale/static/src/js/tours/sale.js
index d01b0ad6837..9c603aed152 100644
--- a/addons/sale/static/src/js/tours/sale.js
+++ b/addons/sale/static/src/js/tours/sale.js
@@ -1,11 +1,10 @@
 odoo.define('sale.tour', function(require) {
 "use strict";
 
-var core = require('web.core');
+const {_t} = require('web.core');
+const {Markup} = require('web.utils');
 var tour = require('web_tour.tour');
 
-var _t = core._t;
-
 tour.register("sale_tour", {
     url: "/web",
     rainbowMan: false,
@@ -108,11 +107,11 @@ tour.register("sale_quote_tour", {
     }, {
         trigger: ".o_field_widget[name='price_unit'] ",
         extra_trigger: ".o_sale_order",
-        content: _t("<b>Set a price</b>."),
+        content: Markup(_t("<b>Set a price</b>.")),
         position: "right",
         run: "text 10.0"
     },
-    ...tour.stepUtils.statusbarButtonsSteps("Send by Email", _t("<b>Send the quote</b> to yourself and check what the customer will receive."), ".o_statusbar_buttons button[name='action_quotation_send']"),
+    ...tour.stepUtils.statusbarButtonsSteps("Send by Email", Markup(_t("<b>Send the quote</b> to yourself and check what the customer will receive.")), ".o_statusbar_buttons button[name='action_quotation_send']"),
     {
         trigger: ".modal-footer button.btn-primary",
         auto: true,
diff --git a/addons/sale_timesheet/static/tests/tours/sale_timesheet_tour.js b/addons/sale_timesheet/static/tests/tours/sale_timesheet_tour.js
index 3cc9f39c46a..a51a39d81f4 100644
--- a/addons/sale_timesheet/static/tests/tours/sale_timesheet_tour.js
+++ b/addons/sale_timesheet/static/tests/tours/sale_timesheet_tour.js
@@ -1,6 +1,7 @@
 odoo.define('sale_timesheet.tour', function (require) {
 "use strict";
 
+const {Markup} = require('web.utils');
 const tour = require('web_tour.tour');
 
 tour.register('sale_timesheet_tour', {
@@ -28,7 +29,7 @@ tour.register('sale_timesheet_tour', {
     run: 'click',
 }, {
     trigger: '.o_field_widget[name="product_id"], .o_field_widget[name="product_template_id"]',
-    content: 'Select a prepaid service product <i>(e.g. Service Product (Prepaid Hours))</i>',
+    content: Markup('Select a prepaid service product <i>(e.g. Service Product (Prepaid Hours))</i>'),
     run: function (actions) {
         actions.text('Service Product (Prepaid Hours)', this.$anchor.find('input'));
     },
@@ -91,7 +92,7 @@ tour.register('sale_timesheet_tour', {
     run: 'click',
 }, {
     trigger: 'div[name="partner_id"]',
-    content: 'Select the customer of your Sales Order <i>(e.g. Brandon Freeman)</i>. Since we have a Sales Order for this customer with a prepaid service product which the remaining hours to deliver is greater than 0, the Sales Order Item in the task should be contain the Sales Order Item containing this prepaid service product.',
+    content: Markup('Select the customer of your Sales Order <i>(e.g. Brandon Freeman)</i>. Since we have a Sales Order for this customer with a prepaid service product which the remaining hours to deliver is greater than 0, the Sales Order Item in the task should be contain the Sales Order Item containing this prepaid service product.'),
     run: function (actions) {
         actions.text('Brandon Freeman', this.$anchor.find('input'));
     },
@@ -186,7 +187,7 @@ tour.register('sale_timesheet_tour', {
     },
 }, {
     trigger: 'div[name="partner_id"]',
-    content: 'Add the customer for this project to select an SO and SOL for this customer <i>(e.g. Brandon Freeman)</i>.',
+    content: Markup('Add the customer for this project to select an SO and SOL for this customer <i>(e.g. Brandon Freeman)</i>.'),
     run: function (actions) {
         actions.text('Azure Interior, Brandon Freeman', this.$anchor.find('input'));
     },
diff --git a/addons/web_tour/static/src/js/tour_manager.js b/addons/web_tour/static/src/js/tour_manager.js
index d85a89e426f..e8e8e0f3497 100644
--- a/addons/web_tour/static/src/js/tour_manager.js
+++ b/addons/web_tour/static/src/js/tour_manager.js
@@ -11,6 +11,7 @@ var RunningTourActionHelper = require('web_tour.RunningTourActionHelper');
 var ServicesMixin = require('web.ServicesMixin');
 var session = require('web.session');
 var Tip = require('web_tour.Tip');
+const {Markup} = require('web.utils');
 
 var _t = core._t;
 
@@ -92,7 +93,7 @@ return core.Class.extend(mixins.EventDispatcherMixin, ServicesMixin, {
             wait_for: options.wait_for || Promise.resolve(),
         };
         if (options.skip_enabled) {
-            tour.skip_link = '<p><span class="o_skip_tour">' + _t('Skip tour') + '</span></p>';
+            tour.skip_link = Markup`<p><span class="o_skip_tour">${_t('Skip tour')}</span></p>`;
             tour.skip_handler = function (tip) {
                 this._deactivate_tip(tip);
                 this._consume_tour(name);
@@ -353,7 +354,7 @@ return core.Class.extend(mixins.EventDispatcherMixin, ServicesMixin, {
         var tip_info = tip;
         if (tour.skip_link) {
             tip_info = _.extend(_.omit(tip_info, 'content'), {
-                content: tip.content + tour.skip_link,
+                content: Markup`${tip.content}${tour.skip_link}`,
                 event_handlers: [{
                     event: 'click',
                     selector: '.o_skip_tour',
diff --git a/addons/web_tour/static/src/js/tour_step_utils.js b/addons/web_tour/static/src/js/tour_step_utils.js
index f2b6f3930ec..866c804cf94 100644
--- a/addons/web_tour/static/src/js/tour_step_utils.js
+++ b/addons/web_tour/static/src/js/tour_step_utils.js
@@ -1,10 +1,10 @@
 odoo.define('web_tour.TourStepUtils', function (require) {
 'use strict';
 
-const core = require('web.core');
-const _t = core._t;
+const {_t, Class} = require('web.core');
+const {Markup} = require('web.utils');
 
-return core.Class.extend({
+return Class.extend({
     _getHelpMessage: (functionName, ...args) => `Generated by function tour utils ${functionName}(${args.join(', ')})`,
 
     addDebugHelp: helpMessage => step => {
@@ -39,7 +39,7 @@ return core.Class.extend({
         return {
             edition: 'enterprise',
             trigger: '.o_main_navbar .o_menu_toggle',
-            content: _t('Click on the <i>Home icon</i> to navigate across apps.'),
+            content: Markup(_t('Click on the <i>Home icon</i> to navigate across apps.')),
             position: 'bottom',
         };
     },
diff --git a/addons/web_tour/static/src/xml/tip.xml b/addons/web_tour/static/src/xml/tip.xml
index eba661f65ca..6516fafbfa7 100644
--- a/addons/web_tour/static/src/xml/tip.xml
+++ b/addons/web_tour/static/src/xml/tip.xml
@@ -3,7 +3,7 @@
     <div t-name="Tip" t-attf-class="o_tooltip #{widget.info.position} #{widget.is_anchor_fixed_position ? 'o_tooltip_fixed' : ''}">
         <div class="o_tooltip_overlay"/>
         <div class="o_tooltip_content">
-            <t t-raw="widget.info.content"/>
+            <t t-out="widget.info.content"/>
         </div>
     </div>
 </templates>
diff --git a/addons/website/static/src/js/tours/tour_utils.js b/addons/website/static/src/js/tours/tour_utils.js
index 351e1d12ecf..ab20fdcfb5f 100644
--- a/addons/website/static/src/js/tours/tour_utils.js
+++ b/addons/website/static/src/js/tours/tour_utils.js
@@ -1,15 +1,14 @@
 odoo.define("website.tour_utils", function (require) {
 "use strict";
 
-const core = require("web.core");
-const _t = core._t;
-
+const {_t} = require("web.core");
+const {Markup} = require('web.utils');
 var tour = require("web_tour.tour");
 
 function addMedia(position = "right") {
     return {
         trigger: `.modal-content footer .btn-primary`,
-        content: _t("<b>Add</b> the selected image."),
+        content: Markup(_t("<b>Add</b> the selected image.")),
         position: position,
         run: "click",
     };
@@ -18,7 +17,7 @@ function addMedia(position = "right") {
 function changeBackground(snippet, position = "bottom") {
     return {
         trigger: ".o_we_customize_panel .o_we_bg_success",
-        content: _t("<b>Customize</b> any block through this menu. Try to change the background image of this block."),
+        content: Markup(_t("<b>Customize</b> any block through this menu. Try to change the background image of this block.")),
         position: position,
         run: "click",
     };
@@ -27,7 +26,7 @@ function changeBackground(snippet, position = "bottom") {
 function changeBackgroundColor(position = "bottom") {
     return {
         trigger: ".o_we_customize_panel .o_we_color_preview",
-        content: _t("<b>Customize</b> any block through this menu. Try to change the background color of this block."),
+        content: Markup(_t("<b>Customize</b> any block through this menu. Try to change the background color of this block.")),
         position: position,
         run: "click",
     };
@@ -37,7 +36,7 @@ function selectColorPalette(position = "left") {
     return {
         trigger: ".o_we_customize_panel .o_we_so_color_palette we-selection-items",
         alt_trigger: ".o_we_customize_panel .o_we_color_preview",
-        content: _t(`<b>Select</b> a Color Palette.`),
+        content: Markup(_t(`<b>Select</b> a Color Palette.`)),
         position: position,
         run: 'click',
         location: position === 'left' ? '#oe_snippets' : undefined,
@@ -47,7 +46,7 @@ function selectColorPalette(position = "left") {
 function changeColumnSize(position = "right") {
     return {
         trigger: `.oe_overlay.ui-draggable.o_we_overlay_sticky.oe_active .o_handle.e`,
-        content: _t("<b>Slide</b> this button to change the column size."),
+        content: Markup(_t("<b>Slide</b> this button to change the column size.")),
         position: position,
     };
 }
@@ -56,7 +55,7 @@ function changeIcon(snippet, index = 0, position = "bottom") {
     return {
         trigger: `#wrapwrap .${snippet.id} i:eq(${index})`,
         extra_trigger: "body.editor_enable",
-        content: _t("<b>Double click on an icon</b> to change it with one of your choice."),
+        content: Markup(_t("<b>Double click on an icon</b> to change it with one of your choice.")),
         position: position,
         run: "dblclick",
     };
@@ -66,7 +65,7 @@ function changeImage(snippet, position = "bottom") {
     return {
         trigger: snippet.id ? `#wrapwrap .${snippet.id} img` : snippet,
         extra_trigger: "body.editor_enable",
-        content: _t("<b>Double click on an image</b> to change it with one of your choice."),
+        content: Markup(_t("<b>Double click on an image</b> to change it with one of your choice.")),
         position: position,
         run: "dblclick",
     };
@@ -79,7 +78,7 @@ function changeOption(optionName, weName = '', optionTooltipLabel = '', position
     const option_block = `we-customizeblock-option[class='snippet-option-${optionName}']`
     return {
         trigger: `${option_block} ${weName}, ${option_block} [title='${weName}']`,
-        content: _.str.sprintf(_t("<b>Click</b> on this option to change the %s of the block."), optionTooltipLabel),
+        content: Markup(_.str.sprintf(_t("<b>Click</b> on this option to change the %s of the block."), optionTooltipLabel)),
         position: position,
         run: "click",
     };
@@ -89,7 +88,7 @@ function selectNested(trigger, optionName, alt_trigger = null, optionTooltipLabe
     const option_block = `we-customizeblock-option[class='snippet-option-${optionName}']`;
     return {
         trigger: trigger,
-        content: _.str.sprintf(_t("<b>Select</b> a %s."), optionTooltipLabel),
+        content: Markup(_.str.sprintf(_t("<b>Select</b> a %s."), optionTooltipLabel)),
         alt_trigger: alt_trigger == null ? undefined : `${option_block} ${alt_trigger}`,
         position: position,
         run: 'click',
@@ -106,7 +105,7 @@ function changePaddingSize(direction) {
     }
     return {
         trigger: `.oe_overlay.ui-draggable.o_we_overlay_sticky.oe_active .o_handle.${paddingDirection}`,
-        content: _.str.sprintf(_t("<b>Slide</b> this button to change the %s padding"), direction),
+        content: Markup(_.str.sprintf(_t("<b>Slide</b> this button to change the %s padding"), direction)),
         position: position,
     };
 }
@@ -118,7 +117,7 @@ function changePaddingSize(direction) {
 function clickOnEdit(position = "bottom") {
     return {
         trigger: "a[data-action=edit]",
-        content: _t("<b>Click Edit</b> to start designing your homepage."),
+        content: Markup(_t("<b>Click Edit</b> to start designing your homepage.")),
         extra_trigger: ".homepage",
         position: position,
     };
@@ -133,7 +132,7 @@ function clickOnSnippet(snippet, position = "bottom") {
     return {
         trigger: snippet.id ? `#wrapwrap .${snippet.id}` : snippet,
         extra_trigger: "body.editor_enable",
-        content: _t("<b>Click on a snippet</b> to access its options menu."),
+        content: Markup(_t("<b>Click on a snippet</b> to access its options menu.")),
         position: position,
         run: "click",
     };
@@ -143,7 +142,7 @@ function clickOnSave(position = "bottom") {
     return [{
         trigger: "button[data-action=save]",
         in_modal: false,
-        content: _t("Good job! It's time to <b>Save</b> your work."),
+        content: Markup(_t("Good job! It's time to <b>Save</b> your work.")),
         position: position,
     }, {
         trigger: 'body:not(.editor_enable)',
@@ -162,7 +161,7 @@ function clickOnText(snippet, element, position = "bottom") {
     return {
         trigger: snippet.id ? `#wrapwrap .${snippet.id} ${element}` : snippet,
         extra_trigger: "body.editor_enable",
-        content: _t("<b>Click on a text</b> to start editing it."),
+        content: Markup(_t("<b>Click on a text</b> to start editing it.")),
         position: position,
         run: "text",
         consumeEvent: "input",
@@ -179,7 +178,7 @@ function dragNDrop(snippet, position = "bottom") {
         trigger: `#oe_snippets .oe_snippet[name="${snippet.name}"] .oe_snippet_thumbnail:not(.o_we_already_dragging)`,
         extra_trigger: "body.editor_enable.editor_has_snippets",
         moveTrigger: '.oe_drop_zone',
-        content: _.str.sprintf(_t("Drag the <b>%s</b> building block and drop it at the bottom of the page."), snippet.name),
+        content: Markup(_.str.sprintf(_t("Drag the <b>%s</b> building block and drop it at the bottom of the page."), snippet.name)),
         position: position,
         // Normally no main snippet can be dropped in the default footer but
         // targeting it allows to force "dropping at the end of the page".
@@ -208,7 +207,7 @@ function goToTheme(position = "bottom") {
 function selectHeader(position = "bottom") {
     return {
         trigger: `header#top`,
-        content: _t(`<b>Click</b> on this header to configure it.`),
+        content: Markup(_t(`<b>Click</b> on this header to configure it.`)),
         position: position,
         run: "click",
     };
@@ -217,7 +216,7 @@ function selectHeader(position = "bottom") {
 function selectSnippetColumn(snippet, index = 0, position = "bottom") {
      return {
         trigger: `#wrapwrap .${snippet.id} .row div[class*="col-lg-"]:eq(${index})`,
-        content: _t("<b>Click</b> on this column to access its options."),
+        content: Markup(_t("<b>Click</b> on this column to access its options.")),
          position: position,
         run: "click",
      };
diff --git a/addons/website_blog/static/src/js/tours/website_blog.js b/addons/website_blog/static/src/js/tours/website_blog.js
index 23b591490fb..42f68d86d1d 100644
--- a/addons/website_blog/static/src/js/tours/website_blog.js
+++ b/addons/website_blog/static/src/js/tours/website_blog.js
@@ -1,11 +1,10 @@
 odoo.define("website_blog.tour", function (require) {
     "use strict";
 
-    var core = require("web.core");
+    const {_t} = require("web.core");
+    const {Markup} = require('web.utils');
     var tour = require("web_tour.tour");
 
-    var _t = core._t;
-
     tour.register("blog", {
         url: "/",
     }, [{
@@ -30,7 +29,7 @@ odoo.define("website_blog.tour", function (require) {
     }, {
         trigger: "we-button[data-background]:nth(1)",
         extra_trigger: "#wrap div[data-oe-expression=\"blog_post.name\"]:not(:containsExact(\"\"))",
-        content: _t("Set a blog post <b>cover</b>."),
+        content: Markup(_t("Set a blog post <b>cover</b>.")),
         position: "right",
     }, {
         trigger: ".o_select_media_dialog .o_we_search",
@@ -43,7 +42,7 @@ odoo.define("website_blog.tour", function (require) {
         position: "top",
     }, {
         trigger: "#o_wblog_post_content",
-        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."),
+        content: Markup(_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();
@@ -52,12 +51,12 @@ odoo.define("website_blog.tour", function (require) {
     }, {
         trigger: "button[data-action=save]",
         extra_trigger: "#o_wblog_post_content .o_wblog_post_content_field p:first:not(:containsExact(" + _t("Start writing here...") + "))",
-        content: _t("<b>Click on Save</b> to record your changes."),
+        content: Markup(_t("<b>Click on Save</b> to record your 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>."),
+        content: Markup(_t("Use this icon to preview your blog post on <b>mobile devices</b>.")),
         position: "bottom",
     }, {
         trigger: "button[data-dismiss=modal]",
@@ -68,11 +67,11 @@ odoo.define("website_blog.tour", function (require) {
         trigger: ".js_publish_management .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."),
+        content: Markup(_t("<b>Publish your blog post</b> to make it visible to your visitors.")),
     }, {
         trigger: "#customize-menu > a",
         extra_trigger: ".js_publish_management .js_publish_btn .css_unpublish:visible",
-        content: _t("<b>That's it, your blog post is published!</b> Discover more features through the <i>Customize</i> menu."),
+        content: Markup(_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_event/static/src/js/tours/event_tour.js b/addons/website_event/static/src/js/tours/event_tour.js
index 421146c1a09..633d4f5a443 100644
--- a/addons/website_event/static/src/js/tours/event_tour.js
+++ b/addons/website_event/static/src/js/tours/event_tour.js
@@ -1,8 +1,8 @@
 odoo.define('website_event.event_steps', function (require) {
 "use strict";
 
-var core = require('web.core');
-var _t = core._t;
+const {_t} = require('web.core');
+const {Markup} = require('web.utils');
 
 var EventAdditionalTourSteps = require('event.event_steps');
 
@@ -16,28 +16,28 @@ EventAdditionalTourSteps.include({
         this._super.apply(this, arguments);
         return [{
                 trigger: '.o_event_form_view button[name="is_published"]',
-                content: _t("Use this <b>shortcut</b> to easily access your event web page."),
+                content: Markup(_t("Use this <b>shortcut</b> to easily access your event web page.")),
                 position: 'bottom',
             }, {
                 trigger: 'li#edit-page-menu a',
                 extra_trigger: '.o_wevent_event',
-                content: _t("With the Edit button, you can <b>customize</b> the web page visitors will see when registering."),
+                content: Markup(_t("With the Edit button, you can <b>customize</b> the web page visitors will see when registering.")),
                 position: 'bottom',
             }, {
                 trigger: 'div[name="Image - Text"] .oe_snippet_thumbnail',
                 extra_trigger: '.o_wevent_event',
-                content: _t("<b>Drag and Drop</b> this snippet below the event title."),
+                content: Markup(_t("<b>Drag and Drop</b> this snippet below the event title.")),
                 position: 'bottom',
                 run: 'drag_and_drop #o_wevent_event_main_col',
             }, {
                 trigger: 'button[data-action="save"]',
                 extra_trigger: '.o_wevent_event',
-                content: _t("Don't forget to click <b>save</b> when you're done."),
+                content: Markup(_t("Don't forget to click <b>save</b> when you're done.")),
                 position: 'bottom',
             }, {
                 trigger: 'label.js_publish_btn',
                 extra_trigger: '.o_wevent_event',
-                content: _t("Looking great! Let's now <b>publish</b> this page so that it becomes <b>visible</b> on your website!"),
+                content: Markup(_t("Looking great! Let's now <b>publish</b> this page so that it becomes <b>visible</b> on your website!")),
                 position: 'bottom',
             }, {
                 trigger: 'a.css_edit_dynamic',
diff --git a/addons/website_event/static/tests/tours/website_event.js b/addons/website_event/static/tests/tours/website_event.js
index b94e52a098f..0a3a038705d 100644
--- a/addons/website_event/static/tests/tours/website_event.js
+++ b/addons/website_event/static/tests/tours/website_event.js
@@ -1,11 +1,10 @@
 odoo.define("website_event.tour", function (require) {
     "use strict";
 
-    var core = require("web.core");
+    const {_t} = require("web.core");
+    const {Markup} = require('web.utils');
     var tour = require("web_tour.tour");
 
-    var _t = core._t;
-
     tour.register("website_event_tour", {
         test: true,
         url: "/",
@@ -19,12 +18,12 @@ odoo.define("website_event.tour", function (require) {
         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"),
+        content: Markup(_t("Create a name for your new event and click <em>\"Continue\"</em>. e.g: Technical Training")),
         position: "left",
     }, {
         trigger: '.modal-footer button.btn-primary.btn-continue',
         extra_trigger: '#editor_new_event input[type=text][value!=""]',
-        content: _t("Click <em>Continue</em> to create the event."),
+        content: Markup(_t("Click <em>Continue</em> to create the event.")),
         position: "right",
     }, {
         trigger: "#snippet_structure .oe_snippet:eq(2) .oe_snippet_thumbnail",
diff --git a/addons/website_sale/static/src/js/tours/website_sale_shop.js b/addons/website_sale/static/src/js/tours/website_sale_shop.js
index 6edb36dd123..5950133c7cb 100644
--- a/addons/website_sale/static/src/js/tours/website_sale_shop.js
+++ b/addons/website_sale/static/src/js/tours/website_sale_shop.js
@@ -1,8 +1,8 @@
 odoo.define("website_sale.tour_shop", function (require) {
     "use strict";
 
-    var core = require("web.core");
-    var _t = core._t;
+    const {_t} = require("web.core");
+    const {Markup} = require('web.utils');
 
     // return the steps, used for backend and frontend
 
@@ -13,7 +13,7 @@ odoo.define("website_sale.tour_shop", function (require) {
         position: "bottom",
     }, {
         trigger: "a[data-action=new_product]",
-        content: _t("Select <b>New Product</b> to create it and manage its properties to boost your sales."),
+        content: Markup(_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]",
@@ -21,7 +21,7 @@ odoo.define("website_sale.tour_shop", function (require) {
         position: "right",
     }, {
         trigger: ".modal-footer button.btn-primary.btn-continue",
-        content: _t("Click on <em>Continue</em> to create the product."),
+        content: Markup(_t("Click on <em>Continue</em> to create the product.")),
         position: "right",
     }, {
         trigger: ".product_price .oe_currency_value:visible",
@@ -55,7 +55,7 @@ odoo.define("website_sale.tour_shop", function (require) {
         run: "drag_and_drop",
     }, {
         trigger: "button[data-action=save]",
-        content: _t("Once you click on <b>Save</b>, your product is updated."),
+        content: Markup(_t("Once you click on <b>Save</b>, your product is updated.")),
         position: "bottom",
     }, {
         trigger: ".js_publish_management .js_publish_btn .css_publish",
diff --git a/addons/website_slides/static/src/js/tours/slides_tour.js b/addons/website_slides/static/src/js/tours/slides_tour.js
index 249a92f345b..db722a75bfc 100644
--- a/addons/website_slides/static/src/js/tours/slides_tour.js
+++ b/addons/website_slides/static/src/js/tours/slides_tour.js
@@ -1,116 +1,115 @@
 odoo.define('website_slides.slides_tour', function (require) {
 "use strict";
 
-var core = require('web.core');
-var _t = core._t;
-
+const {_t} = require('web.core');
+const {Markup} = require('web.utils');
 var tour = require('web_tour.tour');
 
 tour.register('slides_tour', {
     url: '/slides',
 }, [{
     trigger: '#new-content-menu > a',
-    content: _t("Welcome on your course's home page. It's still empty for now. Click on \"<b>New</b>\" to write your first course."),
+    content: Markup(_t("Welcome on your course's home page. It's still empty for now. Click on \"<b>New</b>\" to write your first course.")),
     position: 'bottom',
 }, {
     trigger: 'a[data-action="new_slide_channel"]',
-    content: _t("Select <b>Course</b> to create it and manage it."),
+    content: Markup(_t("Select <b>Course</b> to create it and manage it.")),
     position: 'bottom',
     width: 210,
 }, {
     trigger: 'input[name="name"]',
-    content: _t("Give your course an engaging <b>Title</b>."),
+    content: Markup(_t("Give your course an engaging <b>Title</b>.")),
     position: 'bottom',
     width: 280,
     run: 'text My New Course',
 }, {
     trigger: 'textarea[name="description"]',
-    content: _t("Give your course a helpful <b>Description</b>."),
+    content: Markup(_t("Give your course a helpful <b>Description</b>.")),
     position: 'bottom',
     width: 300,
     run: 'text This course is for advanced users.',
 }, {
     trigger: 'button.btn-primary',
-    content: _t("Click on the <b>Create</b> button to create your first course."),
+    content: Markup(_t("Click on the <b>Create</b> button to create your first course.")),
 }, {
     trigger: '.o_wslides_js_slide_section_add',
-    content: _t("Congratulations, your course has been created, but there isn't any content yet. First, let's add a <b>Section</b> to give your course a structure."),
+    content: Markup(_t("Congratulations, your course has been created, but there isn't any content yet. First, let's add a <b>Section</b> to give your course a structure.")),
     position: 'bottom',
 }, {
     trigger: 'input[name="name"]',
-    content: _t("A good course has structure and a table of content. Your first section will be the <b>Introduction</b>."),
+    content: Markup(_t("A good course has structure and a table of content. Your first section will be the <b>Introduction</b>.")),
     position: 'bottom',
 }, {
     trigger: 'button.btn-primary',
-    content: _t("Click on <b>Save</b> to apply changes."),
+    content: Markup(_t("Click on <b>Save</b> to apply changes.")),
     position: 'bottom',
     width: 260,
 }, {
     trigger: 'a.btn-primary.o_wslides_js_slide_upload',
-    content: _t("Your first section is created, now it's time to add lessons to your course. Click on <b>Add Content</b> to upload a document, create a web page or link a video."),
+    content: Markup(_t("Your first section is created, now it's time to add lessons to your course. Click on <b>Add Content</b> to upload a document, create a web page or link a video.")),
     position: 'bottom',
 }, {
     trigger: 'a[data-slide-type="presentation"]',
-    content: _t("First, let's add a <b>Presentation</b>. It can be a .pdf or an image."),
+    content: Markup(_t("First, let's add a <b>Presentation</b>. It can be a .pdf or an image.")),
     position: 'bottom',
 }, {
     trigger: 'input#upload',
-    content: _t("Choose a <b>File</b> on your computer."),
+    content: Markup(_t("Choose a <b>File</b> on your computer.")),
 }, {
     trigger: 'input#name',
-    content: _t("The <b>Title</b> of your lesson is autocompleted but you can change it if you want.</br>A <b>Preview</b> of your file is available on the right side of the screen."),
+    content: Markup(_t("The <b>Title</b> of your lesson is autocompleted but you can change it if you want.</br>A <b>Preview</b> of your file is available on the right side of the screen.")),
 }, {
     trigger: 'input#duration',
-    content: _t("The <b>Duration</b> of the lesson is based on the number of pages of your document. You can change this number if your attendees will need more time to assimilate the content."),
+    content: Markup(_t("The <b>Duration</b> of the lesson is based on the number of pages of your document. You can change this number if your attendees will need more time to assimilate the content.")),
 }, {
     trigger: 'button.o_w_slide_upload_published',
-    content: _t("<b>Save & Publish</b> your lesson to make it available to your attendees."),
+    content: Markup(_t("<b>Save & Publish</b> your lesson to make it available to your attendees.")),
     position: 'bottom',
     width: 285,
 }, {
     trigger: 'span.badge-info:contains("New")',
-    content: _t("Congratulations! Your first lesson is available. Let's see the options available here. The tag \"<b>New</b>\" indicates that this lesson was created less than 7 days ago."),
+    content: Markup(_t("Congratulations! Your first lesson is available. Let's see the options available here. The tag \"<b>New</b>\" indicates that this lesson was created less than 7 days ago.")),
     position: 'bottom',
 }, {
     trigger: 'a[name="o_wslides_list_slide_add_quizz"]',
     extra_trigger: '.o_wslides_slides_list_slide:hover',
-    content: _t("If you want to be sure that attendees have understood and memorized the content, you can add a Quiz on the lesson. Click on <b>Add Quiz</b>."),
+    content: Markup(_t("If you want to be sure that attendees have understood and memorized the content, you can add a Quiz on the lesson. Click on <b>Add Quiz</b>.")),
 }, {
     trigger: 'input[name="question-name"]',
-    content: _t("Enter your <b>Question</b>. Be clear and concise."),
+    content: Markup(_t("Enter your <b>Question</b>. Be clear and concise.")),
     position: 'left',
     width: 330,
 }, {
     trigger: 'input.o_wslides_js_quiz_answer_value',
-    content: _t("Enter at least two possible <b>Answers</b>."),
+    content: Markup(_t("Enter at least two possible <b>Answers</b>.")),
     position: 'left',
     width: 290,
 }, {
     trigger: 'a.o_wslides_js_quiz_is_correct',
-    content: _t("Mark the correct answer by checking the <b>correct</b> mark."),
+    content: Markup(_t("Mark the correct answer by checking the <b>correct</b> mark.")),
     position: 'right',
     width: 230,
 }, {
     trigger: 'i.o_wslides_js_quiz_comment_answer:last',
-    content: _t("You can add <b>comments</b> on answers. This will be visible with the results if the user select this answer."),
+    content: Markup(_t("You can add <b>comments</b> on answers. This will be visible with the results if the user select this answer.")),
     position: 'right',
 
 }, {
     trigger: 'a.o_wslides_js_quiz_validate_question',
-    content: _t("<b>Save</b> your question."),
+    content: Markup(_t("<b>Save</b> your question.")),
     position: 'left',
     width: 170,
 }, {
     trigger: 'li.breadcrumb-item:nth-child(2)',
-    content: _t("Click on your <b>Course</b> to go back to the table of content."),
+    content: Markup(_t("Click on your <b>Course</b> to go back to the table of content.")),
     position: 'top',
 }, {
     trigger: 'label.js_publish_btn',
-    content: _t("Once you're done, don't forget to <b>Publish</b> your course."),
+    content: Markup(_t("Once you're done, don't forget to <b>Publish</b> your course.")),
     position: 'bottom',
 }, {
     trigger: 'a.o_wslides_js_slides_list_slide_link',
-    content: _t("Congratulations, you've created your first course.<br/>Click on the title of this content to see it in fullscreen mode."),
+    content: Markup(_t("Congratulations, you've created your first course.<br/>Click on the title of this content to see it in fullscreen mode.")),
     position: 'bottom',
 }]);
 
diff --git a/odoo/addons/test_main_flows/static/tests/tours/main_flow.js b/odoo/addons/test_main_flows/static/tests/tours/main_flow.js
index 832819861dd..e8549b3cbcd 100644
--- a/odoo/addons/test_main_flows/static/tests/tours/main_flow.js
+++ b/odoo/addons/test_main_flows/static/tests/tours/main_flow.js
@@ -2,13 +2,14 @@ odoo.define('test_main_flows.tour', function (require) {
 "use strict";
 
 const {_t} = require('web.core');
+const {Markup} = require('web.utils');
 const tour = require('web_tour.tour');
 
 tour.register('main_flow_tour', {
     test: true,
     url: "/web",
 }, [
-...tour.stepUtils.goToAppSteps('sale.sale_menu_root', _t('Organize your sales activities with the <b>Sales app</b>.')),
+...tour.stepUtils.goToAppSteps('sale.sale_menu_root', Markup(_t('Organize your sales activities with the <b>Sales app</b>.'))),
 tour.stepUtils.openBuggerMenu("li.breadcrumb-item.active:contains('Quotations')"),
 {
 // Add Stockable product
@@ -335,11 +336,11 @@ tour.stepUtils.autoExpandMoreButtons('.o_form_readonly'),
 }, {
     mobile: false,
     trigger: ".breadcrumb-item:first",
-    content: _t("Use the breadcrumbs to <b>go back to products</b>."),
+    content: Markup(_t("Use the breadcrumbs to <b>go back to products</b>.")),
     position: "bottom"
 },
 ...tour.stepUtils.goBackBreadcrumbsMobile(
-        _t("Use the breadcrumbs to <b>go back to products</b>."),
+        Markup(_t("Use the breadcrumbs to <b>go back to products</b>.")),
         undefined,
         ".breadcrumb-item.active:contains('Bill of Materials')",
         ".breadcrumb-item.active:contains('the_flow.product')"
@@ -432,15 +433,15 @@ tour.stepUtils.autoExpandMoreButtons('.o_form_readonly'),
     content: _t('Go back to the home menu'),
     position: 'bottom',
 },
-...tour.stepUtils.goToAppSteps('crm.crm_menu_root', _t('Organize your sales activities with the <b>CRM app</b>.')),
+...tour.stepUtils.goToAppSteps('crm.crm_menu_root', Markup(_t('Organize your sales activities with the <b>CRM app</b>.'))),
 {
     trigger: ".o-kanban-button-new",
     extra_trigger: '.o_opportunity_kanban',
-    content: _t("Click here to <b>create your first opportunity</b> and add it to your pipeline."),
+    content: Markup(_t("Click here to <b>create your first opportunity</b> and add it to your pipeline.")),
     position: "bottom"
 }, {
     trigger: ".o_kanban_quick_create input[name='name']",
-    content: _t("<b>Choose a name</b> for your opportunity."),
+    content: Markup(_t("<b>Choose a name</b> for your opportunity.")),
     position: "right",
     run: "text the_flow.opportunity",
 }, {
@@ -480,12 +481,12 @@ tour.stepUtils.autoExpandMoreButtons('.o_form_readonly'),
 }, {
     trigger: ".o_kanban_quick_create .o_kanban_add",
     extra_trigger: ".o_kanban_quick_create .o_field_widget[name=partner_id] .o_external_button", // Wait name_create
-    content: _t("Click here to <b>add your opportunity</b>."),
+    content: Markup(_t("Click here to <b>add your opportunity</b>.")),
     position: "right",
 }, {
     mobile: false,
     trigger: ".o_kanban_group:first .o_kanban_record:has(span:contains('the_flow.opportunity'))",
-    content: _t("<b>Drag &amp; drop opportunities</b> between columns as you progress in your sales cycle."),
+    content: Markup(_t("<b>Drag &amp; drop opportunities</b> between columns as you progress in your sales cycle.")),
     position: "right",
     run: "drag_and_drop .o_opportunity_kanban .o_kanban_group:eq(2) ",
 }, {
@@ -510,7 +511,7 @@ tour.stepUtils.autoExpandMoreButtons('.o_form_readonly'),
     position: "bottom",
 },
 // Create a quotation
-...tour.stepUtils.statusbarButtonsSteps('New Quotation', _t('<p><b>Create a quotation</p>')),
+...tour.stepUtils.statusbarButtonsSteps('New Quotation', Markup(_t('<p><b>Create a quotation</p>'))),
 {
     mobile: false,
     trigger: ".o_field_widget[name=order_line] .o_field_x2many_list_row_add > a",
@@ -637,11 +638,11 @@ tour.stepUtils.autoExpandMoreButtons('.o_form_readonly'),
     content: _t("Try to send it to email"),
     position: "bottom",
 },
-...tour.stepUtils.statusbarButtonsSteps('Confirm', _t("<p>Confirm this quotation</p>")),
+...tour.stepUtils.statusbarButtonsSteps('Confirm', Markup(_t("<p>Confirm this quotation</p>"))),
 {
     trigger: ".o_form_button_save",
     extra_trigger: ".o_statusbar_status .btn-primary:contains('Sales Order')",
-    content: _t("<p>Save this quotation</p>"),
+    content: Markup(_t("<p>Save this quotation</p>")),
     position: "bottom"
 // Reordering rule
 }, {
@@ -719,12 +720,12 @@ tour.stepUtils.openBuggerMenu("li.breadcrumb-item.active:contains('Inventory Ove
 }, {
     mobile: false,
     trigger: ".o_list_button_save",
-    content: _t("<p>Save this reordering rule</p>"),
+    content: Markup(_t("<p>Save this reordering rule</p>")),
     position: "bottom"
 }, {
     mobile: true,
     trigger: ".o_form_button_save",
-    content: _t("<p>Save this reordering rule</p>"),
+    content: Markup(_t("<p>Save this reordering rule</p>")),
     position: "bottom"
 },
 tour.stepUtils.openBuggerMenu("li.breadcrumb-item.active:contains('OP/')"),
@@ -848,7 +849,7 @@ tour.stepUtils.openBuggerMenu("li.breadcrumb-item.active:contains('Manufacturing
     content: _t('Go back to the home menu'),
     position: 'bottom',
 },
-...tour.stepUtils.goToAppSteps('sale.sale_menu_root', _t('Organize your sales activities with the <b>Sales app</b>.')),
+...tour.stepUtils.goToAppSteps('sale.sale_menu_root', Markup(_t('Organize your sales activities with the <b>Sales app</b>.'))),
 tour.stepUtils.openBuggerMenu("li.breadcrumb-item.active:contains('Quotations')"),
 {
     trigger: ".o_menu_sections button[data-menu-xmlid='sale.sale_order_menu']",
@@ -1031,12 +1032,12 @@ tour.stepUtils.mobileModifier(tour.stepUtils.autoExpandMoreButtons('.o_control_p
 {
     edition: "enterprise",
     trigger: "button.o_reconcile, button.o_validate",
-    content: _t('<p><b>Click on Reconcile</p>'),
+    content: Markup(_t('<p><b>Click on Reconcile</p>')),
     position: "right",
 }, {
     edition: "enterprise",
     trigger: ".button_back_to_statement",
-    content: _t('<p><b>Close this statement.</p>'),
+    content: Markup(_t('<p><b>Close this statement.</p>')),
     position: "bottom",
 }]);
 });