Merge pull request #195 from meriadec/master

Add snapshot tests from FormattedVal

.eslintrc

@@ -5,6 +5,7 @@
   "globals": {
     "__ENV__": false,
     "__DEV__": false,
+    "__TEST__": false,
     "__PROD__": false,
     "__SENTRY_URL__": false,
     "__PRINT_MODE__": false,
@@ -17,6 +18,7 @@
     "jest": false,
     "describe": false,
     "test": false,
+    "it": false,
     "expect": false,
   },
   "rules": {

flow-defs/globals.js

@@ -1,6 +1,7 @@
 /* eslint-disable */
 
 declare var __DEV__: boolean
+declare var __TEST__: boolean
 declare var __PROD__: boolean
 declare var __ENV__: string
 declare var __PRINT_MODE__: string

jest.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  globals: {
+    __DEV__: true,
+    __TEST__: true,
+  },
+}

package.json

@@ -141,6 +141,7 @@
     "node-loader": "^0.6.0",
     "prettier": "^1.11.1",
     "react-hot-loader": "^4.0.0",
+    "react-test-renderer": "^16.2.0",
     "webpack": "^3.11.0"
   }
 }

src/components/base/FormattedVal/__tests__/FormattedVal.test.js

@@ -0,0 +1,45 @@
+import React from 'react'
+import { getDefaultUnitByCoinType } from '@ledgerhq/currencies'
+
+import { render } from 'test-utils'
+import FormattedVal from '..'
+
+const bitcoinUnit = getDefaultUnitByCoinType(0)
+
+describe('components', () => {
+  describe('FormattedVal', () => {
+    it('renders a formatted val', () => {
+      const component = <FormattedVal unit={bitcoinUnit} val={400000000} />
+      const tree = render(component)
+      expect(tree).toMatchSnapshot()
+    })
+
+    it('shows sign', () => {
+      const component = <FormattedVal alwaysShowSign unit={bitcoinUnit} val={400000000} />
+      const tree = render(component)
+      expect(tree).toMatchSnapshot()
+
+      const component2 = <FormattedVal alwaysShowSign unit={bitcoinUnit} val={-400000000} />
+      const tree2 = render(component2)
+      expect(tree2).toMatchSnapshot()
+    })
+
+    it('shows code', () => {
+      const component = <FormattedVal showCode unit={bitcoinUnit} val={400000000} />
+      const tree = render(component)
+      expect(tree).toMatchSnapshot()
+    })
+
+    it('renders a percent', () => {
+      const component = <FormattedVal isPercent val={30} />
+      const tree = render(component)
+      expect(tree).toMatchSnapshot()
+    })
+
+    it('renders a fiat', () => {
+      const component = <FormattedVal fiat="USD" val={20} />
+      const tree = render(component)
+      expect(tree).toMatchSnapshot()
+    })
+  })
+})

src/components/base/FormattedVal/__tests__/__snapshots__/FormattedVal.test.js.snap

@@ -0,0 +1,55 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`components FormattedVal renders a fiat 1`] = `
+<span
+  className="FormattedVal__T-fevxLy hYRXSf Text-bUpXnE eCVsWd"
+  color="#96d071"
+>
+  20.00
+</span>
+`;
+
+exports[`components FormattedVal renders a formatted val 1`] = `
+<span
+  className="FormattedVal__T-fevxLy hYRXSf Text-bUpXnE eCVsWd"
+  color="#96d071"
+>
+  4
+</span>
+`;
+
+exports[`components FormattedVal renders a percent 1`] = `
+<span
+  className="FormattedVal__T-fevxLy hYRXSf Text-bUpXnE eCVsWd"
+  color="#96d071"
+>
+  30 %
+</span>
+`;
+
+exports[`components FormattedVal shows code 1`] = `
+<span
+  className="FormattedVal__T-fevxLy hYRXSf Text-bUpXnE eCVsWd"
+  color="#96d071"
+>
+  BTC 4
+</span>
+`;
+
+exports[`components FormattedVal shows sign 1`] = `
+<span
+  className="FormattedVal__T-fevxLy hYRXSf Text-bUpXnE eCVsWd"
+  color="#96d071"
+>
+  + 4
+</span>
+`;
+
+exports[`components FormattedVal shows sign 2`] = `
+<span
+  className="FormattedVal__T-fevxLy hYRXSf Text-bUpXnE fjJBpt"
+  color="#fa4352"
+>
+  - 4
+</span>
+`;

src/helpers/staticPath.js

@@ -1,7 +1,8 @@
 const isStorybook = process.env.STORYBOOK_ENV
-const isRunningInAsar = !isStorybook && process.mainModule.filename.indexOf('app.asar') !== -1
+const isRunningInAsar =
+  !isStorybook && process.mainModule && process.mainModule.filename.indexOf('app.asar') !== -1
 
-export default (__DEV__ && !isStorybook
+export default (__DEV__ && !isStorybook && !__TEST__
   ? __static
   : isRunningInAsar
     ? __dirname.replace(/app\.asar$/, 'static')

src/test-utils.js

@@ -0,0 +1,9 @@
+import React from 'react'
+import renderer from 'react-test-renderer'
+import { ThemeProvider } from 'styled-components'
+
+import theme from 'styles/theme'
+
+export function render(component) {
+  return renderer.create(<ThemeProvider theme={theme}>{component}</ThemeProvider>).toJSON()
+}

yarn.lock

@@ -8309,6 +8309,14 @@ react-style-proptype@^3.0.0:
   dependencies:
     prop-types "^15.5.4"
 
+react-test-renderer@^16.2.0:
+  version "16.2.0"
+  resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-16.2.0.tgz#bddf259a6b8fcd8555f012afc8eacc238872a211"
+  dependencies:
+    fbjs "^0.8.16"
+    object-assign "^4.1.1"
+    prop-types "^15.6.0"
+
 react-textarea-autosize@^5.2.1:
   version "5.2.1"
   resolved "https://registry.yarnpkg.com/react-textarea-autosize/-/react-textarea-autosize-5.2.1.tgz#2b78f9067180f41b08ac59f78f1581abadd61e54"