ERROR: browser.compareScreen is not a function
adeshpatra opened this issue · comments
Environment (please complete the following information):
- Node.js version: 8.11.3
- NPM version: 6.13.7
- webdriver.io version: 5.16.10
- wdio-native-app-compare version: 1.1.0
Config of webdriver.io and the plugin
const config = {
framework: 'cucumber',
services: ['native-app-compare'],
nativeAppCompare: {
baselineFolder: 'img/baseline',
screenshotPath: 'img/compare',
autoSaveBaseline: true,
imageNameFormat: '{tag}'
}
};Describe the bug
GMT+0000 INFO before
GMT+0000 INFO beforeScenario Sanity test
GMT+0000 INFO Before Sanity test
GMT+0000 INFO Executing test with user XXXX56789
22849 Thu May 21 2020 10:52:33 GMT+0000 INFO [0-0] Error in "Sanity test"
browser.compareScreen is not a function
compareScreen function is defined under a custom class
static compareScreen(screenName, options = {}) {
if (Object.entries(options).length === 0) {
updateOptions = {
blockOutNavigationBar: true,
savePerDevice: true,
blockOutIphoneXBottomBar: false,
autoSaveBaseline: true,
saveAboveTolerance: true,
};
} else {
updateOptions = options;
}
browser.compareScreen(screenName, updateOptions);
}Expected behavior
A clear and concise description of what you expected to happen.
Screenshots
If applicable, add screenshots to help explain your problem.
Additional context
Add any other context about the problem here.
It seems like webdriverio 5 doesn't detect the service added and won't invoke the library.
@tejasv02 and @adeshpatra
This is likely due to a misconfiguration, please check the docs here https://github.com/wswebcreation/wdio-native-app-compare#configuration
and if this still fails, please provide you complete configuration object, even the ones if you merge stuff
services: [['native-app-compare',
{
baselineFolder: 'img/baseline',
screenshotPath: 'img/compare',
autoSaveBaseline: true,
imageNameFormat: '{tag}'
}
]],
@wswebcreation Updated configuration as above but still issue persists
Can you please provide the config as requested, the whole config please
@wswebcreation Attached config object in src_wdio_config_config.txt
Hmm, not seeing the problem right away, can you provide a sample project where you see this problem so I can help you debug. Tbh, I think this is a coding issue because I have multiple user using this module without any problems
Okay will add a test project and check.
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.
I'm facing this issue too, after upgrade to RN 0.68.
Current versions:
NVM_VERSION 0.39.1
NODE_VERSION 14.19.3
APPIUM_VERSION 1.22.0
YARN_VERSION 1.22.4
GMSAAS_VERSION 1.7.0
wdio-native-app-compare-service: 2.0.0,
webdriverio: 7.19.5
Config file:
export const visualDiffConfig = {
misMatchPercentage: 0.4,
largeMisMatchPercentage: 0.8,
specFileRetries: process.env.CIRCLECI ? 1 : 0,
services: [
[
'native-app-compare',
{
baselineFolder: `./e2e/screenshots/${process.env.DEVICE_OS}/expected`,
imageNameFormat: `{tag}-{deviceName}`,
screenshotPath: `./e2e/screenshots/${process.env.DEVICE_OS}`,
savePerInstance: true,
autoSaveBaseline: true,
blockOutStatusBar: true,
ignoreAntialiasing: true,
ignoreAlpha: true,
},
],
],
};
Can you provide your full config here @berekmerilorand
This might be a problem of the configs overwriting the services
the above is the full visual config, but I'll provide you also the base config and how the visual config is called.
wdio.base.visual.config.ts
export const visualDiffConfig = {
misMatchPercentage: 0.4,
largeMisMatchPercentage: 0.8,
specFileRetries: process.env.CIRCLECI ? 1 : 0,
services: [
[
'native-app-compare',
{
baselineFolder: `./e2e/screenshots/${process.env.DEVICE_OS}/expected`,
imageNameFormat: `{tag}-{deviceName}`,
screenshotPath: `./e2e/screenshots/${process.env.DEVICE_OS}`,
savePerInstance: true,
autoSaveBaseline: true,
blockOutStatusBar: true,
ignoreAntialiasing: true,
ignoreAlpha: true,
},
],
],
};
wdio.base.config.ts
import { Constants } from '@e2e/helper/constants';
import { executeShellCommand } from '@e2e/helper/helperMethods';
import {
deleteVisualTestImageArtifact,
isBaselineImageExisting,
} from '@e2e/helper/reportingHelpers';
import { merge } from 'lodash';
import { config as browserstackConfig } from './wdio.base.bs.config';
const { IS_BROWSERSTACK_TEST, DEVICE_OS, CIRCLECI } = process.env;
const diffFolderPath = `e2e/screenshots/${process.env.DEVICE_OS}/diff`;
const baselineFolder = `e2e/screenshots/${process.env.DEVICE_OS}/expected`;
const deviceName: string =
process.env.DEVICE_FULL_NAME !== undefined ? process.env.DEVICE_FULL_NAME : '';
export const config = merge(
{
testResultsPath: 'e2e/test-results/',
services: ['shared-store'],
maxInstances: process.env.DEVICE_UUID_0 && process.env.DEVICE_UUID_1 ? 2 : 1,
sync: true,
logLevel: 'silent',
logLevels: {
'wdio-native-app-compare-service': 'info',
},
coloredLogs: true,
specFileRetries: process.env.CIRCLECI ? 1 : 0,
specFileRetriesDelay: 0,
specFileRetriesDeferred: false,
bail: 0,
waitforTimeout: Constants.WAIT_TIME_VERY_LONG_MS,
connectionRetryTimeout: Constants.WAIT_TIME_MAX_MS,
connectionRetryCount: 3,
isBrowserstackTest: !!IS_BROWSERSTACK_TEST,
port: IS_BROWSERSTACK_TEST ? 0 : 4723,
path: '/wd/hub',
reporters: ['spec'],
framework: 'mocha',
mochaOpts: {
ui: 'bdd',
timeout: Constants.WAIT_TIME_MAX_MS,
require: ['mocha-steps', '@babel/register', 'module-alias/register'],
retries: CIRCLECI ? 1 : 0,
},
example of how verifyScreen method is called in wdio.base.config.ts file
before(
capabilities: WebDriver.DesiredCapabilities,
specs: string[],
browser: WebdriverIO.Browser,
) {
const imageDiffMaxRetries = 3;
browser.addCommand(
'verifyScreen',
(tag, screenCompareOptions, threshold = browser.config.misMatchPercentage) => {
let misMatchPercentage = 100;
this.deleteVisualDiff(tag);
this.baselineExists(tag);
for (
let retries = 0;
misMatchPercentage >= threshold && retries <= imageDiffMaxRetries;
retries += 1
) {
if (retries !== 0) {
browser.pause(Constants.WAIT_TIME_MEDIUM_MS);
}
misMatchPercentage = browser.compareScreen(tag, screenCompareOptions)
.misMatchPercentage;
}
expect(misMatchPercentage).toBeLessThan(threshold);
},
);
how test suites are defined for visuals (see the imports)
require('module-alias/register');
import { config as baseConfig } from '@e2e/config/wdio.base.config';
import { visualDiffConfig } from '@e2e/config/wdio.base.visual.config';
import { merge } from 'lodash';
import path from 'path';
import { devicesCapabilities } from './wdio.device.capabilities.config';
import { testVars } from './wdio.olx-pk.vars';
const sharedSpecsPath = '../e2e/shared/visual_specs';
const specs = {
specs: [path.join(sharedSpecsPath, '/**')],
};
const testSuite = {
};
I forgot to mention that this issue occurs after upgrade to RN 0.68. I'm testing on Android 10, API 29.
Can you log JSON.stringify(driver.config, null, 2) to the console. Then you should be able to see the processed config.
Also if you run the test with logLevel:'debug' you should be able to see in the first few log lines if the service is added. If not than this is most likely an service import error, not something the module can fix
It was fixed after removing second pair of [ ] from visual config.
The main reason of failures was the Node version, because before I had 12.22.7 and after upgrade to 14.19.3 the error disappeared.
Thank you and best regards!
Awesome!