Does Monocart report generate single html file with all test attachments (screenshots, video) similar like Allure reporter

[farooqmdqa]

Hi,

Is there any approach for Monocart reporter to generate a single html file report which consists of all test attachments (screenshots, videos) in Playwright using Typescript language. Is there any command for Monocart to generate single html file similar like Allure reporter with allure generate --single-file allure-results?

Thanks

[cenfun]

No. There may be thousands of attachments, especially images and videos that are quite large. But you can simply compress the outputDir into a single zip file.

[cenfun]

Here is a approach with Node.js lib archiver https://www.archiverjs.com/

// playwright.config.js
const fs = require('fs');
const archiver = require('archiver');

function archiveReport(outputDir) {
    return new Promise((resolve) => {

        const output = fs.createWriteStream('.temp/my-report.zip');
        const archive = archiver('zip', {
            zlib: {
                level: 9
            }
        });
        output.on('close', function() {
            console.log(`${archive.pointer()} total bytes`);
            console.log('archiver has been finalized and the output file descriptor has closed.');
            resolve();
        });

        archive.pipe(output);
        archive.directory(outputDir, 'my-report');
        archive.finalize();

    });
}

module.exports = {
    reporter: [
        ['list'],
        ['monocart-reporter', {  
            name: "My Test Report",
            outputFile: './test-results/report.html',
            onEnd: async (reportData, helper) => {
                // archive report into a single zip file
                await archiveReport(reportData.outputDir);
            }
        }]
    ]
};

[farooqmdqa]

@cenfun Thank you for your acknowledgement and giving respone to the query. I agree with you regarding size of images and videos attached to the tests but we can not attach a file to the email with size more than 10MB https://aws.amazon.com/about-aws/whats-new/2021/09/amazon-ses-emails-message-40mb/

Actual requirement is to send an email with test summary(total tests, passed tests, failed tests, total duration) report and hyperlink to view the detailed report after test execution in Playwright. We are using AWS are CI/CD

We are using custom reporter(OnBegin, OnTestBegin, OnTestEnd, OnEnd, OnExit) which Playwright offers for the test summary and for the hyperlink, we are uploading generated index html file to AWS S3 bucket, and generating presigned URL(hyperlink) with PutObjectCommand, GetObjectCommand in AWS S3 Client service, and sending email with AWS SES service.

Working fine with allure reporter which generates html file embedded with test attachments with command allure generate --single-file allure-results whereas moncart report index html file is uploaded but does not show the test attachments in presigned url

Could you please help in creating/generating a single index html file embedded with test attachments(screenshots, videos) using Monocart-reporter with Typescript so that to upload to AWS S3 bucket and view the report through hyperlink.

Thanks

[cenfun]

You could upload whole outputDir to S3, for example:

• upload with Nodejs: https://alexcodes.medium.com/uploading-files-to-amazon-s3-using-node-js-a-comprehensive-guide-with-examples-6d300dfe90f8
• upload with github actions: https://github.com/shallwefootball/upload-s3-action

then you can open the report online from s3

For sending email you can see this example: https://github.com/cenfun/playwright-reporter-integrations/tree/main/send-email

• show summary in email
• also we can put a s3 report link for deatils

There is no need to create your own custom reporter, monocart-reporter can do it well, with onEnd hook we can customize the report what we want.

For the wrong image in your screenshot, I not sure why it happen, can you provide a link for debug?