fix: toBeVisible edge case for style values (#1640)

callstack · Jul 26, 2024 · be31579 · be31579
1 parent 2f4568a
commit be31579
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git 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(<View testID="view" style={0} />);
+
+ const view = screen.getByTestId('view');
+ expect(view).toBeVisible();
+});
diff --git 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;
 }