Ignore Color-Only Changes in a Region (ignoreColors)

ignoreColors marks regions where color-only changes are ignored during comparison, while structural changes still flag. It is the programmatic counterpart of the dashboard's Ignore colors box, available through both the SDK and the Lambda Hooks runtime.

Teams that ship frequent theme swaps, brand-color rotations, or seasonal palettes usually face a bad trade-off: either every restyle floods the build with visual diffs that reviewers approve blindly, or the whole region gets ignored and real regressions slip through. ignoreColors removes that trade-off. The region stays under test for layout, text, and element changes, and only the recolor noise disappears. Reviews stay small, baselines stay meaningful, and a broken layout inside a restyled banner still fails the build.

Important

Works only with the Smart Ignore comparison strategy. ignoreColors regions are honored by the smart-ignore engine. On the pixel-by-pixel comparison path they are dropped. Set your project or build comparison to Smart Ignore for these regions to take effect. See Smart Ignore.

What it does

Inside an ignoreColors region:

• A color-only change (theme swap, brand-color rotation, seasonal palette) is ignored.
• A structural change (text, layout, element added or removed) is still flagged.

Outside the region, everything is compared as usual. It composes with ignoreDOM and selectDOM. For example, you can select a region for comparison and ignore colors inside another.

SDK

Pass ignoreColors in the snapshot options. All selector types are supported, along with coordinate rectangles and a whole-image switch.

await smartuiSnapshot(driver, "Home Page", {
  ignoreColors: {
    id:            ["price-banner"],
    class:         ["seasonal-theme"],
    cssSelector:   ["#hero .cta"],
    xpath:         ["//div[@data-testid='promo']"],
    coordinates:   ["200,350,100,400"],   // top,bottom,left,right
    entireScreenshot: true                // ignore colors across the whole image
  }
});

Lambda Hooks

Selenium

The hooks path additionally accepts a located webElement (or an array of them).

const el = await driver.findElement(By.id("price-banner"));

await driver.executeScript("smartui.takeScreenshot", {
  screenshotName: "checkout-page",
  ignoreColors: {
    id:            ["price-banner"],
    class:         ["seasonal-theme"],
    cssSelector:   ["#nav .logo"],
    xpath:         ["//div[@data-testid='promo']"],
    coordinates:   ["100,200,400,350"],   // left,top,right,bottom
    webElement:    el,                    // a located element, or an array of them
    entireScreenshot: true                // ignore colors across the whole image
  }
});

Playwright / Puppeteer

await page.evaluate(`lambdatest_action: ${JSON.stringify({
  action: "smartui.takeScreenshot",
  arguments: {
    screenshotName: "checkout-page",
    ignoreColors: {
      id:          ["price-banner"],
      class:       ["seasonal-theme"],
      cssSelector: ["#nav .logo"],
      xpath:       ["//div[@data-testid='promo']"],
      entireScreenshot: true              // ignore colors across the whole image
    }
  }
})}`);

note

coordinates and webElement are not available on the Playwright / Puppeteer path.

Notes

• Smart Ignore only. Regions have no effect on the pixel-comparison path.
• entireScreenshot: true covers the entire captured image (stitched full page, viewport, or element crop). It is additive. Combine it with selectors, or use it alone.
• Coordinate order differs by path. SDK: top,bottom,left,right. Hooks: left,top,right,bottom. Each entry is a comma-joined string of four numbers.
• Composes with selectDOM / ignoreDOM. Both apply. If a region is in both ignoreDOM and ignoreColors, full ignore wins: the whole region is masked, not just its colors.
• Missing selectors do not fail the snapshot. They are reported back via domElementsMissing and skipped, and the rest of the snapshot proceeds normally.

Related Docs

• Smart Ignore
• Region Ignore + Select on Web Hooks
• Handling Dynamic Data with DOM Configuration and Options
• Selenium Visual Regression