[Bug] Path Alias Not Resolving

[XelaG]

Describe the bug

When running test runner with flag -c and a custom configuration the path aliases are not resolved even tho webPack aliases are set in said configuration.

Steps to reproduce the behavior

1. test-storybook -c .$pathToCustomConfig
2. Error cannot find module should pop up

Expected behavior

Path to resolve following the webpack configuration

Screenshots and/or logs

storybook main.js

module.exports = {
    stories: ['../src/**/*.stories.new.@(js|jsx|mdx)'],
    addons: [
        '@storybook/addon-essentials',
        '@storybook/addon-a11y',
        'storybook-addon-apollo-client',
        'storybook-addon-designs',
        '@storybook/addon-storysource',
        'storybook-addon-pseudo-states',
        'storybook-addon-next-router',
        '@storybook/addon-interactions',
    ],
    features: {
        storyStoreV7: true,
        postcss: false,
        interactionsDebugger: true,
    },
    webpackFinal: async config => {
        config.resolve.alias = {
            ...config.resolve.alias,
            '@': path.resolve(__dirname, '../src'),
        };
        config.node = {
            fs: 'empty',
            path: 'empty',
        };
        return config;
    },
};

Environment

• OS: Pop OS
• Node.js version: 14.18.0
• NPM version: 6.14.15

Additional context

Found a way to make it work by overriding the test-runner-jest-config.js to resolve path

module.exports = {
    ...getJestConfig(),
    transform: {
        '^.+\\.stories\\.new\\.[jt]sx?$':
            '@storybook/test-runner/playwright/transform',
        '^.+\\.[jt]sx?$': 'babel-jest',
    },
    moduleNameMapper: {
        '^@/(.*)$': '<rootDir>/src/$1',
    },
    modulePathIgnorePatterns: ['.next/', 'cypress'],
};