diff --git a/addons/lunch/static/src/js/lunch_controller_common.js b/addons/lunch/static/src/js/lunch_controller_common.js
index e9d86897844..95f3b2bfd6c 100644
--- a/addons/lunch/static/src/js/lunch_controller_common.js
+++ b/addons/lunch/static/src/js/lunch_controller_common.js
@@ -7,6 +7,7 @@ odoo.define('lunch.LunchControllerCommon', function (require) {
 
 var session = require('web.session');
 var core = require('web.core');
+const {Markup} = require('web.utils');
 var LunchWidget = require('lunch.LunchWidget');
 var LunchPaymentDialog = require('lunch.LunchPaymentDialog');
 
@@ -59,14 +60,17 @@ var LunchControllerCommon = {
             },
         });
     },
-    _fetchWidgetData: async function () {
-        this.widgetData = await this._rpc({
+    async _fetchWidgetData() {
+        const widgetData = await this._rpc({
             route: '/lunch/infos',
             params: {
                 user_id: this.searchModel.get('userId'),
                 context: this.context,
             },
         });
+        widgetData.wallet = parseFloat(widgetData.wallet).toFixed(2);
+        (widgetData.alerts || []).forEach(alert => { alert.message = Markup(alert.message); });
+        this.widgetData = widgetData;
     },
     /**
      * Renders and appends the lunch banner widget.
@@ -74,12 +78,10 @@ var LunchControllerCommon = {
      * @private
      */
     _renderLunchWidget: function () {
-        var self = this;
         var oldWidget = this.widget;
-        this.widgetData.wallet = parseFloat(this.widgetData.wallet).toFixed(2);
-        this.widget = new LunchWidget(this, _.extend(this.widgetData, {edit: this.editMode}));
-        return this.widget.appendTo(document.createDocumentFragment()).then(function () {
-            self.$('.o_lunch_content').prepend(self.widget.$el);
+        this.widget = new LunchWidget(this, Object.assign(this.widgetData, {edit: this.editMode}));
+        return this.widget.appendTo(document.createDocumentFragment()).then(() => {
+            this.$('.o_lunch_content').prepend(this.widget.$el);
             if (oldWidget) {
                 oldWidget.destroy();
             }
diff --git a/addons/lunch/static/src/xml/lunch_templates.xml b/addons/lunch/static/src/xml/lunch_templates.xml
index 6cc7872189f..035f5c2da56 100644
--- a/addons/lunch/static/src/xml/lunch_templates.xml
+++ b/addons/lunch/static/src/xml/lunch_templates.xml
@@ -3,7 +3,7 @@
     <span t-name="LunchWidget">
         <t t-foreach="widget.alerts" t-as="alert">
             <div class="alert alert-warning mb-0" role="alert">
-                <t t-raw="alert.message"/> <!-- alert.message is coming from a fields.Html so it should be safe -->
+                <t t-out="alert.message"/>
             </div>
         </t>
         <div class="o_lunch_banner container-fluid">
diff --git a/addons/lunch/static/tests/lunch_list_tests.js b/addons/lunch/static/tests/lunch_list_tests.js
index cca644a52a9..3dbcfabea8f 100644
--- a/addons/lunch/static/tests/lunch_list_tests.js
+++ b/addons/lunch/static/tests/lunch_list_tests.js
@@ -73,11 +73,12 @@ QUnit.module('LunchListView', {
                 position: "after"
             },
             user_location: [2, "Office 2"],
+            alerts: [{id: 42, message: '<b>Warning! Neurotoxin pressure has reached dangerously unlethal levels.</b>'}]
         };
     },
 }, function () {
     QUnit.test('basic rendering', async function (assert) {
-        assert.expect(6);
+        assert.expect(9);
 
         const list = await createLunchView({
             View: LunchListView,
@@ -108,6 +109,11 @@ QUnit.module('LunchListView', {
         assert.containsOnce(list, '.o_lunch_content > span > .o_lunch_banner',
             "should have a 'lunch' banner");
 
+        const $alertMessage = list.$('.alert > *');
+        assert.equal($alertMessage.length, 1);
+        assert.equal($alertMessage.prop('tagName'), 'B');
+        assert.equal($alertMessage.text(), "Warning! Neurotoxin pressure has reached dangerously unlethal levels.")
+
         list.destroy();
     });