Vitest Angular plugin with @storybook/testing-angular package

[dmy-leanix]

Hello!

Trying to use analogjs angular vitest plugin to run my tests on vitest and having the following error:

SyntaxError: Cannot use import statement outside a module
 ❯ ../../../../node_modules/@storybook/testing-angular/dist/testing-angular.cjs.development.js:6:12

This error refers to this package https://www.npmjs.com/package/@storybook/testing-angular

testing-angular.cjs.development.js has the following:

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var tslib = require('tslib');
var core = require('@angular/core'); // This is 6th line
var previewApi = require('@storybook/preview-api');
var rxjs = require('rxjs');
var telejson = require('telejson');
var render = require('@storybook/angular/dist/client/render');
var renderer = require('@storybook/angular/renderer');
var PropertyExtractor = require('@storybook/angular/dist/client/angular-beta/utils/PropertyExtractor');

How can I fix it in config? Currently tried server.deps.inline with different package list - didn't help

Or is it possible to solve that on plugin level? I see there are some @storybook/angular mentions in node_modules/@analogjs/vite-plugin-angular/src/lib/angular-storybook-plugin.js, maybe we can do something like that with the @storybook/testing-angular?

[brandonroberts]

Try adding @storybook/testing-angular to the optimizeDeps.include array in the Storybook vite config.

[dmy-leanix]

This is for different use case... I'm not using storybook config there, that library is to reuse stories in unit tests without serving or building storybook. So, it's for pure vitest run

[brandonroberts]

Ok, you would still add it to the optimizeDeps.include array in the vite/vitest config. Do you have a public test repo?

[dmy-leanix]

@brandonroberts Created a reproducible repository: https://github.com/ydmitry/angular-storybook-vitest-example
To run tests there: npm test

I tried optimizeDeps.include and server.deps.inline so far but with no luck

Thank you for helping with this! 🙏

[dmy-leanix]

@brandonroberts are there updates on supporting @storybook/testing-angular? This would allow to use stories in unit tests with vitest