home.img.component: isSvg() fails when img URL has a ?v=N cache-buster query string #3949

Symptom

HomeImgComponent is supposed to inline local .svg files via v-html so they can read CSS custom properties (Vuetify theme vars like --v-theme-surface, --v-theme-on-surface). When the img prop points at a local SVG with a cache-buster query string, e.g.:

{ img: '/images/trawl-dev-pipeline.svg?v=3', imgMode: 'contain' }

the SVG is not inlined — it falls back to <v-img>, which renders it as a raster-like <img> whose internal CSS vars never resolve. Result: any SVG that depends on rgb(var(--v-theme-...)) renders as solid black in light mode and is unreadable.

Hit while polishing the trawl.me landing page (trawl-dev-pipeline.svg, trawl-business-alert.svg) — the Chrome DevTools MCP inspection confirmed the rect's computedFill was the raw default because the CSS var wasn't resolved.

Root cause

isSvg() checks .endsWith('.svg') on the raw img string, which fails as soon as the URL has ?v=1, ?v=2, or any #fragment:

// src/modules/home/components/utils/home.img.component.vue
isSvg() {
  return this.img && this.img.toLowerCase().endsWith('.svg') && LOCAL_URL_RE.test(this.img);
},

'foo.svg?v=3'.endsWith('.svg') → false, so the inline path is skipped.

History

This was fixed once in #471 (c84391a0), but the fix was lost in the following stack update (#474). The companion skill doc (infra /svg-generator) still documents the expected behavior on line 87 — the code drifted away from the documented contract.

Proposed fix

Strip query + fragment before the extension check:

isSvg() {
  if (!this.img) return false;
  const pathOnly = this.img.split('?')[0].split('#')[0].toLowerCase();
  return pathOnly.endsWith('.svg') && LOCAL_URL_RE.test(this.img);
},

3-line change, no behaviour change for URLs without a query string.

Why we care

Cache-busting with ?v=N is the documented pattern in /svg-generator for forcing a reload after editing a landing-page SVG — without it, Vite/service workers serve a stale copy and you iterate blind. Breaking this round-trip breaks the whole SVG authoring loop.

Downstream

Already applied as a hotfix in comes-io/trawl_vue (feat/landing-polish-v4 branch). Will revert the downstream copy and pull from devkit once this merges.