@speedkit/cli 4.20.0 → 4.20.2

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [4.20.2](https://gitlab.orestes.info/baqend/speed-kit-cli/compare/v4.20.1...v4.20.2) (2026-08-07)
+
+
+### Bug Fixes
+
+* **onboarding:** partial variations local mode ([bf809b1](https://gitlab.orestes.info/baqend/speed-kit-cli/commit/bf809b10b3f6ef8918675971ee950735c3250213))
+
+## [4.20.1](https://gitlab.orestes.info/baqend/speed-kit-cli/compare/v4.20.0...v4.20.1) (2026-08-07)
+
+
+### Bug Fixes
+
+* **customer-config:** marker detectDevice reads the passed doc, not document ([6f1b697](https://gitlab.orestes.info/baqend/speed-kit-cli/commit/6f1b697b52cc6786c7e975edfcbc85c52750749b))
+
 # [4.20.0](https://gitlab.orestes.info/baqend/speed-kit-cli/compare/v4.19.0...v4.20.0) (2026-08-07)
 
 

package/README.md

@@ -21,7 +21,7 @@ $ npm install -g @speedkit/cli
 $ sk COMMAND
 running command...
 $ sk (--version)
-@speedkit/cli/4.20.0 linux-x64 node-v22.23.2
+@speedkit/cli/4.20.2 linux-x64 node-v22.23.2
 $ sk --help [COMMAND]
 USAGE
   $ sk COMMAND

package/dist/services/customer-config/templates/config_SpeedKit.js.hbs

@@ -34,14 +34,23 @@
 
 {{#if isShopify}}
 import { ShopifyPlugin } from "speed-kit-config/ShopifyPlugin";
+{{/if}}
+{{#if addSSR}}
+import { SSRPlugin } from "speed-kit-config/SSRPlugin";
+{{/if}}
 
 (function() {
+{{#if isShopify}}
   SpeedKit.configPlugins = SpeedKit.configPlugins || [];
   SpeedKit.configPlugins.push(new ShopifyPlugin());
-
-{{else}}
-(function() {
 {{/if}}
+{{#if addSSR}}
+{{#unless isShopify}}
+  SpeedKit.configPlugins = SpeedKit.configPlugins || [];
+{{/unless}}
+  SpeedKit.configPlugins.push(new SSRPlugin());
+{{/if}}
+
   var ENABLED_HOSTS_CONFIGS = [
     // Production:
     {
@@ -98,15 +107,20 @@ import { ShopifyPlugin } from "speed-kit-config/ShopifyPlugin";
     rumTracking: true,
 {{#if addDeviceDetection}}
   {{#unless addSSR}}
+    // Server-side responsive: origin returns different HTML per device (UA-keyed).
     userAgentDetection: true,
     detectDevice: function(doc) {
-      // TODO: adjust condition to your needs
+      // TODO: set a marker present only in the mobile variation. Read it from `doc`.
       return doc.querySelector('<mobile-specific-element>') ? "mobile" : "desktop";
     },
   {{/unless}}
   {{#if addSSR}}
-    customDevice: () => {
-      return customDevice();
+    // SSR: pick the device by viewport width; SSRPlugin (above) handles resize/zoom/bfcache.
+    detectDevice: function(doc) {
+      // TODO: set the real breakpoint — discover it, don't guess (tools/sk-breakpoints.mjs).
+      var width = document.documentElement.clientWidth;
+      if (!width) return null;
+      return width <= 820 ? "mobile" : "desktop";
     },
   {{/if}}
 {{/if}}
@@ -458,29 +472,6 @@ import { ShopifyPlugin } from "speed-kit-config/ShopifyPlugin";
   // Utility Functions
   //================================================================================
 
-  {{#if addSSR}}
-      function customDevice() {
-        var width = window.innerWidth || 1025;
-        // TODO: adjust devices + breakpoints to your needs
-        if (width <= 820) {
-          return "mobile";
-        }
-        return "desktop";
-      }
-
-      // Re-evaluate device on orientation change and push to service worker
-      window.addEventListener("orientationchange", function () {
-        if (typeof SpeedKit !== "undefined" && SpeedKit.updateDevice) {
-          SpeedKit.updateDevice(customDevice());
-        }
-      });
-      window.addEventListener("resize", function () {
-        if (typeof SpeedKit !== "undefined" && SpeedKit.updateDevice) {
-          SpeedKit.updateDevice(customDevice());
-        }
-      });
-  {{/if}}
-
   function getEnabledHosts(enabledHostsConfigs) {
     var allHosts = [];
     enabledHostsConfigs.forEach(function (enabledHostsConfig) {

package/dist/services/customer-config/templates/config_dynamicBlocks.es6.hbs

@@ -7,12 +7,19 @@
 {{#if addDeviceDetection}}
   {{#unless addSSR}}
     detectDevice: (doc) => {
-      // keep only if you need to check the DOM – for screen width checks the SK config's detectDevice is sufficient
-
-      // TODO: adjust condition to your needs
+      // Only if you need a DOM marker; for width checks the SK config's detectDevice suffices.
+      // TODO: set a marker present only in the mobile variation. Read it from `doc`.
       return doc.querySelector('<mobile-specific-element>') ? "mobile" : "desktop";
     },
   {{/unless}}
+  {{#if addSSR}}
+    // Mirror config_SpeedKit.js detectDevice — keep the breakpoint identical.
+    detectDevice: (doc) => {
+      let width = document.documentElement.clientWidth;
+      if (!width) return null;
+      return width <= 820 ? "mobile" : "desktop";
+    },
+  {{/if}}
 {{/if}}
     blocks: [
       // TODO: adjust/replace this exemplary list

package/dist/services/onboarding/dashboard/diff-against-current-page.js

@@ -13,8 +13,8 @@ export class DiffAgainstCurrentPage {
     async postDiff(currentHtml, currentUrl, variant = "default", transform = false) {
         this.cli.writeWarning(`received diff for url: ${currentUrl}`);
         this.cli.startAction(`DIFF:FETCH:FILE:${currentUrl}`, `fetch remote`);
-        const originResponse = await this.crawler.fetchRemote(currentUrl, variant);
-        let originHtml = await originResponse?.text();
+        const fetchResult = await this.crawler.fetchRemote(currentUrl, variant);
+        let originHtml = await fetchResult?.response?.text();
         if (!originHtml) {
             this.cli.failAction(`DIFF:FETCH:FILE:${currentUrl}`);
             throw new Error("Could not fetch remote page");

package/dist/services/onboarding/onboarding-model.d.ts

@@ -83,7 +83,7 @@ export type SpeedKitServerConfigVariation = Record<string, {
         accept?: string;
         "user-agent"?: string;
     };
-    queryParams?: [];
+    queryParams?: string[];
     regex?: null | string;
     urlPrefix?: string;
 }>;

package/dist/services/onboarding/virtual-orestes-app/crawler.d.ts

@@ -6,7 +6,10 @@ export declare class Crawler {
     private agentConfig;
     private speedKitServerConfig?;
     constructor(cli: CliService, agentConfig: Agent, speedKitServerConfig?: SpeedKitServerConfig);
-    fetchRemote(originUrl: string, variation: string): Promise<Response>;
+    fetchRemote(originUrl: string, variation: string): Promise<{
+        response: Response;
+        url: string;
+    } | undefined>;
     private setDefaultUserAgent;
     /**
      * Mirrors how the Baqend asset server applies the `variations` block from
@@ -28,8 +31,17 @@ export declare class Crawler {
      *      cookie like `fmarktcookie=${storeId}` becomes
      *      `fmarktcookie=2879130`.
      *   3. Origin-level basic auth fallback (only if no variation matched).
+     *
+     * Returns the (query-param-augmented) origin URL alongside the request init,
+     * so query-param variations like `Sortierung=${sort}` reach the origin.
      */
     private prepareOriginRequest;
+    /**
+     * Applies a matched variation: merges its headers into `init` and appends its
+     * `queryParams` onto `url`, substituting regex named groups (`${name}`) — so
+     * `Sortierung=${sort}` with `{ sort: "3" }` becomes `Sortierung=3`.
+     */
+    private applyVariation;
     /**
      * Replaces `${name}` placeholders in each header value with the matching
      * named capture group from a regex match. Used by `prepareOriginRequest`

package/dist/services/onboarding/virtual-orestes-app/crawler.js

@@ -16,18 +16,21 @@ export class Crawler {
         const headers = {
             "User-Agent": userAgent,
         };
+        // origin URL with the variation's query params applied — returned so callers compare it
+        // (not the bare originUrl) against response.url for redirect detection
+        const { url, init } = this.prepareOriginRequest(originUrl, variation, {
+            headers,
+        });
         const requestInit = {
-            ...this.prepareOriginRequest(originUrl, variation, {
-                headers,
-            }),
+            ...init,
             agent: this.agentConfig,
         };
         const uuid = randomUUID();
-        this.cli.startAction(`DOCUMENTHANDLER:FETCH:${uuid}`, `[documentHandler:fetch]: ${originUrl}`);
-        const fetchResponse = await safe(fetch(originUrl, requestInit));
+        this.cli.startAction(`DOCUMENTHANDLER:FETCH:${uuid}`, `[documentHandler:fetch]: ${url}`);
+        const fetchResponse = await safe(fetch(url, requestInit));
         if (fetchResponse.success === true) {
             this.cli.successAction(`DOCUMENTHANDLER:FETCH:${uuid}`);
-            return fetchResponse.data;
+            return { response: fetchResponse.data, url };
         }
         this.cli.failAction(`DOCUMENTHANDLER:FETCH:${uuid}`, `error while fetching Asset: ${originUrl}`);
         this.cli.writeError(fetchResponse.error);
@@ -62,32 +65,35 @@ export class Crawler {
      *      cookie like `fmarktcookie=${storeId}` becomes
      *      `fmarktcookie=2879130`.
      *   3. Origin-level basic auth fallback (only if no variation matched).
+     *
+     * Returns the (query-param-augmented) origin URL alongside the request init,
+     * so query-param variations like `Sortierung=${sort}` reach the origin.
      */
     prepareOriginRequest(originUrl, variationParameter, init) {
+        const url = new URL(originUrl);
         if (!this.speedKitServerConfig) {
-            return init;
+            return { url: url.toString(), init };
         }
         const variations = this.speedKitServerConfig.speedKit.variations;
-        // Wildcard variation headers apply to every request, regardless of which
+        // Wildcard variation applies to every request, regardless of which
         // specific variation (if any) is requested.
         if (variations?.["*"]) {
-            const config = variations["*"];
-            init.headers = { ...init.headers, ...config.headers };
+            this.applyVariation(url, init, variations["*"], undefined);
         }
         if (!variationParameter) {
-            return init;
+            return { url: url.toString(), init };
         }
         // First-match-wins over the variations in declaration order. Each entry
         // can match by exact key or by its Java-style `regex` field; whichever
-        // entry matches first applies its headers and short-circuits the rest.
+        // entry matches first applies its headers + query params and short-circuits.
         for (const variationKey in variations) {
             if (variationKey === "*") {
                 continue;
             }
             const variationConfig = variations[variationKey];
             if (variationParameter === variationKey) {
-                init.headers = { ...init.headers, ...variationConfig.headers };
-                return init;
+                this.applyVariation(url, init, variationConfig, undefined);
+                return { url: url.toString(), init };
             }
             if (!variationConfig.regex) {
                 continue;
@@ -102,18 +108,35 @@ export class Crawler {
             if (!match) {
                 continue;
             }
-            init.headers = {
-                ...init.headers,
-                ...this.substituteNamedGroups(variationConfig.headers, match.groups),
-            };
-            return init;
+            this.applyVariation(url, init, variationConfig, match.groups);
+            return { url: url.toString(), init };
         }
         // No variation matched: fall back to origin basic auth if configured.
         const authentication = this.prepareAuthRequest(originUrl);
         if (authentication) {
             init.headers["Authorization"] = authentication;
         }
-        return init;
+        return { url: url.toString(), init };
+    }
+    /**
+     * Applies a matched variation: merges its headers into `init` and appends its
+     * `queryParams` onto `url`, substituting regex named groups (`${name}`) — so
+     * `Sortierung=${sort}` with `{ sort: "3" }` becomes `Sortierung=3`.
+     */
+    applyVariation(url, init, variationConfig, groups) {
+        init.headers = {
+            ...init.headers,
+            ...this.substituteNamedGroups(variationConfig.headers, groups),
+        };
+        for (const queryParam of variationConfig.queryParams ?? []) {
+            const substituted = groups
+                ? queryParam.replace(/\$\{(\w+)}/g, (match, name) => groups[name] ?? match)
+                : queryParam;
+            const eq = substituted.indexOf("=");
+            const key = eq === -1 ? substituted : substituted.slice(0, eq);
+            const value = eq === -1 ? "" : substituted.slice(eq + 1);
+            url.searchParams.set(key, value);
+        }
     }
     /**
      * Replaces `${name}` placeholders in each header value with the matching

package/dist/services/onboarding/virtual-orestes-app/index.js

@@ -113,7 +113,10 @@ export class VirtualOrestesApp {
         const variation = UrlObject.searchParams.has("bqvariation")
             ? UrlObject.searchParams.get("bqvariation").trim()
             : "default";
-        const response = await this.crawler.fetchRemote(originUrl, variation);
+        const fetchResult = await this.crawler.fetchRemote(originUrl, variation);
+        const response = fetchResult?.response;
+        // URL we actually fetched (origin + variation query params); used for the redirect check below
+        const fetchedUrl = fetchResult?.url;
         // todo check if we can handle more then htmlResponses
         // only handle html responses
         if (!response?.headers?.get("content-type")?.includes("html")) {
@@ -123,8 +126,8 @@ export class VirtualOrestesApp {
             ?.get("Cache-Control")
             ?.includes("no-store");
         const customHeaders = this.prepareCustomHeaders(originUrl, hasNoStoreFlag);
-        // CDN Redirect
-        if (originUrl !== response.url) {
+        // CDN Redirect — compare the fetched URL, not bare originUrl (variation params aren't a redirect)
+        if (fetchedUrl !== response.url) {
             return this.handleCdnRedirect(customHeaders, response, requestUrl);
         }
         if (response.status > 300 && response.status < 400) {

package/oclif.manifest.json

@@ -1001,5 +1001,5 @@
       ]
     }
   },
-  "version": "4.20.0"
+  "version": "4.20.2"
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@speedkit/cli",
   "description": "Speed Kit CLI",
-  "version": "4.20.0",
+  "version": "4.20.2",
   "author": {
     "name": "Baqend.com",
     "email": "info@baqend.com"