Skip to content

[Bug]: addBasePathToHrefAndSrc preprocessor mangles <a href={...}> expression-form attributes when deployment.basePath is set #3303

Description

@Etumos

Describe the bug

The addBasePathToHrefAndSrc Svelte markup preprocessor in @evidence-dev/sdk silently mangles <a href={...}> (and <img src={...}>) attributes that use the unquoted curly-brace expression form when deployment.basePath is configured.

The regex used to find href/src attributes is not aware of Svelte's {...} expression syntax — it captures only the literal { character and prepends basePath to it. The output is invalid markup like href=/base/{'/foo'}, which breaks SvelteKit prerender with 500s.

The processor's spec file (addBasePathToHrefAndSrc.spec.js) covers double-quoted, single-quoted, and unquoted-literal forms but has no test case for the href={...} expression form, so the behaviour is effectively undefined.

I intend to submit a PR if the maintainers agree on a fix direction (see "Suggested fix options" below).

Steps to Reproduce

  1. Set deployment.basePath: '/base' in your Evidence config.

  2. Create a minimal pages/+page.md:

    ---
    title: Repro
    ---
    
    <a href={'/foo'}>foo</a>
  3. Run npm run build.

  4. Inspect the generated route output (or run the build server) — the href attribute is mangled to something like href=/base/{'/foo'} and SvelteKit prerender returns 500.

The buggy regex is at:
packages/lib/sdk/src/build-dev/svelte/processors/addBasePathToHrefAndSrc/addBasePathToHrefAndSrc.js:16

const regex = /(href|src)=['"]?([^'">= ]*)['"]?/g;

For href={'/foo'} the capture group [^'">= ]* greedily matches { and stops at the next ' (in the exclusion class). The processor then calls addBasePath('{', cfg) and emits /base/{.

System Info

  System:
    OS: macOS 26.4.1
    CPU: (14) arm64 Apple M4 Pro
    Memory: 24.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 25.9.0
    npm: 11.12.1
    pnpm: 10.33.2
  npmPackages:
    @evidence-dev/sdk: 4.0.2
    @evidence-dev/core-components: 5.4.2
    @evidence-dev/evidence: 40.1.8
    @evidence-dev/preprocess: 6.0.7
    @evidence-dev/universal-sql: 3.0.1
    svelte: 4.2.19
    @sveltejs/kit: 2.8.4

Severity

serious, but I can work around it

Suggested fix options

  1. Skip preprocessing when the captured value starts with { and let Svelte handle the expression at runtime.
  2. Detect a leading { and emit a build-time warning instructing developers to use the quoted-with-interpolation form (href="{...}").
  3. Make the regex Svelte-attribute-aware so {...} expressions are matched as a single unit.

Workaround used downstream

We standardised on the quoted-with-interpolation form (href="{somePath}") instead of the expression form (href={somePath}) and added a CI lint to enforce it. The silent mangling is the surprising part — an explicit error or warning would have saved a long debugging session.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions