Repository: storybook
Issue: Storybook addon source code not working 
Labels: bug,addon: storysource

**Describe the bug**
Storybook addon is not showing the code. I have had a look at issue [3626](https://github.com/storybookjs/storybook/issues/3626)as well. 
![Screenshot 2021-08-10 at 10 04 47](https://user-images.githubusercontent.com/54642337/128839638-b84ae4a4-a057-414c-928e-b6f8ae23d6ef.png)



**To Reproduce**
here is our load-stories.js file 
`/* global module */
import * as React from 'react';
import {storiesOf} from '@storybook/react';
import {styled} from '../src/utils/style';

const req = require.context('../src', true, /\.scenario\.tsx$/);
const scenarios = req.keys().map(req);
import {MediaQueryProvider} from '../src/utils/hooks';

const unlimitedScenarios = [
  'grid',
  'card',
  'drawer',
  'modal',
  'image',
  'image-e2e',
];

const Container = styled.div`
  max-width: 1024px;
  max-height: 768px;
  overflow: hidden;
`;
const LimitSizeDecorator = storyFn => <Container>{storyFn()}</Container>;
const MediaQueryDecorator = storyFn => (
  <MediaQueryProvider>{storyFn()}</MediaQueryProvider>
);
const NoDecorator = storyFN => storyFN();

scenarios.reduce((storybookStories, scenario) => {
  const {
    title: componentTitle,
    children: stories,
    parameters,
  } = scenario.default;
  if (!stories) return;

  const decorator = unlimitedScenarios.includes(componentTitle)
    ? NoDecorator
    : LimitSizeDecorator;
  stories.map(story => {
    const {storyName, storyFn, parameters} = story;
    const shouldDisableMQDecorator =
      parameters && parameters.disableMediaQueryDecorator;

    storiesOf('NewsKit Light/' + componentTitle, module)
      .addDecorator(
        shouldDisableMQDecorator ? NoDecorator : MediaQueryDecorator,
      )
      .addDecorator(decorator)
      .add(storyName, storyFn, parameters);
    return storybookStories;
  });
}, storiesOf('NewsKit Light', module));
`
and our main.js 
`const path = require('path');

const toPath = _path => path.join(process.cwd(), _path);

module.exports = {
  stories: ['./load-stories.js'],
  addons: [
    '@storybook/addon-links',
    {
      name: '@storybook/addon-essentials',
      options: {
        docs: false,
        controls: false,
        actions: false,
      },
    },
    'storybook-addon-performance/register',
    {
      name: '@storybook/addon-storysource',
      options: {
        
        rule: {
          test: [/\.scenario\.tsx$/], 
          include: [path.resolve(__dirname, '../src')],
        },
        loaderOptions: {
          parser: 'typescript', //This might not be needed
          prettierConfig: { printWidth: 80, singleQuote: false },
        },
      },
    }, 
  ],
  // https://github.com/storybookjs/storybook/issues/13277
  // Remove Emotion aliases once the issue above is resolved
  webpackFinal: async config => {
    // These dependencies are not transpiled so they do not work on IE11
    // that's why we need to exclude them  (include in transpilation)
    config.module.rules[0].exclude = /node_modules\/(?!(yup|react-hook-form|goober)\/).*/;

    return {
      ...config,
      module: {
        rules: [...config.module.rules],
      },
      resolve: {
        ...config.resolve,
        alias: {
          ...config.resolve.alias,
          '@emotion/styled': toPath('node_modules/@emotion/styled'),
          '@emotion/provider': toPath('node_modules/@emotion/provider'),
          '@emotion/core': toPath('node_modules/@emotion/react'),
          'emotion-theming': toPath('node_modules/@emotion/react'),
          'babel-plugin-emotion': toPath('node_modules/@emotion/babel-plugin'),
        },
      },
    };
  },
  typescript: {
    reactDocgen : false // added to negate https://github.com/styleguidist/react-docgen-typescript/issues/356
  }
};
`
all our stories are kept in separately with their components hence why we have `test: [/\.scenario\.tsx$/], `
To test i did `include: [path.resolve(__dirname, './load-stories.js')],` instead and this is the only source code that ends up showing in the story tab on storybook. But it ends up showing just all of that files code.


**System**
Environment Info:
  System:
    OS: macOS 11.3
    CPU: (8) x64 Intel(R) Core(TM) i7-8557U CPU @ 1.70GHz
  Binaries:
    Node: 14.16.1 - /usr/local/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn
    npm: 7.7.6 - /usr/local/bin/npm
  Browsers:
    Chrome: 92.0.4515.131
    Safari: 14.1

**Additional context**
If anyone could offer some advice i would be grateful thank you