Modal wrongly adding right padding due to window.innerWidth not returning the right value

Created by: yusufhm

I've been having an issue with a project, where a right padding is being adding to a full-width modal, but only on Windows Chrome interestingly.

While doing a search, I came across a similar issue which did not help.

However I decided to look into where that padding gets added in modal.js; it seems to happen in the _adjustDialog method which uses the _checkScrollbar method - this line specifically - to know whether the body is overflowing. It uses window.innerWidth to do that which, when I checked in my console, was giving a different value than expected (again, only on Windows).

After some research, I found this post which explained why that value could be wrong, and what to use instead: window.visualViewport.width. In our case, it would be Math.round(window.visualViewport.width) since we're also rounding the other value. I've tested that locally and it seems to be working for our scenario, but I'm not sure if it would break other things.