From 47d3aabc16d1e577642cc7dd03905aabc4d59667 Mon Sep 17 00:00:00 2001
From: Niklan <niklanrus@gmail.com>
Date: Wed, 30 Jul 2025 21:08:18 +0500
Subject: [PATCH] Add cache busting query string to drupalSettings and use it
 for ES modules

---
 app/modules/niklan/assets/js/hljs.init.js     | 15 +++++++------
 app/modules/niklan/assets/js/hljs.worker.js   |  6 +++---
 .../Hook/Asset/CacheBustingQuerySetting.php   | 21 +++++++++++++++++++
 3 files changed, 33 insertions(+), 9 deletions(-)
 create mode 100644 app/modules/niklan/src/Hook/Asset/CacheBustingQuerySetting.php

diff --git a/app/modules/niklan/assets/js/hljs.init.js b/app/modules/niklan/assets/js/hljs.init.js
index d74a20b5..f00a0e95 100644
--- a/app/modules/niklan/assets/js/hljs.init.js
+++ b/app/modules/niklan/assets/js/hljs.init.js
@@ -1,5 +1,4 @@
 ((Drupal, once, drupalSettings) => {
-
   let worker;
   let requestId = 0;
   const pendingRequests = new Map();
@@ -9,9 +8,9 @@
       detail: {
         element,
         originalCode: element.textContent,
-        highlightedHTML: html
+        highlightedHTML: html,
       },
-      bubbles: true
+      bubbles: true,
     });
 
   const handleIntersection = (entries) => {
@@ -29,7 +28,8 @@
         requestId: currentRequestId,
         code: codeElement.textContent,
         language: preElement.dataset.language,
-        esModulesBasePath: drupalSettings.highlightJs.esModulesBasePath
+        esModulesBasePath: drupalSettings.highlightJs.esModulesBasePath,
+        cacheBustingQueryString: drupalSettings.cacheQueryBustingString,
       });
     });
   };
@@ -57,8 +57,11 @@
       .from(once('code-highlight', 'pre > code'))
       .forEach(code => observer.observe(code));
 
-    worker = new Worker(drupalSettings.highlightJs.workerPath, { type: 'module' });
-    worker.addEventListener('message', handleWorkerMessage);
+    worker = new Worker(
+      `${drupalSettings.highlightJs.workerPath}?${drupalSettings.cacheQueryBustingString}`,
+      { type: "module" },
+    );
+    worker.addEventListener("message", handleWorkerMessage);
   };
 
 
diff --git a/app/modules/niklan/assets/js/hljs.worker.js b/app/modules/niklan/assets/js/hljs.worker.js
index 7bd2e0be..1ed5a4d9 100644
--- a/app/modules/niklan/assets/js/hljs.worker.js
+++ b/app/modules/niklan/assets/js/hljs.worker.js
@@ -14,13 +14,13 @@ const supportedLanguages = {
 
 onmessage = async (event) => {
   try {
-    const { requestId, code, language, esModulesBasePath } = event.data;
+    const { requestId, code, language, esModulesBasePath, cacheBustingQueryString } = event.data;
 
-    const hljsModule = await import(`${esModulesBasePath}/highlight.min.js`);
+    const hljsModule = await import(`${esModulesBasePath}/highlight.min.js?${cacheBustingQueryString}`);
     const hljs = hljsModule.default;
 
     if (language && supportedLanguages[language]) {
-      const langModule = await import(`${esModulesBasePath}/${supportedLanguages[language]}`);
+      const langModule = await import(`${esModulesBasePath}/${supportedLanguages[language]}?${cacheBustingQueryString}`);
       hljs.registerLanguage(language, langModule.default);
     }
 
diff --git a/app/modules/niklan/src/Hook/Asset/CacheBustingQuerySetting.php b/app/modules/niklan/src/Hook/Asset/CacheBustingQuerySetting.php
new file mode 100644
index 00000000..3d7c4000
--- /dev/null
+++ b/app/modules/niklan/src/Hook/Asset/CacheBustingQuerySetting.php
@@ -0,0 +1,21 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Drupal\niklan\Hook\Asset;
+
+use Drupal\Core\Asset\AssetQueryStringInterface;
+use Drupal\Core\Hook\Attribute\Hook;
+
+#[Hook('js_settings_build')]
+final readonly class CacheBustingQuerySetting {
+
+  public function __construct(
+    private AssetQueryStringInterface $queryString,
+  ) {}
+
+  public function __invoke(array &$settings): void {
+    $settings['cacheQueryBustingString'] = $this->queryString->get();
+  }
+
+}