code coverage with Azure DevOps and @web/test-runner

Question

I'm using azure devops for me builds, and I'm trying to get code coverage reporting working. @web/test-runner outputs lcov.info and a lcov-report directory that contains html files.

I tried using reportgenerator@5 to convert this to Cobertura format. This sort of works, but the resulting output in devops is just a high level view, you cannot see inside the javascript files. Also it doesn't report on src files that are not tested at all.

The relevant tasks in my azure pipeline:

- script: npm run test
  displayName: 'unit tests'
- task: reportgenerator@5
  condition: succeededOrFailed()
  displayName: Converting lcov to cobertura
  inputs:
    reports: 'coverage/lcov.info' 
    targetdir: 'coverage/'  
    reporttypes: 'Cobertura'

- task: PublishCodeCoverageResults@2
  condition: succeededOrFailed()
  inputs:
    summaryFileLocation: 'coverage/Cobertura.xml'

- task: PublishTestResults@2
  condition: succeededOrFailed()
  displayName: 'Publish Test Results'
  inputs:
    testResultsFormat: 'JUnit'
    testResultsFiles: '**/test-results.xml' 
    failTaskOnFailedTests: true 

First part of Cobertura.xml looks like this:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE coverage SYSTEM "http://cobertura.sourceforge.net/xml/coverage-04.dtd">
<coverage line-rate="0.6182993812139331" branch-rate="0.512396694214876" lines-covered="8893" lines-valid="14383" branches-covered="186" branches-valid="363" complexity="NaN" version="0" timestamp="1699906675">
  <sources />
  <packages>
    <package name="Default" line-rate="0.6182993812139331" branch-rate="0.512396694214876" complexity="NaN">
      <classes>
        <class name="src\***redacted***.js" filename="src\***redacted***.js" line-rate="0.9323467230443975" branch-rate="0.8181818181818182" complexity="NaN">
          <methods>
            <method name="get is" signature="" line-rate="1" branch-rate="1" complexity="NaN">
              <lines>
                <line number="28" hits="1" branch="true" condition-coverage="100% (1/1)" />
                <line number="29" hits="1" branch="false" />
                <line number="30" hits="1" branch="false" />
                <line number="31" hits="1" branch="false" />
              </lines>
            </method>
            <method name="get template" signature="" line-rate="1" branch-rate="1" complexity="NaN">
              <lines>
                <line number="32" hits="1" branch="true" condition-coverage="100% (1/1)" />
                <line number="33" hits="1" branch="false" />
                <line number="34" hits="1" branch="false" />
                <line number="35" hits="1" branch="false" />
                <line number="36" hits="1" branch="false" />
                <line number="37" hits="1" branch="false" />
                <line number="38" hits="1" branch="false" />
                <line number="39" hits="1" branch="false" />
                <line number="40" hits="1" branch="false" />
                <line number="41" hits="1" branch="false" />
                <line number="42" hits="1" branch="false" />
                <line number="43" hits="1" branch="false" />
                <line number="44" hits="1" branch="false" />

Code Coverage in DevOps:

Any ideas/examples on how to solve this?