From 2.5.2 csp types in svelte.config.js are broken

[frederikhors]

Describe the bug

After upgrading from kit 2.5.1 to 2.5.2 the follwing svelte.config.js is broken:

import adapter from "@sveltejs/adapter-static";
import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";

/** @type {import('@sveltejs/kit').Config} */
const config = {
  preprocess: vitePreprocess(),

  kit: {
    // ... others

    csp: csp(),
  },
};

export default config;

function csp() {
  if (dev) return;

  let directives = {
    "default-src": ["something"],
    "style-src": ["something", "unsafe-inline"],
    "img-src": ["*", "data:"],
    "connect-src": ["self"],
    "object-src": ["data:"],
    "frame-src": ["data:"],
  };

  return { directives };
}

The error I get from typescript is:

Type '{ directives: { 'default-src': string[]; 'style-src': string[]; 'img-src': string[]; 'connect-src': string[]; 'object-src': string[]; 'frame-src': string[]; }; } | undefined' is not assignable to type '{ mode?: "nonce" | "hash" | "auto" | undefined; directives?: CspDirectives | undefined; reportOnly?: CspDirectives | undefined; } | undefined'.
  Type '{ directives: { 'default-src': string[]; 'style-src': string[]; 'img-src': string[]; 'connect-src': string[]; 'object-src': string[]; 'frame-src': string[]; }; }' is not assignable to type '{ mode?: "nonce" | "hash" | "auto" | undefined; directives?: CspDirectives | undefined; reportOnly?: CspDirectives | undefined; }'.
    The types of 'directives['default-src']' are incompatible between these types.
      Type 'string[]' is not assignable to type '(Source | ActionSource)[]'.
        Type 'string' is not assignable to type 'Source | ActionSource'.ts(2322)

I don't understand how to fix.

Reproduction

I'll post soon.

Logs

No response

System Info

npmPackages:
    @sveltejs/adapter-static: 3.0.1 => 3.0.1
    @sveltejs/kit: 2.5.2 => 2.5.2
    @sveltejs/vite-plugin-svelte: 3.0.2 => 3.0.2
    svelte: 4.2.12 => 4.2.12

Severity

blocking an upgrade

Additional Information

No response

[MathiasWP]

This is because the directive inferred as strings from the csp() method instead of their actual values (usually achieved by doing as const in TypeScript).

SvelteKit seems to have "smart" types for the CSP config, but it's kinda difficult to resolve these when the svelte config is a JS file instead of TS...

[frederikhors]

The jsconfig vs Typescript thing is a mess.