From d77e7f9472bf243a996b88b4de3b6a5ef8be7f33 Mon Sep 17 00:00:00 2001
From: Thibault Libioulle <tle@odoo.com>
Date: Fri, 18 Feb 2022 09:01:13 +0000
Subject: [PATCH] [IMP] website_sale: keep the cart quantity up-to-date

This commit updates the cart quantity even if the html page comes from
browser cache, i.e. the user comes back to a previous page with the
browser back method.

task-2741846

closes odoo/odoo#84861

Signed-off-by: Yannick Tivisse (yti) <yti@odoo.com>
---
 addons/website_sale/controllers/main.py       |  5 +++
 .../static/src/js/website_sale.js             | 41 +++++++++++++++++++
 2 files changed, 46 insertions(+)

diff --git a/addons/website_sale/controllers/main.py b/addons/website_sale/controllers/main.py
index 6d57b25ad29..61c5c925269 100644
--- a/addons/website_sale/controllers/main.py
+++ b/addons/website_sale/controllers/main.py
@@ -603,6 +603,11 @@ class WebsiteSale(http.Controller):
         assert layout_mode in ('grid', 'list'), "Invalid shop layout mode"
         request.session['website_sale_shop_layout_mode'] = layout_mode
 
+    @http.route(['/shop/cart/quantity'], type='json', auth="public", methods=['POST'], website=True, csrf=False)
+    def cart_quantity(self):
+        cart = request.website.sale_get_order()
+        return cart and cart.cart_quantity or 0
+
     # ------------------------------------------------------
     # Checkout
     # ------------------------------------------------------
diff --git a/addons/website_sale/static/src/js/website_sale.js b/addons/website_sale/static/src/js/website_sale.js
index c2cb2d2ef63..194c3cd627b 100644
--- a/addons/website_sale/static/src/js/website_sale.js
+++ b/addons/website_sale/static/src/js/website_sale.js
@@ -21,6 +21,13 @@ publicWidget.registry.websiteSaleCartLink = publicWidget.Widget.extend({
     init: function () {
         this._super.apply(this, arguments);
         this._popoverRPC = null;
+        this._onVisibilityChange = this._onVisibilityChange.bind(this);
+    },
+    /**
+     * @override
+     */
+    willStart() {
+        return Promise.all([this._super.apply(this, arguments), this._updateCartQuantityValue()]);
     },
     /**
      * @override
@@ -37,8 +44,17 @@ publicWidget.registry.websiteSaleCartLink = publicWidget.Widget.extend({
             placement: 'auto',
             template: '<div class="popover mycart-popover" role="tooltip"><div class="arrow"></div><h3 class="popover-header"></h3><div class="popover-body"></div></div>'
         });
+        window.addEventListener('visibilitychange', this._onVisibilityChange);
+        this._updateCartQuantityText();
         return this._super.apply(this, arguments);
     },
+    /**
+     * @override
+     */
+    destroy() {
+        window.removeEventListener('visibilitychange', this._onVisibilityChange);
+        this._super(...arguments);
+    },
 
     //--------------------------------------------------------------------------
     // Handlers
@@ -101,6 +117,31 @@ publicWidget.registry.websiteSaleCartLink = publicWidget.Widget.extend({
             });
         }
     },
+    /**
+     * @private
+     * @param {Event} ev
+     */
+    _onVisibilityChange(ev) {
+        if (ev.target.visibilityState === 'visible'){
+            this._updateCartQuantityValue().then(this._updateCartQuantityText.bind(this));
+        }
+    },
+    /**
+     * @private
+     */
+    _updateCartQuantityValue() {
+        return this._rpc({route: "/shop/cart/quantity"}).then((cartQty) => {
+            this.cartQty = cartQty;
+        });
+    },
+    /**
+     * @private
+     */
+    _updateCartQuantityText() {
+        if (this.cartQty !== undefined) {
+            this.el.querySelector('.my_cart_quantity').innerText = this.cartQty;
+        }
+    }
 });
 });