From 787655e276b79468fa673401b2792e259128205c Mon Sep 17 00:00:00 2001
From: Krzysztof Kotlarek <kotlarek.krzysztof@gmail.com>
Date: Tue, 29 Nov 2022 11:03:54 +1100
Subject: [PATCH] FIX: consistent narrow desktop width (#19232)

- use client rect instead of innerWidth to determine if screen is narrow
- disable _animate when exit mobile/narrow view
---
 .../javascripts/discourse/app/components/site-header.js       | 4 +---
 app/assets/javascripts/discourse/app/lib/narrow-desktop.js    | 3 ++-
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/components/site-header.js b/app/assets/javascripts/discourse/app/components/site-header.js
index ceba5d0d9ee..73b82710ddc 100644
--- a/app/assets/javascripts/discourse/app/components/site-header.js
+++ b/app/assets/javascripts/discourse/app/components/site-header.js
@@ -367,9 +367,7 @@ const SiteHeaderComponent = MountWidget.extend(
       const menuPanels = document.querySelectorAll(".menu-panel");
 
       if (menuPanels.length === 0) {
-        if (this.site.mobileView || this.site.narrowDesktopView) {
-          this._animate = true;
-        }
+        this._animate = this.site.mobileView || this.site.narrowDesktopView;
         return;
       }
 
diff --git a/app/assets/javascripts/discourse/app/lib/narrow-desktop.js b/app/assets/javascripts/discourse/app/lib/narrow-desktop.js
index 39b15c5d306..5d2a89b98c0 100644
--- a/app/assets/javascripts/discourse/app/lib/narrow-desktop.js
+++ b/app/assets/javascripts/discourse/app/lib/narrow-desktop.js
@@ -5,7 +5,8 @@ const NarrowDesktop = {
 
   init() {
     this.narrowDesktopView =
-      narrowDesktopForced || this.isNarrowDesktopView(window.innerWidth);
+      narrowDesktopForced ||
+      this.isNarrowDesktopView(document.body.getBoundingClientRect().width);
   },
 
   isNarrowDesktopView(width) {