shorten_expanded: remove loading=lazy from images if enabled

2 files changed, 17 insertions, 2 deletions

diff --git a/plugins/shorten_expanded/init.js b/plugins/shorten_expanded/init.js
index 587fcea42..30bfac6ba 100644
--- a/plugins/shorten_expanded/init.js
+++ b/plugins/shorten_expanded/init.js
@@ -37,7 +37,7 @@ require(['dojo/_base/kernel', 'dojo/ready'], function  (dojo, ready) {
 
 						c_inner.innerHTML = `<div class="content-shrink-wrap">
 							${c_inner.innerHTML}
-							${tmp.innerHTML}</div>							
+							${tmp.innerHTML}</div>
 							<button dojoType="dijit.form.Button" class="alt-info expand-prompt" onclick="return Plugins.Shorten_Expanded.expand('${row.id}')" href="#">
 								${__("Click to expand article")}</button>`;
 
diff --git a/plugins/shorten_expanded/init.php b/plugins/shorten_expanded/init.php
index 64b4ad7ab..f816a838d 100644
--- a/plugins/shorten_expanded/init.php
+++ b/plugins/shorten_expanded/init.php
@@ -11,6 +11,21 @@ class Shorten_Expanded extends Plugin {
 	function init($host) {
 		$this->host = $host;
 
+		$host->add_hook($host::HOOK_SANITIZE, $this);
+	}
+
+	// native lazy loading messes with plugin height calculation because images get loaded
+	// after headline is actually rendered (off screen) so we force disable it
+	function hook_sanitize($doc) {
+		$xpath = new DOMXPath($doc);
+
+		$entries = $xpath->query('(//*[@loading="lazy"])');
+
+		foreach ($entries as $entry) {
+			$entry->removeAttribute("loading");
+		}
+
+		return $doc;
 	}
 
 	function get_css() {
@@ -25,4 +40,4 @@ class Shorten_Expanded extends Plugin {
 		return 2;
 	}
 
-}
\ No newline at end of file
+}