Code coverage text summary available?

[jefbarn]

Was finally able to get the code coverage report working. 🎉 Wondering if there is a way to spit out a coverage percent on the console so I can keep an eye on it? Took a look at the stuff in the onEnd hook, but didn't see anything useful.

[cenfun]

Good question. I will looking into it, Im considering adding one more report like v8-json or onEnd hook

[cenfun]

Please try version monocart-reporter@2.0.3. one more option onEnd added for coverage

// playwright.config.js
module.exports = {
    reporter: [
        ['list'],
        ['monocart-reporter', {  
            name: "My Test Report",
            outputFile: './test-results/report.html',
            coverage: {
                onEnd: (coverageResults) => {
                    console.log(coverageResults.summary);
                }
            }
        }]
    ]
};

pretty print with console-grid (v8 summary)

// playwright.config.js
const CG = require('console-grid');
module.exports = {
    reporter: [
        ['list'],
        ['monocart-reporter', {  
            name: "My Test Report",
            outputFile: './test-results/report.html',
            coverage: {
                onEnd: (coverageResults) => {
                    const summary = coverageResults.summary;
                    CG({
                        columns: ['name', 'value'],
                        rows: Object.keys(summary).map((k) => [k, summary[k]])
                    });
                }
            }
        }]
    ]
};

┌───────────┬────────┐
│ name      │ value  │
├───────────┼────────┤
│ total     │ 2299   │
│ covered   │ 1796   │
│ uncovered │ 503    │
│ pct       │ 78.12  │
│ status    │ medium │
└───────────┴────────┘

print in red if coverage less than 90% (v8 summary)

// playwright.config.js
const CG = require('console-grid');
const EC = require('eight-colors');
module.exports = {
    reporter: [
        ['list'],
        ['monocart-reporter', {  
            name: "My Test Report",
            outputFile: './test-results/report.html',
            coverage: {
                onEnd: (coverageResults) => {
                    const summary = coverageResults.summary;
                    CG({
                        columns: [{
                            id: 'name'
                        }, {
                            id: 'value',
                            formatter: (v, row, column) => {
                                if (row.name === 'pct') {
                                    // in red color if coverage less than 90%
                                    if (v < 90) {
                                        v = EC.red(v);
                                    }
                                    return v;
                                }
                                return v;
                            }
                        }],
                        rows: Object.keys(summary).map((k) => {
                            return {
                                name: k,
                                value: summary[k]
                            };
                        })
                    });
                }
            }
        }]
    ]
};

[jefbarn]

Awesome, thanks for adding this!

I went a little nuts with custom formatting this morning. 🤣 Had to merge the results so I could put them in the same table...but pretty easy with some Promise hijinks.

I did have to reproduce your showTestResults function because there was no way to intercept the data before it got displayed, so maybe if you can think of a way to make that easier? Possibly a 'rows' transformer that gets called before you pass the results to console-grid?

// Can be replaced with Promise.withResolvers when it lands in Node
const logSync = PromiseWithResolvers<CoverageResults>()

const mcOptions: MonocartReporterOptions = {
  name: 'Monocart Test Report',
  outputFile: './test/results/report.html',
  logging: 'off',
  coverage: {
    sourceFilter: sourcePath => sourcePath.search(/^src\/app\/.+\.ts$/) !== -1,
    onEnd: coverageResults => {
      logSync.resolve(coverageResults)
      return Promise.resolve()
    }
  },
  onEnd: async reportData => {
    const coverageResults = await logSync.promise
    showTestResults(reportData, coverageResults)
  }
}

[cenfun]

Merging the results is good idea. Please update version to monocart-reporter@2.0.4 Here is the order: 1, coverage onEnd 2, test onEnd 3, show test results

Refer to following codes:

import EC from 'eight-colors';
let coverageResults;
export default {

    reporter: [
        ['list'],
        ['monocart-reporter', {
            name: 'My Test Report with Coverage',
            outputFile: 'docs/coverage/index.html',

            // do NOT turn off all logs
            logging: 'info',

            coverage: {
                onEnd: (_coverageResults) => {
                    coverageResults = _coverageResults;
                }
            },

            onEnd: (reportData) => {
                if (coverageResults) {
                    const { pct, status } = coverageResults.summary;
                    let value = `${status} (${pct}%)`;
                    if (status === 'low') {
                        value = EC.red(value);
                    } else if (status === 'medium') {
                        value = EC.yellow(value);
                    }
                    // add coverage to test results
                    reportData.summary.coverage = {
                        name: 'Coverage',
                        value
                    };
                }

            }
        }]
    ]
};

┌───────────────┬─────────────────────┐
│ ├ Tests       │ 5                   │
│ │ ├ Passed    │ 5 (100.0%)          │
│ │ ├ Flaky     │ 0 (0.0%)            │
│ │ ├ Skipped   │ 0 (0.0%)            │
│ │ └ Failed    │ 0 (0.0%)            │
│ ├ Steps       │ 75                  │
│ ├ Suites      │ 1                   │
│ │ ├ Projects  │ 1                   │
│ │ ├ Files     │ 1                   │
│ │ ├ Describes │ 0                   │
│ │ └ Shards    │ 0                   │
│ ├ Retries     │ 0                   │
│ ├ Errors      │ 0                   │
│ ├ Logs        │ 5                   │
│ ├ Attachments │ 5                   │
│ ├ Artifacts   │ 6                   │
│ ├ Coverage    │ low (35.66%)        │ <==== print in red
│ ├ Playwright  │ v1.40.1             │
│ ├ Date        │ 2023/12/13 10:57:41 │
│ └ Duration    │ 12.9s               │
└───────────────┴─────────────────────┘

[jefbarn]

Yes that works perfect, thanks!