close
  • English
  • Rslib

    This guide covers how to integrate Rstest with Rslib for seamless testing in your Rslib projects.

    Quick start

    New project

    Create a new Rslib + Rstest project. Add the --tools rstest flag when creating:

    npx create-rslib --template react-ts --tools rstest --dir my-project

    The scaffold includes Rstest and demo tests. Run them with npm run test.

    Existing project

    To add Rstest to an existing project, follow the Quick Start to install and set up test scripts.

    Reuse Rslib config

    @rstest/adapter-rslib is an official adapter that allows Rstest to automatically inherit test-relevant configuration from your existing Rslib config file. This keeps your test environment aligned with your build setup without carrying over options that only matter to build output.

    Install adapter

    npm
    yarn
    pnpm
    bun
    deno
    npm add @rstest/adapter-rslib -D

    Extend your config

    Using the withRslibConfig function from the adapter, you can extend your Rstest configuration from the Rslib config file.

    import { defineConfig } from '@rstest/core';
    import { withRslibConfig } from '@rstest/adapter-rslib';
    
    export default defineConfig({
      extends: withRslibConfig(),
      // Additional Rstest-specific configuration
    });

    This will automatically:

    • Load your rslib.config.ts file
    • Extract and map test-relevant Rslib options to Rstest configuration
    • Merge with any additional Rstest config you provide
    • Add the loaded Rslib config file to forceRerunTriggers, so --changed runs the full test suite when that config changes

    When performance.buildCache is enabled in your Rslib config, withRslibConfig() passes it through to Rstest and Rstest will still append its own cache defaults, such as runtime digest inputs and config-file-based invalidation.

    If your Rslib config does not enable performance.buildCache, Rstest keeps it disabled by default. Enable it explicitly in your Rstest config when you want persistent cache for test builds:

    import { defineConfig } from '@rstest/core';
    import { withRslibConfig } from '@rstest/adapter-rslib';
    
    export default defineConfig({
      extends: withRslibConfig(),
      performance: {
        buildCache: true,
      },
    });

    The adapter does not reuse the entire Rslib config as-is. It keeps the parts that matter for test execution, such as module resolution, transforms, CSS Modules, decorator-related settings, static asset handling, and target, and automatically drops unmapped fields like dev, server, and html, along with other options that only exist for dev server, page entry, or build output.

    By default, the adapter uses process.cwd() to resolve the Rslib config. If your config lives elsewhere, you can use the cwd option. See API for more details.

    API

    withRslibConfig(options)

    Returns a configuration function that loads Rslib config and converts it to Rstest configuration.

    cwd

    • Type: string
    • Default: process.cwd()

    The cwd is the working directory to resolve the Rslib config file.

    When your Rslib config is in a different directory or you are running tests in a monorepo (where your process.cwd() is not your config directory), you can specify the cwd option to resolve the Rslib config file from a different directory.

    export default defineConfig({
      extends: withRslibConfig({
        cwd: './packages/my-lib',
      }),
    });

    configPath

    • Type: string
    • Default: './rslib.config.ts'

    Path to rslib config file.

    libId

    • Type: string
    • Default: undefined

    The lib config id in lib field to use. Set to a string to use the lib config with matching id.

    By default, the adapter uses the common configuration from Rslib. If your Rslib config has multiple lib configurations:

    // rslib.config.ts
    export default defineConfig({
      lib: [
        {
          id: 'core',
          format: 'esm',
          dts: true,
          source: {
            define: {
              IS_CORE: true,
            },
          },
        },
        {
          id: 'utils',
          format: 'esm',
          source: {
            define: {
              IS_CORE: false,
            },
          },
        },
      ],
      // shared config
    });

    You can then reference specific lib configurations in your Rstest config. Rstest will adapt the Rslib shared configuration and the lib configuration with a matching libId to Rstest format.

    This still does not copy the whole lib config verbatim. The adapter only takes the lib's source, output, tools, plugins, and resolve fields that are relevant to test execution, then merges them with the shared config before converting the result to Rstest format.

    // For testing the 'core' environment
    export default defineConfig({
      extends: withRslibConfig({
        libId: 'core',
      }),
      // core-specific test config
    });

    When you need to test multiple parts of your application with different configurations independently, you can define multiple Rstest projects. Each project can extend a specific lib configuration by setting the libId option.

    export default defineConfig({
      projects: [
        {
          extends: withRslibConfig({ libId: 'node' }),
          include: ['tests/node/**/*.{test,spec}.?(c|m)[jt]s'],
        },
        {
          extends: withRslibConfig({ libId: 'react' }),
          include: ['tests/react/**/*.{test,spec}.?(c|m)[jt]s?(x)'],
        },
      ],
    });

    modifyLibConfig

    • Type: (config: RslibConfig) => RslibConfig | void
    • Default: undefined

    Modify the Rslib config before it gets converted to Rstest config:

    export default defineConfig({
      extends: withRslibConfig({
        modifyLibConfig: (libConfig) => {
          delete libConfig.source?.define;
          return libConfig;
        },
      }),
    });

    Configuration mapping

    The adapter automatically maps these Rslib options to Rstest:

    Only the fields listed below are inherited. Rslib options that are not listed are ignored by default, which means test-irrelevant sections such as dev, server, and html are automatically pruned during conversion.

    Rslib optionRstest equivalentNotes
    rootrootProject root directory
    lib.id selected by libIdnameSelected library identifier
    pluginspluginsPlugin configuration
    source.decoratorssource.decoratorsDecorator support
    source.assetsIncludesource.assetsIncludeAdditional static asset patterns
    source.definesource.defineGlobal constants
    source.includesource.includeSource inclusion patterns
    source.excludesource.excludeSource exclusion patterns
    source.transformImportsource.transformImportOn-demand import transform rules
    source.tsconfigPathsource.tsconfigPathTypeScript config path
    resolveresolveModule resolution
    output.cssModulesoutput.cssModulesCSS modules configuration
    output.moduleoutput.moduleUses output.module, or falls back to lib.format
    tools.rspacktools.rspackRspack configuration
    tools.swctools.swcSWC configuration
    tools.bundlerChaintools.bundlerChainBundler chain configuration
    output.targettestEnvironment'happy-dom' for web, 'node' for node and other targets

    Debug config

    To see the resolved configuration returned by the adapter, wrap it and log the result:

    export default defineConfig({
      extends: async (user) => {
        const config = await withRslibConfig({ libId: 'react' })(user);
        console.log('Extended config:', JSON.stringify(config, null, 2));
        return config;
      },
    });