Implementing a Custom Reporter in Jest

Jest's default reporters provide useful information during test runs, but sometimes you need more tailored output. This challenge asks you to create a custom Jest reporter that logs test results in a specific format, demonstrating your understanding of Jest's reporter API and TypeScript. This is useful for integrating test results into custom dashboards, generating reports for specific stakeholders, or simply tailoring the output to your team's preferences.

Problem Description

You need to implement a custom Jest reporter named CustomResultReporter. This reporter should:

1. Log a header: At the beginning of the test run, log a header message to the console indicating the reporter is active (e.g., "CustomResultReporter: Starting test run...").
2. Log test results: For each test suite, log the suite name. For each test case within the suite, log the test name and its status (passed or failed). If a test fails, also log the error message.
3. Log a footer: At the end of the test run, log a footer message (e.g., "CustomResultReporter: Test run complete.").
4. Handle different test statuses: The reporter must correctly handle passed, failed, skipped, and pending tests. Only failed tests should include the error message.
5. Use TypeScript: The entire implementation must be in TypeScript.

Expected Behavior:

The reporter should intercept Jest's test run events and log the information as described above. The output should be clear, concise, and easy to understand.

Examples

Example 1:

Input: A Jest test suite with one passing test and one failing test.
Output:
CustomResultReporter: Starting test run...
Suite: MyTestSuite
  Test: passingTest - Passed
  Test: failingTest - Failed
    Error: Expected value to be "hello". Received "world".
CustomResultReporter: Test run complete.

Example 2:

Input: A Jest test suite with two passing tests and one skipped test.
Output:
CustomResultReporter: Starting test run...
Suite: MyTestSuite
  Test: passingTest1 - Passed
  Test: passingTest2 - Passed
  Test: skippedTest - Skipped
CustomResultReporter: Test run complete.

Example 3: (Edge Case - No tests run)

Input: Jest run with no tests defined.
Output:
CustomResultReporter: Starting test run...
CustomResultReporter: Test run complete.

Constraints

• The reporter must be compatible with Jest versions 27 or higher.
• The reporter should log to the console using console.log.
• The reporter should not modify the test results or affect the test execution process.
• The reporter should be implemented as a single TypeScript file.
• The reporter should handle asynchronous test cases correctly.

Notes

• You'll need to implement the JestReporter interface from Jest's types.
• Pay close attention to the events emitted by Jest and how to access the relevant test information from those events. Key events to consider are testStart, testDone, suiteStart, and suiteDone.
• The testDone event provides the test result, including the status and error message (if any).
• Consider using a class to structure your reporter implementation.
• Remember to export your reporter so Jest can find it. You'll need to configure Jest to use your custom reporter in your jest.config.js or jest.config.ts file. The configuration will involve adding your reporter to the reporters array.