@applitools/eyes

What is @applitools/eyes?

@applitools/eyes is a visual testing and monitoring service that helps ensure your web and mobile applications look as intended. It automates the process of visual validation by comparing screenshots of your application against a baseline, highlighting any visual differences.

What are @applitools/eyes's main functionalities?

Visual Testing

This feature allows you to perform visual testing by capturing screenshots of your application and comparing them against a baseline to detect visual differences.

const { Eyes, Target } = require('@applitools/eyes-selenium');
const { Builder } = require('selenium-webdriver');

(async () => {
  const eyes = new Eyes();
  eyes.setApiKey('YOUR_API_KEY');

  const driver = new Builder().forBrowser('chrome').build();

  try {
    await eyes.open(driver, 'App Name', 'Test Name');
    await driver.get('https://example.com');
    await eyes.check('Main Page', Target.window());
    await eyes.close();
  } finally {
    await driver.quit();
    await eyes.abortIfNotClosed();
  }
})();

Cross-Browser Testing

This feature allows you to perform visual testing across different browsers and viewports, ensuring your application looks consistent across various environments.

const { Eyes, Target, BatchInfo } = require('@applitools/eyes-selenium');
const { Builder } = require('selenium-webdriver');

(async () => {
  const eyes = new Eyes();
  eyes.setApiKey('YOUR_API_KEY');
  eyes.setBatch(new BatchInfo('Cross-Browser Batch'));

  const browsers = [
    { width: 800, height: 600, name: 'chrome' },
    { width: 800, height: 600, name: 'firefox' },
    { width: 800, height: 600, name: 'safari' }
  ];

  for (const browser of browsers) {
    const driver = new Builder().forBrowser(browser.name).build();
    try {
      await eyes.open(driver, 'App Name', 'Cross-Browser Test', browser);
      await driver.get('https://example.com');
      await eyes.check('Main Page', Target.window());
      await eyes.close();
    } finally {
      await driver.quit();
      await eyes.abortIfNotClosed();
    }
  }
})();

Mobile App Testing

This feature allows you to perform visual testing on mobile applications, ensuring that your app's UI looks correct on different devices and screen sizes.

const { Eyes, Target } = require('@applitools/eyes-appium');
const { remote } = require('webdriverio');

(async () => {
  const eyes = new Eyes();
  eyes.setApiKey('YOUR_API_KEY');

  const driver = await remote({
    capabilities: {
      platformName: 'Android',
      deviceName: 'emulator-5554',
      app: '/path/to/your/app.apk'
    }
  });

  try {
    await eyes.open(driver, 'App Name', 'Mobile Test');
    await eyes.check('Main Screen', Target.window());
    await eyes.close();
  } finally {
    await driver.deleteSession();
    await eyes.abortIfNotClosed();
  }
})();

Other packages similar to @applitools/eyes

cypress

Cypress is a front-end testing tool built for the modern web. It provides end-to-end testing capabilities, including visual testing through plugins like cypress-image-snapshot. Compared to @applitools/eyes, Cypress is more focused on functional testing but can be extended for visual testing.

webdriverio

WebdriverIO is a popular automation test framework that supports both functional and visual testing. It can be integrated with tools like Applitools Eyes for visual testing. Compared to @applitools/eyes, WebdriverIO is more versatile in terms of automation capabilities but requires additional setup for visual testing.

puppeteer

Puppeteer is a Node library that provides a high-level API to control Chrome or Chromium over the DevTools Protocol. It can be used for visual testing by capturing screenshots and comparing them using libraries like pixelmatch. Compared to @applitools/eyes, Puppeteer is more low-level and requires more manual setup for visual testing.

README

The README file is missing