added test and fixed story book for ShipmentCard by using the unconne…

…cted constructor rather than the default ( import {ShipmentCard} vs import ShipmentCard)
IBM-Cloud · Jan 17, 2017 · e4d1487 · e4d1487
1 parent 7f963d6
commit e4d1487
Show file tree

Hide file tree

Showing 4 changed files with 113 additions and 27 deletions.
diff --git a/src/routes/Dashboard/components/ForecastTile/ForecastTile.test.js b/src/routes/Dashboard/components/ForecastTile/ForecastTile.test.js
@@ -0,0 +1,22 @@
+import test from 'ava';
+import React from 'react';
+import { shallow } from 'enzyme';
+import ForecastTile from './ForecastTile';
+
+test('(Component) ForecastTile shows progress when no weather.', t => {
+  const props = { };
+  const component = shallow(<ForecastTile {...props} />);
+  t.is(component.find('LoadingSpinner').length, 1, 'has a loading spinner');
+  t.is(component.find('Table').length, 0, 'has no forecasts table');
+});
+
+test('(Component) ForecastTile shows table when weather.', t => {
+  const props = {
+    weather: {
+      forecasts: [],
+    },
+  };
+  const component = shallow(<ForecastTile {...props} />);
+  t.is(component.find('LoadingSpinner').length, 0, 'has no loading spinner');
+  t.is(component.find('Table').length, 1, 'has a forecasts table');
+});
diff --git a/src/routes/Dashboard/components/Map/PopUpCard/ShipmentCard/ShipmentCard.jsx b/src/routes/Dashboard/components/Map/PopUpCard/ShipmentCard/ShipmentCard.jsx
@@ -65,14 +65,18 @@ export class ShipmentCard extends React.PureComponent {
         </div>
         <div>{updatedAt ? formatTime(updatedAt) : 'N/A'}</div>
 
-        <div className={classes.subtitle}>
-          Current Weather
-        </div>
-        <div>
-          {currentLocation.weather ?
-           currentLocation.weather.observation.wx_phrase :
-           (<div style={{ textAlign: 'center' }}><LoadingSpinner size={60} /></div>)}
-        </div>
+        {currentLocation &&
+          <div>
+            <div className={classes.subtitle}>
+              Current Weather
+            </div>
+            <div>
+              {currentLocation.weather ?
+               currentLocation.weather.observation.wx_phrase :
+               (<div style={{ textAlign: 'center' }}><LoadingSpinner size={60} /></div>)}
+            </div>
+          </div>
+        }
       </div>
     );
   }

diff --git a/src/routes/Dashboard/components/Map/PopUpCard/ShipmentCard/ShipmentCard.story.js b/src/routes/Dashboard/components/Map/PopUpCard/ShipmentCard/ShipmentCard.story.js
@@ -1,23 +1,26 @@
 import React from 'react';
 import { storiesOf } from '@kadira/storybook';
-import ShipmentCard from './ShipmentCard';
+import { ShipmentCard } from './ShipmentCard';
 
-const shipment1 = {
-  toId: 462,
-  estimatedTimeOfArrival: '2016-10-22T00:00:00.000Z',
-  status: 'DELIVERED',
-  updatedAt: '2016-10-20T12:15:37.000Z',
-  currentLocation: {
-    state: 'Texas',
-    latitude: 32.74,
-    country: 'US',
-    longitude: -96.8,
-    city: 'Dallas',
+const props1 = {
+  shipment: {
+    toId: 462,
+    estimatedTimeOfArrival: '2016-10-22T00:00:00.000Z',
+    status: 'DELIVERED',
+    updatedAt: '2016-10-20T12:15:37.000Z',
+    currentLocation: {
+      state: 'Texas',
+      latitude: 32.74,
+      country: 'US',
+      longitude: -96.8,
+      city: 'Dallas',
+    },
+    fromId: 2,
+    deliveredAt: null,
+    createdAt: '2016-09-08T16:26:16.933Z',
+    id: 810,
   },
-  fromId: 2,
-  deliveredAt: null,
-  createdAt: '2016-09-08T16:26:16.933Z',
-  id: 810,
+  retrieveWeatherObservations: () => {},
 };
 const shipment2 = {
   toId: 473,
@@ -32,9 +35,7 @@ const shipment2 = {
 };
 storiesOf('ShipmentCard', module)
   .add('shipment1', () => (
-    <ShipmentCard
-      shipment={shipment1}
-    />
+    <ShipmentCard {...props1} />
 )).add('shipment2', () => (
   <ShipmentCard
     shipment={shipment2}

diff --git a/src/routes/Dashboard/components/Map/PopUpCard/ShipmentCard/ShipmentCard.test.js b/src/routes/Dashboard/components/Map/PopUpCard/ShipmentCard/ShipmentCard.test.js
@@ -0,0 +1,59 @@
+import test from 'ava';
+import React from 'react';
+import { shallow } from 'enzyme';
+import { ShipmentCard } from './ShipmentCard';
+
+test('(Component) ShipmentCard shows a progress when no weather data.', t => {
+  const props = {
+    shipment: {
+      toId: 462,
+      estimatedTimeOfArrival: '2016-10-22T00:00:00.000Z',
+      status: 'DELIVERED',
+      updatedAt: '2016-10-20T12:15:37.000Z',
+      currentLocation: {
+        state: 'Texas',
+        latitude: 32.74,
+        country: 'US',
+        longitude: -96.8,
+        city: 'Dallas',
+      },
+      fromId: 2,
+      deliveredAt: null,
+      createdAt: '2016-09-08T16:26:16.933Z',
+      id: 810,
+    },
+    retrieveWeatherObservations: () => {},
+  };
+  const component = shallow(<ShipmentCard {...props} />);
+  t.is(component.find('LoadingSpinner').length, 1, 'has a loading spinner');
+});
+
+test('(Component) ShipmentCard shows current weather when it exists.', t => {
+  const props = {
+    shipment: {
+      toId: 462,
+      estimatedTimeOfArrival: '2016-10-22T00:00:00.000Z',
+      status: 'DELIVERED',
+      updatedAt: '2016-10-20T12:15:37.000Z',
+      currentLocation: {
+        state: 'Texas',
+        latitude: 32.74,
+        country: 'US',
+        longitude: -96.8,
+        city: 'Dallas',
+        weather: {
+          observation: {
+            wx_phrase: 'Good weather',
+          },
+        },
+      },
+      fromId: 2,
+      deliveredAt: null,
+      createdAt: '2016-09-08T16:26:16.933Z',
+      id: 810,
+    },
+    retrieveWeatherObservations: () => {},
+  };
+  const component = shallow(<ShipmentCard {...props} />);
+  t.true(component.text().indexOf('Good weather') > 0, 'has weather info');
+});