[FIX] website: show thumbnails for img gallery in tabs snippet

- Go to the website
- Drag a "Tabs" block on the page, you will have 3 example tabs
- Click on the tab "Contact" and drag in the block "Image Gallery"
- Add multiple images to the image gallery
- Click on one of the other tabs so that the image gallery is hidden
- Save

The image gallery do not have the thumbails anymore.
This occurs because when the carousel-indicator is hidden, jquery is not
able to fetch its real length, so no icons are added.

opw-2438513

closes odoo/odoo#66197

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

1 files changed, 12 insertions, 1 deletions

diff --git a/addons/website/static/src/snippets/s_image_gallery/000.js b/addons/website/static/src/snippets/s_image_gallery/000.js
index be0553aa56a..b86fbff652f 100644
--- a/addons/website/static/src/snippets/s_image_gallery/000.js
+++ b/addons/website/static/src/snippets/s_image_gallery/000.js
@@ -86,7 +86,18 @@ const GallerySliderWidget = publicWidget.Widget.extend({
         this.$prev = this.$indicator.find('li.o_indicators_left').css('visibility', ''); // force visibility as some databases have it hidden
         this.$next = this.$indicator.find('li.o_indicators_right').css('visibility', '');
         var $lis = this.$indicator.find('li[data-slide-to]');
-        var nbPerPage = Math.floor(this.$indicator.width() / $lis.first().outerWidth(true)) - 3; // - navigator - 1 to leave some space
+        let indicatorWidth = this.$indicator.width();
+        if (indicatorWidth === 0) {
+            // An ancestor may be hidden so we try to find it and make it
+            // visible just to take the correct width.
+            const $indicatorParent = this.$indicator.parents().not(':visible').last();
+            if (!$indicatorParent[0].style.display) {
+                $indicatorParent[0].style.display = 'block';
+                indicatorWidth = this.$indicator.width();
+                $indicatorParent[0].style.display = '';
+            }
+        }
+        let nbPerPage = Math.floor(indicatorWidth / $lis.first().outerWidth(true)) - 3; // - navigator - 1 to leave some space
         var realNbPerPage = nbPerPage || 1;
         var nbPages = Math.ceil($lis.length / realNbPerPage);