Rogger Fernandes
Rogger Fernandes

Reputation: 915

WebdriverIO - Edit test title or property with spec reporter

Is there a way to easily override spec reporter to edit Running property? My use case is that I have 2 capabilities object of chrome which only differ the mobile emulation because one is purely desktop size, and the other one is a chrome simulating mobile size. The issue is in the spec reporter there is no way for me to tell which runner was the mobile or desktop. I get an output similar to this:

------------------------------------------------------------------
[chrome 88.0.4324.96 LINUX #0-0] Spec: /path/to/spec.js
[chrome 88.0.4324.96 LINUX #0-0] Running: chrome (v88.0.4324.96) on LINUX
[chrome 88.0.4324.96 LINUX #0-0] Session ID: 27fe3f66-0197-4e26-ad76-dedbbb442ef5
[chrome 88.0.4324.96 LINUX #0-0]
[chrome 88.0.4324.96 LINUX #0-0] Suite 1
[chrome 88.0.4324.96 LINUX #0-0]    ✓ Test Case #1
[chrome 88.0.4324.96 LINUX #0-0]
[chrome 88.0.4324.96 LINUX #0-0] 1 passing (7.4s)
------------------------------------------------------------------
[chrome 88.0.4324.96 LINUX #1-0] Spec: /path/to/spec.js
[chrome 88.0.4324.96 LINUX #1-0] Running: chrome (v88.0.4324.96) on LINUX
[chrome 88.0.4324.96 LINUX #1-0] Session ID: 8091a4f4-5133-453b-b14a-bd9f814165a8
[chrome 88.0.4324.96 LINUX #1-0]
[chrome 88.0.4324.96 LINUX #1-0] Suite 1
[chrome 88.0.4324.96 LINUX #1-0]    ✓ Test Case #1
[chrome 88.0.4324.96 LINUX #1-0]
[chrome 88.0.4324.96 LINUX #1-0] 1 passing (7.9s)


Spec Files:      2 passed, 2 total (100% completed) in 00:00:14 

I also tried to edit the suite title on before hooks, but without success. If someone can help me with an easy way to approach.

Upvotes: 0

Views: 828

Answers (1)

Yevhen Laichenkov
Yevhen Laichenkov

Reputation: 8672

You have to create a custom reporter and override the getHeaderDisplay method to achieve that.

For instance:

  1. Create the my-custom-reporter.js file
  2. Import the SpecReporter reporter
  3. Declare the CustomReporter class that extends the SpecReproter reporter
  4. Declare the getHeaderDisplay method
  5. Add information about mobile in the output array
  6. Export the module
  7. In the wdio.conf.js config import the custom spec reporter
  8. Add it in the reporters array, reporters: [[CustomReporter]],

Full working example:

In the my-custom-reporter.js file:

const { default: SpecReporter } = require('@wdio/spec-reporter')

class CustomReporter extends SpecReporter {
    getHeaderDisplay(runner) {
        const combo = this.getEnviromentCombo(runner.capabilities, undefined, runner.isMultiremote).trim();
        // Here we get information about mobile device
        const mobileInfo = runner.config.capabilities['goog:chromeOptions']?.mobileEmulation?.deviceName
            ? `${runner.config.capabilities['goog:chromeOptions'].mobileEmulation.deviceName} emulated by`
            : '';
        const output = [
            `Spec: ${runner.specs[0]}`,
            `Running: ${mobileInfo} ${combo}`
        ];
    
        if (runner.capabilities.sessionId) output.push(`Session ID: ${runner.capabilities.sessionId}`);
    
        return output;
    }
}

module.exports = CustomReporter;

In the wdio.conf.js file:

const CustomReporter = require('./my-custom-reporter')

exports.config = {
    // ... other properties
    reporters: [[CustomReporter]],
}

Output:

[chrome 89.0.4389.90 mac os x #0-0] Spec: /Users/u/test/specs/example.e2e.ts
[chrome 89.0.4389.90 mac os x #0-0] Running:  chrome (v89.0.4389.90) on mac os x
[chrome 89.0.4389.90 mac os x #0-0] Session ID: f0480174d634514e5559e560188d2d84
[chrome 89.0.4389.90 mac os x #0-0]
[chrome 89.0.4389.90 mac os x #0-0] My Login application
[chrome 89.0.4389.90 mac os x #0-0]    ✓ should login with valid credentials
[chrome 89.0.4389.90 mac os x #0-0]
[chrome 89.0.4389.90 mac os x #0-0] 1 passing (3.4s)
------------------------------------------------------------------
[chrome 89.0.4389.90 mac os x #1-0] Spec: /Users/u/test/specs/example.e2e.ts
[chrome 89.0.4389.90 mac os x #1-0] Running: iPhone X emulated by chrome (v89.0.4389.90) on mac os x
[chrome 89.0.4389.90 mac os x #1-0] Session ID: a7eacc89e3b933c895e7bf1d5811e72b
[chrome 89.0.4389.90 mac os x #1-0]
[chrome 89.0.4389.90 mac os x #1-0] My Login application
[chrome 89.0.4389.90 mac os x #1-0]    ✓ should login with valid credentials
[chrome 89.0.4389.90 mac os x #1-0]
[chrome 89.0.4389.90 mac os x #1-0] 1 passing (3.5s)


Spec Files: 2 passed, 2 total (100% completed) in 00:00:18

Upvotes: 1

Related Questions