Merge pull request #38 from ummahusla/feature/unit-test-coverage-impr…

…ovement

Improve unit test coverage improvement

package.json

@@ -1,6 +1,6 @@
 {
     "name": "react-simple-card",
-    "version": "2.0.2",
+    "version": "2.0.3",
     "description": "Simple React card component",
     "author": "ummahusla",
     "license": "MIT",
@@ -18,13 +18,20 @@
     ],
     "scripts": {
         "test": "react-scripts-ts test --env=jsdom",
-        "coverage": "react-scripts-ts test --env=jsdom --coverage && cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js",
+        "coverage": "CI=true react-scripts-ts test --env=jsdom --coverage && cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js",
         "build": "rollup -c",
         "start": "rollup -c -w",
         "prepare": "yarn run build",
         "predeploy": "cd example && yarn install && yarn run build",
         "deploy": "npm publish"
     },
+    "jest": {
+        "collectCoverageFrom": [
+            "src/**/*.{tsx}",
+            "!/node_modules/",
+            "!src/index.tsx"
+        ]
+    },
     "peerDependencies": {
         "prop-types": "^15.5.4",
         "react": "^15.0.0 || ^16.0.0",

src/components/Card/index.tsx

@@ -23,6 +23,7 @@ export default ({
         backgroundColor: bgColor,
         color: fontColor
     };
+
     return (
         <div className={classNames('card', className)} style={styles}>
             {children}

src/components/ImageHeader/__snapshots__/index.spec.tsx.snap

@@ -5,7 +5,23 @@ exports[`renders ImageHeader correctly 1`] = `
   className="card__header--image"
 >
   <img
-    alt=""
+    alt="Alt text for the image"
+    src="http://via.placeholder.com/350x200"
+  />
+</div>
+`;
+
+exports[`renders ImageHeader correctly with className and extra styles 1`] = `
+<div
+  className="card__header--image image-wrapper"
+  style={
+    Object {
+      "padding": "3px",
+    }
+  }
+>
+  <img
+    alt="Alt text for the image"
     src="http://via.placeholder.com/350x200"
   />
 </div>

src/components/ImageHeader/index.spec.tsx

@@ -5,6 +5,20 @@ import toJson from 'enzyme-to-json';
 import ImageHeader from './';
 
 it('renders ImageHeader correctly', () => {
-    const wrapper = shallow(<ImageHeader imageSrc="http://via.placeholder.com/350x200" />);
+    const wrapper = shallow(
+        <ImageHeader alt="Alt text for the image" imageSrc="http://via.placeholder.com/350x200" />
+    );
+    expect(toJson(wrapper)).toMatchSnapshot();
+});
+
+it('renders ImageHeader correctly with className and extra styles', () => {
+    const wrapper = shallow(
+        <ImageHeader
+            className="image-wrapper"
+            style={{ padding: '3px' }}
+            alt="Alt text for the image"
+            imageSrc="http://via.placeholder.com/350x200"
+        />
+    );
     expect(toJson(wrapper)).toMatchSnapshot();
 });

src/components/ImageHeader/index.tsx

@@ -10,10 +10,8 @@ export type ImageHeaderProps = {
     className?: string;
 };
 
-export default ({ className, style, imageSrc, alt = '' }: ImageHeaderProps) => {
-    return (
-        <div className={classNames('card__header--image', className)} style={style}>
-            <img src={imageSrc} alt={alt} />
-        </div>
-    );
-};
+export default ({ className, style, imageSrc, alt = '' }: ImageHeaderProps) => (
+    <div className={classNames('card__header--image', className)} style={style}>
+        <img src={imageSrc} alt={alt} />
+    </div>
+);