ResembleJS issue

Hey guys,
I’ve been trying to implement the Resemble helper but it doesn’t work correctly for me. At the end of the test the browser should close and the console should display the tolerance level and mismatch percentage. Then, a diff image should be saved in the specified diff folder.

Instead, only the tolerance level is printed in console and it does not save a diff image and also the browser remains open. It does take the screenshot though and save it in the ‘output’ folder. I tried updating webdriver to v5 as specified and followed the setup docs word for word. When debugging resemble.js and index.js i have found that the compare functions are not being executed for some reason. Please help me troubleshoot this, i’ve been trying for 3 days2019-06-11_12-26-18

Hello,

I can help you with the issue, can you please provide me the tests that you are trying to run?

Regards,
Puneet Kala

right now i’m just trying to create an extremely simple test just to see the helper workingtest

So I think the problem is, you don’t have the image present in the base folder since you are running the test for the first time, you should make sure you have an image in the base folder.

let me explain, For image comparison to work, codecept must find a base image in the baseFolder and a screenshot image in the output folder, it will use these two images to make a comparison and produce a diff image in the diff folder.
Try running the same test using the following last line:

I.seeVisualDiff("home_test.png", {prepareBaseImage: true, tolerance:2});

If you notice here, I update prepareBaseImage option to true, this will move the image present in the screenshot folder to baseFolder and then you must write a new scenario to make a comparison.

I did the exact same thing the first time i ran it. There is a picture in both the base and output folders and the picture names are the same

Please provide complete configuration file and test file.

also provide error logs that you get from console.

config file:

  exports.config = {
  tests: 'tests/waitFor.js',
  timeout: 10000,
  output: './output',
  helpers: {
    WebDriver: {
      url: 'https://www.google.com', // can't provide the actual url im working on due to company policy. helper doesn't work on any website though anyway.
	    windowSize: 'maximize',
      browser: 'chrome',
      restart: false,
      keepBrowserState: false,
      keepCookies: false
    },
    
    ResembleHelper : {
      require: 'codeceptjs-resemblehelper',
      screenshotFolder : './output/',
      baseFolder: './base_images/',
      diffFolder: './diff_images/',

    }
  },

  include: {
    I: './steps_file.js',
	data: './data.js'
  },
  bootstrap: false,
  mocha: {},
  name: 'Codecept'
  }

test file:

Feature('exp');


Scenario('resemble', async (I) => {
  I.amOnPage('/');
  I.wait(2);
  I.saveScreenshot("home_test.png");
  I.seeVisualDiff("home_test.png", {prepareBaseImage: false, tolerance: 2});
})

console output showing only the tolerance level output (ran with --steps flag):

Thanks a lot for the files, I am still not able to reproduce the issue you reported. I am using

./node_modules/.bin/codeceptjs run tests/resemble_test.js --steps

Configuration file is same, The version of resemblejs-helper, webdriver and codeceptjs are the following.

"codeceptjs": "^2.1.3",
"codeceptjs-resemblehelper": "^1.5.0",
"webdriverio": "^5.9.4"

Can you please run the tests with these additional options and provide me console output,
--debug --verbose

my versions are as follows:

codeceptjs: 2.1.4
codeceptjs-resemblehelper: 1.5.0
webdriverio: 5.10.1

here is the console output for --debug --verbose

Please give me your skype id or I can invite you for a call on Zoom, if thats okay for you?

this is my skype email: [deleted]. i am waiting for your call. thanks!