fix: support nested style arrays (#12)

testing-library · Nov 18, 2019 · 9a73e59 · 9a73e59
1 parent 115f296
commit 9a73e59
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/src/__tests__/to-have-style.js b/src/__tests__/to-have-style.js
@@ -8,7 +8,7 @@ describe('.toHaveStyle', () => {
     const { getByTestId } = render(
       <View
         testID="container"
-        style={[{ backgroundColor: 'blue', height: '100%' }, styles.container]}
+        style={[{ backgroundColor: 'blue', height: '100%' }, [{ width: '50%' }], styles.container]}
       >
         <Text>Hello World</Text>
       </View>,
@@ -21,6 +21,7 @@ describe('.toHaveStyle', () => {
     expect(container).toHaveStyle({ backgroundColor: 'blue' });
     expect(container).toHaveStyle({ height: '100%' });
     expect(container).toHaveStyle({ color: 'white' });
+    expect(container).toHaveStyle({ width: '50%' });
   });
 
   test('handles negative test cases', () => {

diff --git a/src/to-have-style.js b/src/to-have-style.js
@@ -1,7 +1,7 @@
 import { matcherHint } from 'jest-matcher-utils';
 import jestDiff from 'jest-diff';
 import chalk from 'chalk';
-import { all, compose, mergeAll, toPairs } from 'ramda';
+import { all, compose, flatten, mergeAll, toPairs } from 'ramda';
 
 import { checkReactElement } from './utils';
 
@@ -12,6 +12,10 @@ function isSubset(expected, received) {
   )(expected);
 }
 
+function mergeAllStyles(styles) {
+  return compose(mergeAll, flatten)(styles);
+}
+
 function printoutStyles(styles) {
   return Object.keys(styles)
     .sort()
@@ -36,8 +40,8 @@ export function toHaveStyle(element, style) {
 
   const elementStyle = element.props.style;
 
-  const expected = Array.isArray(style) ? mergeAll(style) : style;
-  const received = Array.isArray(elementStyle) ? mergeAll(elementStyle) : elementStyle;
+  const expected = Array.isArray(style) ? mergeAllStyles(style) : style;
+  const received = Array.isArray(elementStyle) ? mergeAllStyles(elementStyle) : elementStyle;
 
   return {
     pass: isSubset(expected, received),