Bug 1999198 Comment 7 Edit History

Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.

ah sorry, I misread; `saschanaz` mentioned `document.documentElement.clientHeight` - I do see that that value is `24` for me (vs `916` in Chrome).

So yeah, that difference is the key issue here, since it impacts the site's `isVisible` logic, here:
```JavaScript```
			function isVisible(elem) {
				let coords = elem.getBoundingClientRect();
				let windowHeight = document.documentElement.clientHeight;
				// верхний край элемента виден?
				let topVisible = coords.top > 0 && coords.top < windowHeight;
				// нижний край элемента виден?
				let bottomVisible = coords.bottom < windowHeight && coords.bottom > 0;
				return topVisible || bottomVisible;
			}
```

Our small `document.documentElement.clientHeight` causes `isVisible` to return false, which then means the `lazy` attribute never gets removed here:
```JavaScript
if(isVisible(element)) element.classList.remove('lazy'); });
```
which means these thumbnail-divs always have this style applied, which suppresses the image that they would be otherwise trying to render (as a `background-image`):
```CSS
.lazy {
    background-image: none !important;
}
```
ah sorry, I misread; `saschanaz` mentioned `document.documentElement.clientHeight` - I do see that that value is `24` for me (vs `916` in Chrome).

So yeah, that difference is the key issue here, since it impacts the site's `isVisible` logic, here:
```JavaScript
			function isVisible(elem) {
				let coords = elem.getBoundingClientRect();
				let windowHeight = document.documentElement.clientHeight;
				// верхний край элемента виден?
				let topVisible = coords.top > 0 && coords.top < windowHeight;
				// нижний край элемента виден?
				let bottomVisible = coords.bottom < windowHeight && coords.bottom > 0;
				return topVisible || bottomVisible;
			}
```

Our small `document.documentElement.clientHeight` causes `isVisible` to return false, which then means the `lazy` attribute never gets removed here:
```JavaScript
if(isVisible(element)) element.classList.remove('lazy'); });
```
which means these thumbnail-divs always have this style applied, which suppresses the image that they would be otherwise trying to render (as a `background-image`):
```CSS
.lazy {
    background-image: none !important;
}
```

Back to Bug 1999198 Comment 7