Would love this too - @Hazyzh any ideas on if/when this could/can be implemented?

good idea! need to think more about how to implement this feature. just add this to milestone 2.x.

Same as #37, this reporter just to display the data that we got form Jest, and we can not add any custom data to test results. I can provide a method to save images, but the key point is how to relate that image to the corresponding test case.

From Jest source code I found that there is a global variable when really running a test which stores the base information of the test. I can got file path and test full name from it, then combine it to our test result. This is a hack way that may not stable, but can not find another better way now.

/**
 *
 * @param {Buffer | string} attach
 * @param {string} description
 */
const addAttach = async (attach, description) => { ... }

provide a new method 'addAttach' in the package, in the test case you can add an image attach by using this method, and those images will show in the corresponding test case.

will update more detail in the readme.

New version (2.0.0) released. You can have a try now.

Amazing - great idea, thanks for providing!

Works perfectly! Thanks a lot!

Is there a way to attach html instead of a screenshot?

Is there a way to attach html instead of a screenshot?

Not support currently. maybe we can support it if it is a common use case.

This would be great, but maybe call it attachAsset and make it possible to add more than one

Hey,

I'm using the Detox library to test my React Native app. Detox automatically saves screenshots, videos, and logs of failed tests inside the artifacts folder. The file structure looks like this:

artifacts/android.att.debug.2025-03-19 10-03-19Z/✗ Test Login Test Login with password
  device.log
  test.mp4
  testDone.png
  testFnFailure.png
  testStart.png

and under that I got this files

I want to attach all screenshots, the video file, and the log file to the Jest HTML report.

Here’s my current Jest configuration:

/** @type {import('@jest/types').Config.InitialOptions} */
module.exports = {
  preset: 'ts-jest',
  rootDir: '..',
  testMatch: ['<rootDir>/e2e/**/*.test.ts'],
  testTimeout: 120000,
  maxWorkers: 1,
  globalSetup: 'detox/runners/jest/globalSetup',
  globalTeardown: 'detox/runners/jest/globalTeardown',
  reporters: ['detox/runners/jest/reporter'],
  testEnvironment: 'detox/runners/jest/testEnvironment',
  verbose: true,
  reporters: [
    'default',
    [
      'jest-html-reporters',
      {
        publicPath: './html-report',
        filename: 'report.html',
      },
    ],
  ],
};