From be3157999108f08babc39db25b0721c64c4fbb24 Mon Sep 17 00:00:00 2001 From: Maciej Jastrzebski Date: Fri, 26 Jul 2024 09:32:22 +0200 Subject: [PATCH] fix: toBeVisible edge case for style values (#1640) --- src/matchers/__tests__/to-be-visible.test.tsx | 9 +++++++++ src/matchers/to-be-visible.tsx | 5 ++--- 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/src/matchers/__tests__/to-be-visible.test.tsx b/src/matchers/__tests__/to-be-visible.test.tsx index 0fee2c76f..380bf84dd 100644 --- a/src/matchers/__tests__/to-be-visible.test.tsx +++ b/src/matchers/__tests__/to-be-visible.test.tsx @@ -254,3 +254,12 @@ test('toBeVisible() on non-React elements', () => { Received has value: true" `); }); + +test('toBeVisible() does not throw on invalid style', () => { + // @ts-expect-error: intentionally passing invalid style to + // trigger StyleSheet.flatten() returning undefined. + render(); + + const view = screen.getByTestId('view'); + expect(view).toBeVisible(); +}); diff --git a/src/matchers/to-be-visible.tsx b/src/matchers/to-be-visible.tsx index 5d992be99..e817f6701 100644 --- a/src/matchers/to-be-visible.tsx +++ b/src/matchers/to-be-visible.tsx @@ -54,7 +54,6 @@ function isElementVisible( } function isHiddenForStyles(element: ReactTestInstance) { - const style = element.props.style ?? {}; - const { display, opacity } = StyleSheet.flatten(style); - return display === 'none' || opacity === 0; + const flatStyle = StyleSheet.flatten(element.props.style); + return flatStyle?.display === 'none' || flatStyle?.opacity === 0; }