Skip to content

iOS captures an element in Display P3 when it is on screen and in sRGB when it is partly off it #281

Closed

Description

@YevheniiKotyrlo

Describe the bug

On iOS, screen.screenshot(element) captures an element that is fully on screen with captureScreenshotWithBounds: (drawViewHierarchyInRect:) and one that is partly off screen with captureScreenshotOfView: (renderInContext:), both in packages/ui/ios/ViewQueryHelper.mm and both through a UIGraphicsImageRendererFormat left at its default range. On the E2E workflow's iPhone 17 Pro simulator the first comes out as a 16-bit PNG tagged Display P3 (iCCP kCGColorSpaceDisplayP3, cICP primaries 12) and the second as an 8-bit sRGB PNG. toMatchImageSnapshot compares raw values with pngjs, which ignores the profile, so one colour gets two values depending on where the element sits: the playground's orange is 242,169,59 in ios/orange-square-element-only.png and 255,165,0 in ios/out-of-bounds.png.

I expected every capture in one colour space, for example both renderers set to format.preferredRange = UIGraphicsImageRendererFormatRangeStandard.

System Info

System:
  OS: macOS 26 (GitHub Actions macos-26)
  Xcode: 26.4.1
  Simulator: iPhone 17 Pro, iOS 26.4

React Native Harness Version

1.6.0 (captured on main at 9a505a8; packages/ui/ios is unchanged at 81ed195)

Reproduction

https://github.com/YevheniiKotyrlo/react-native-harness/tree/fix/missing-image-snapshot-on-ci/apps/playground/src/__tests__/normal/ui/__image_snapshots__/ios

Steps to reproduce

  1. Run the playground's ui/screenshot.harness.tsx and ui/out-of-bounds.harness.tsx with the ios runner, so they write __image_snapshots__/ios/orange-square-element-only.png (the orange square, fully on screen) and ios/out-of-bounds.png (a 1000 dp row, partly off screen). The two files linked above are the E2E workflow's captures, which fix(bridge): fail a missing image snapshot in CI mode instead of writing it #249 commits.
  2. Look at their chunks: the first is 16-bit with an iCCP Display P3 profile and a cICP chunk, the second 8-bit with an sRGB chunk.
  3. Read an orange pixel with pngjs (PNG.sync.read): 242,169,59 at (37, 150) of the first, 255,165,0 at (1650, 150), the sixth square, of the second.

Activity

  1. added a commit that references this issue on Oct 25, 2026
    499c07a
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions