How to save unique images for different elements

[lj9142]

Hello,

I've just started using this tool with cucumber and the allure reporting tool with the test runner and it looks really useful but i was wondering how do you create screenshot names for different elements on a page as at the moment they are saving over the same file and failing as it is comparing it to the last saved image.

Related to this, what is the context variable, where is this information being pulled from?

Thank you in advance!

[zinserjan]

Related to this, what is the context variable, where is this information being pulled from?

They are mainly from the command itself with some additional useful stuff.

For the window width you can try the following:

function getScreenshotName(basePath) {
  return function(context) {
    var type = context.type;
    var testName = context.test.title;
    var browserVersion = parseInt(context.browser.version, 10);
    var browserName = context.browser.name;
    var resolution = context.meta.width || context.meta.orientation || 'unknown';

    return path.join(basePath, `${testName}_${type}_${browserName}_v${browserVersion}_${resolution}.png`);
  };
}

If you want to have a custom name instead of the actual test name, you can pass some custom options into each command like the following:

  const report = await browser.checkDocument({
     name: "YOU_NAME"     
  });

And use the name on the screenshot name method.

function getScreenshotName(basePath) {
  return function(context) {
    var type = context.type;
    var testName = context.options.name;
    var browserVersion = parseInt(context.browser.version, 10);
    var browserName = context.browser.name;
    var resolution = context.meta.width || context.meta.orientation || 'unknown';

    return path.join(basePath, `${testName}_${type}_${browserName}_v${browserVersion}_${resolution}.png`);
  };
}

[lj9142]

Great, thank you, the second part is exactly what i needed.

I won't be using the test name but i did have it included as you mentioned in the first part but it seems the value is undefined and i am guessing this is to do with that i am using the cucumber framework as well.