Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

[Help] Code Coverage and instrumenting code so I can merge them with other reports #37

Open
snake-py opened this issue Jan 22, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@snake-py
Copy link

Describe the Issue

I want to merge cumulatively storybook coder coverage reports with reports from vitest.

This one was generated using vitest coverage-final.json
This one was generated using the storybook addon coverage-storybook.json

Here are my configs for vitest

    coverage: {
      all: true,
      clean: false,
      exclude: [
      ...
      ],
      provider: 'istanbul',
      reporter: ['json', 'html']
    }
  },
// my command 
"test:coverage": "vitest --run --coverage",

For storybook I used:

addons: [
 {
      name: '@storybook/addon-coverage',
      options: {
        istanbul: {
          exclude: [
....
          ]
        }
      }
    },
    ]
    "test-storybook:coverage": "test-storybook --coverage --json --coverageDirectory=./coverage",

At the end I use nyc to merge the output files:

"test-all:coverage": "nyc merge coverage coverage/merged/coverage.json && nyc report -t coverage/merged --report-dir coverage/merged --reporter=html --reporter=cobertura",

In my merged coverage report I can then see:

image

However, when looking at only the unit test report, I can see that these lines are being hitted.

It seems that the storybook addon and vitest generate slightly different line and column for the statements.
For example in one component vitest said that there is a stmt on line 38 start at col 18 and ends on the same line.

            "2": {
                "start": {
                    "line": 38,
                    "column": 18
                },
                "end": {
                    "line": 38,
                    "column": null
                }
            },

However, storybook coverage report says the statement is on line 38 in column 2:

      "3": {
        "start": {
          "line": 38,
          "column": 2
        },
        "end": {
          "line": 38,
          "column": null
        }
      },

Steps to reproduce the behavior

  1. Create a vite react project
  2. Setup storybook and react testing library
  3. create code coverage reports with istanbul
  4. create code coverage report with this addon
  5. use nyc to merge them

Expected behavior

That I can somehow define how code is instrumented or which version of Istanbul is used. So I can merge reports from multiple testing tools.

Environment

  • OS: Ubuntu
  • Node.js version: v16.20.0
  • NPM version: ^9

Additional context

Here are the current versions of my package.json

    "vitest": "^0.29.8"
    "@vitest/coverage-istanbul": "^0.34.5",
    // looking at node_modules I can see that coverage-istanbul requires the following:
    "istanbul-lib-coverage": "^3.2.0",
    "istanbul-lib-instrument": "^6.0.0",
    "istanbul-lib-report": "^3.0.1",
    "istanbul-lib-source-maps": "^4.0.1",
    "istanbul-reports": "^3.1.5",


    
    "@storybook/addon-coverage": "^1.0.0",
    // looking at node_modules I can see:
    "istanbul-lib-instrument": "^6.0.1",
    "vite-plugin-istanbul": "^3.0.1" 
    // following vite-plugin-istanbul I can see that it uses:
    "istanbul-lib-instrument": "^5.1.0",

So now I am considering if the issue comes from different versions?

I also posted here about it:
storybookjs/storybook#25667
and commented here:
istanbuljs/nyc#1302

@snake-py snake-py added the bug Something isn't working label Jan 22, 2024
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant