storybookjs / addon-coverage

MIT License
19 stars 9 forks source link

[Bug]:When use '@storybook/addon-coverage' addon, The "DevTools"(Chrome)can not load Sourcemap correctly #35

Open liuxian496 opened 8 months ago

liuxian496 commented 8 months ago

Describe the bug

I upgrade Storybook to "7.6.4 ", then "DevTools"(Chrome)can not load source maps correctly. I created a new project try to reappear.

  1. The new project works correctly.

P1

  1. Then I add '@storybook/addon-coverage' addon to the project. The "DevTools"(Chrome)can not load source maps again.

P2

This is “man.ts” main

  1. When I delete "@storybook/addon-coverage" from "man.ts". The "DevTools" works correctly again.

` import type { StorybookConfig } from "@storybook/react-webpack5";

const config: StorybookConfig = { stories: ["../src/*/.mdx", "../src/*/.stories.@(js|jsx|mjs|ts|tsx)"], addons: [ "@storybook/addon-links", "@storybook/addon-essentials", "@storybook/preset-create-react-app", "@storybook/addon-onboarding", "@storybook/addon-interactions", // '@storybook/addon-coverage' ], framework: { name: "@storybook/react-webpack5", options: { builder: { useSWC: true, }, }, }, docs: { autodocs: "tag", }, staticDirs: ["../public"], }; export default config;

`

The “name” component is used by Button component.

name组件使用方式

To Reproduce

No response

System

Storybook Environment Info:

  System:
    OS: macOS 13.6.1
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.17.1 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.6.7 - /usr/local/bin/npm <----- active
  Browsers:
    Safari: 17.1
  npmPackages:
    @storybook/addon-coverage: ^1.0.0 => 1.0.0 
    @storybook/addon-essentials: ^7.6.4 => 7.6.4 
    @storybook/addon-interactions: ^7.6.4 => 7.6.4 
    @storybook/addon-links: ^7.6.4 => 7.6.4 
    @storybook/addon-onboarding: ^1.0.9 => 1.0.9 
    @storybook/blocks: ^7.6.4 => 7.6.4 
    @storybook/preset-create-react-app: ^7.6.4 => 7.6.4 
    @storybook/react: ^7.6.4 => 7.6.4 
    @storybook/react-webpack5: ^7.6.4 => 7.6.4 
    @storybook/test: ^7.6.4 => 7.6.4 
    @storybook/test-runner: ^0.16.0 => 0.16.0 
    eslint-plugin-storybook: ^0.6.15 => 0.6.15 
    storybook: ^7.6.4 => 7.6.4

Additional context

No response

liuxian496 commented 8 months ago

I change ”storybook/addon-coverage“ to version 0.0.9. The "DevTools"(chrome) worked correctly.

r1m commented 6 months ago

I tried downgrading to 0.0.8. I still have issues with incorrect sourcemaps. I'm using Webcomponents+vite. If I remove the addon, sourcemap is correct.

r1m commented 5 months ago

Same with storybook/addon-coverage 1.0.1, storybook 8.0.0 and vite. My current workaround is to remove coverage on storybook dev

// in package.json scripts
"storybook": "VITE_COVERAGE=false storybook dev -p 6006",
liuxian496 commented 5 months ago

I upgrade storybook to the v8.0.4, and the 『@storybook/addon-coverage』 version is "1.0.1", the problem is still not solved. Changed "storybook/addon-coverage“ to version 0.0.9 is not worked in storybook v8.0.4.

liuxian496 commented 5 months ago

I upgrade the project with vite, the "DevTools"(chrome) worked correctly. Storybook is 8.0.4. 『@storybook/addon-coverage』 version is "1.0.1". ![Uploading new.jpg…]()

jaknas commented 4 months ago

In my case, with Storybook 8 and @storybook/addon-coverage@1.0.3 I had to change configuration as pointed in the README:

        {
            name: '@storybook/addon-coverage',
            options: {
                istanbul: {
                    // Fixes https://github.com/storybookjs/addon-coverage/issues/35
                    include: ['**/stories/**'],
                },
            },
        },

After adding it, now sourcemaps are showing up correctly in devtools.

EDIT: nevermind, this actually breaks code coverage collection completely.

jaknas commented 2 months ago

This was fixed for me with https://github.com/storybookjs/addon-coverage/releases/tag/v1.0.4 version.