Can't open typescript files

[fernandopasik]

Describe the bug
When opening an lcov.info file from typescript files the main coverage report is generated, but can't open individual files to see detailed file coverage.
Looking at a file in the tree is not a link like in the demo.

To Reproduce
Just open an lcov.info made from typescrip files

Expected behavior
Open detailed file coverage

[eugenezinovyev]

Are you opening the file on the https://lcov-viewer.netlify.app?

[fernandopasik]

Yes, I opened with it and the overview screen show all the coverage, but I can't navigate inside the files, they are not links

[fernandopasik]

To give more context I'm generating the lcov.info file with the new node.js test reporter and tsx loader

node --test --experimental-test-coverage --test-reporter=lcov --test-reporter-destination=coverage/lcov.info --import tsx src/**/*

[fernandopasik]

Sorry, I also tried an lcov.info file generated with jest and also the ts files were not links nor I could dig into detail for each file

[eugenezinovyev]

Right, the issue he it that the lcov file does not contain any source code. Thus, the site cannot show anything. However, there is a package @lcov-viewer/istanbul-report which you can use to generate an HTML report as an output from Jest coverage.
Here is an example of how you can add it to coverage reporters:

// jest.config.js
coverageReporters: [
    // other reporters
    '@lcov-viewer/istanbul-report'
],

[fernandopasik]

Thanks for the suggestion for jest.

I tried also the cli with this command and it generated the same output that the website.

lcov-viewer lcov -o ./coverage ./coverage/lcov.info

Is there a way that I can generate the report that can expand on each file with the cli from the lcov.info file?

[eugenezinovyev]

The CLI is also working with the LCOV file that does not contain any source code and thus the resulting report does not contain the source code as well.

However, there is a way to generate a report with the source code. You can install @lcov-viewer/istanbul-report package, and include it the "coverageReporters" of the Jest configuration.
After that, you can run jest with coverage collection and check the generated report in the coverage folder.

[fernandopasik]

Thank you! ideally I'd love to remove jest and go with the new node.js official test runner and unfortunatelly for now it does only generate the lcov.info file.

[eugenezinovyev]

@fernandopasik you can use the c8 package with the native node.js test runner. You need to install both "c8" and "@lcov-viewer/istanbul-report" and run tests in the following way:

c8 --reporter=@lcov-viewer/istanbul-report node --test

You also can use this repository as an example: https://github.com/eugenezinovyev/test-runner-lcov-viewer

[fernandopasik]

Thank you @eugenezinovyev I've used c8 before, I was hoping to use entirely the new node testing runner but seems coverage still needs a few tweaks.

[fernandopasik]

FYI also in node.js repo there was a suggestion that node coverage system doesn't support sourcemaps yet
nodejs/node#49626 (comment)