Why browser.saveScreen() function does not work in Image Comparison Service of WebdriverIO?

Question

I try to create test to compare screenshots, using WebdriverIO with Image Comparison Service. In 'sync' mode everything is ok. But I want to use 'async' mode, since 'sync' mode will not be supported anymore ( https://webdriver.io/docs/sync-vs-async ). For 'async' mode my test looks like this:

describe('Example', () => {
  it('should save some screenshots', async () => {
    await browser.url('https://Codemify.com/interview/interview')
    // Save a screen
    await browser.saveScreen('examplePaged', {
      /* some options */
    })
  })
  it('should compare successful with a baseline', async () => {
    await browser.url('https://Codemify.com/interview/interview')
    // Check a screen
    await expect(
      browser.checkScreen('examplePaged', {
        /* some options */
      })
    ).toEqual(0)
  })
})

Settings in wdio.conf.js:

  services: [
    ['chromedriver'],
    [
      'image-comparison',
      {
        baselineFolder: join(process.cwd(), './tests/'),
        formatImageName: '{tag}-{logName}-{width}x{height}',
        screenshotPath: join(process.cwd(), '.tmp/'),
        savePerInstance: true,
        autoSaveBaseline: true,
        blockOutStatusBar: true,
        blockOutToolBar: true,
        ignoreNothing: true,
      },
    ],
  ],

In example above folder '.tmp' is created, but baseline folder './tests/' is not created and I get error:

[chrome 91.0.4472.124 windows #0-0] expect(received).toEqual(expected) // deep equality

Expected: 0
Received: {}
[chrome 91.0.4472.124 windows #0-0] Error: expect(received).toEqual(expected) // deep equality

I can not understand what goes wrong... Suppose, that function browser.saveScreen() does not work properly. Any advices would be appreciated.

Answer 1

I have added await to browser.checkScreen(): await expect(await browser.checkScreen('examplePaged', {/* some options */})).toEqual(0). Now everything is OK for async mode.