Skip to content

Bug: mount(...) is not available on the server error when running tests after a fresh install #579

@evert1989

Description

@evert1989

Summary

Running npm test after a fresh install using npx sv create my-app will have a failing test.

FAIL   client  src/routes/page.svelte.test.ts > /+page.svelte > should render h1
Svelte error: lifecycle_function_unavailable
`mount(...)` is not available on the server
https://svelte.dev/e/lifecycle_function_unavailable
 ❯ Module.lifecycle_function_unavailable node_modules/svelte/src/internal/server/errors.js:9:16
      7|  */
      8| export function lifecycle_function_unavailable(name) {
      9|  const error = new Error(`lifecycle_function_unavailable\n\`${name}(...)\` is not available on the server\nhtt…
       |                ^
     10|
     11|  error.name = 'Svelte error';
 ❯ Module.mount node_modules/svelte/src/index-server.js:25:4
 ❯ mount node_modules/@testing-library/svelte/src/core/modern.svelte.js:27:28
 ❯ render node_modules/@testing-library/svelte/src/pure.js:75:26
 ❯ src/routes/page.svelte.test.ts:8:3

Here are the hardware/software specs:

  • Apple M3 Pro
  • Node: v23.11.1
  • NPM: 10.9.2

Reproduction steps

  • npx sv create my-app
    • add vitest and playwright to the project
  • cd my-app
  • npm test

Relevant files

  • vite.config.ts
import { svelteTesting } from '@testing-library/svelte/vite';
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';

export default defineConfig({
  plugins: [sveltekit()],
  test: {
    workspace: [
      {
        extends: './vite.config.ts',
        plugins: [svelteTesting()],
        test: {
          name: 'client',
          environment: 'jsdom',
          clearMocks: true,
          include: ['src/**/*.svelte.{test,spec}.{js,ts}'],
          exclude: ['src/lib/server/**'],
          setupFiles: ['./vitest-setup-client.ts']
        }
      },
      {
        extends: './vite.config.ts',
        test: {
          name: 'server',
          environment: 'node',
          include: ['src/**/*.{test,spec}.{js,ts}'],
          exclude: ['src/**/*.svelte.{test,spec}.{js,ts}']
        }
      }
    ]
  },
});

Expected behaviour

All tests succeed when doing a clean install

Actual behaviour

The unit test for +page.svelte fails

Current way to fix it manually

Adding the following to the vite.config.ts fixes the issue.

resolve: process.env.VITEST ? { conditions: ['browser'] } : undefined

Extra suggestion

There's a deprecation warning when running tests

 DEPRECATED  The `workspace` option is deprecated and will be removed in the next major. To hide this warning, rename `workspace` option to `projects`.

This can be resolved by chaning workspace to projects

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions