Allow PricingCard to render without info prop (#1250)

* Added check for none case in info props of PricingCard. * Updated tests for PricingCard. Added test for render without info. * Updated default props instead of adding condition check in render.
react-native-elements · Jul 5, 2018 · 72a2513 · 72a2513
1 parent 9e8498c
commit 72a2513
Show file tree

Hide file tree

Showing 3 changed files with 115 additions and 0 deletions.
diff --git a/src/pricing/PricingCard.js b/src/pricing/PricingCard.js
@@ -72,6 +72,7 @@ PricingCard.propTypes = {
 
 PricingCard.defaultProps = {
   color: colors.primary,
+  info: [],
 };
 
 const styles = StyleSheet.create({

diff --git a/src/pricing/__tests__/PricingCard.js b/src/pricing/__tests__/PricingCard.js
@@ -16,6 +16,15 @@ describe('PricingCard component', () => {
     expect(toJson(component)).toMatchSnapshot();
   });
 
+  it('should render without info', () => {
+    const component = shallow(
+      <PricingCard button={{ title: 'GET STARTED', icon: 'flight-takeoff' }} />
+    );
+
+    expect(component.length).toBe(1);
+    expect(toJson(component)).toMatchSnapshot();
+  });
+
   it('should render with props', () => {
     const component = shallow(
       <PricingCard

diff --git a/src/pricing/__tests__/__snapshots__/PricingCard.js.snap b/src/pricing/__tests__/__snapshots__/PricingCard.js.snap
@@ -174,6 +174,111 @@ exports[`PricingCard component should render with props 1`] = `
 </Component>
 `;
 
+exports[`PricingCard component should render without info 1`] = `
+<Component
+  style={
+    Array [
+      Object {
+        "backgroundColor": "white",
+        "borderColor": "#e1e8ee",
+        "borderWidth": 1,
+        "margin": 15,
+        "marginBottom": 15,
+        "padding": 15,
+        "shadowColor": "rgba(0,0,0, .2)",
+        "shadowOffset": Object {
+          "height": 1,
+          "width": 0,
+        },
+        "shadowOpacity": 0.5,
+        "shadowRadius": 0.5,
+      },
+      undefined,
+    ]
+  }
+>
+  <Component
+    style={
+      Array [
+        Object {
+          "backgroundColor": "transparent",
+        },
+        undefined,
+      ]
+    }
+  >
+    <TextElement
+      style={
+        Array [
+          Object {
+            "color": "#2089dc",
+            "fontSize": 37.5,
+            "fontWeight": "800",
+            "textAlign": "center",
+          },
+          undefined,
+          Object {
+            "color": "#2089dc",
+          },
+        ]
+      }
+    />
+    <TextElement
+      style={
+        Array [
+          Object {
+            "fontSize": 50,
+            "fontWeight": "700",
+            "marginBottom": 10,
+            "marginTop": 10,
+            "textAlign": "center",
+          },
+          undefined,
+        ]
+      }
+    />
+    <Button
+      TouchableComponent={[Function]}
+      buttonStyle={
+        Array [
+          Object {
+            "marginBottom": 10,
+            "marginTop": 15,
+          },
+          undefined,
+          Object {
+            "backgroundColor": "#2089dc",
+          },
+        ]
+      }
+      clear={false}
+      disabled={false}
+      icon={
+        <Icon
+          color="white"
+          name="flight-takeoff"
+          raised={false}
+          reverse={false}
+          reverseColor="white"
+          size={15}
+          underlayColor="white"
+        />
+      }
+      iconRight={false}
+      loadingProps={
+        Object {
+          "color": "white",
+          "size": "small",
+        }
+      }
+      onPress={[Function]}
+      raised={false}
+      title="GET STARTED"
+    />
+  </Component>
+</Component>
+`;
+
 exports[`PricingCard component should render without issues 1`] = `
 <Component
   style={