From 461f43eb7fb3adde77c5311d69e29184ce717586 Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Fri, 25 Jan 2019 17:44:01 -0300
Subject: [PATCH 01/14] feat(test-components): generate snapshots
---
.../__snapshots__/Sidebar.test.js.snap | 50 ++++++-
.../__snapshots__/button.test.js.snap | 11 ++
.../__snapshots__/clipboard.test.js.snap | 11 ++
.../__snapshots__/confirm-dialog.test.js.snap | 9 ++
.../__snapshots__/dropdown.test.js.snap | 15 ++
.../__snapshots__/input.test.js.snap | 34 +++++
.../__snapshots__/modal.test.js.snap | 11 ++
.../__snapshots__/qrcode.test.js.snap | 11 ++
.../transactions-daily.test.js.snap | 137 ++++++++++++++++++
.../__snapshots__/wallet-address.test.js.snap | 32 ++++
10 files changed, 319 insertions(+), 2 deletions(-)
create mode 100644 __tests__/components/__snapshots__/button.test.js.snap
create mode 100644 __tests__/components/__snapshots__/clipboard.test.js.snap
create mode 100644 __tests__/components/__snapshots__/confirm-dialog.test.js.snap
create mode 100644 __tests__/components/__snapshots__/dropdown.test.js.snap
create mode 100644 __tests__/components/__snapshots__/input.test.js.snap
create mode 100644 __tests__/components/__snapshots__/modal.test.js.snap
create mode 100644 __tests__/components/__snapshots__/qrcode.test.js.snap
create mode 100644 __tests__/components/__snapshots__/transactions-daily.test.js.snap
create mode 100644 __tests__/components/__snapshots__/wallet-address.test.js.snap
diff --git a/__tests__/components/__snapshots__/Sidebar.test.js.snap b/__tests__/components/__snapshots__/Sidebar.test.js.snap
index 16268ac..d944fb0 100644
--- a/__tests__/components/__snapshots__/Sidebar.test.js.snap
+++ b/__tests__/components/__snapshots__/Sidebar.test.js.snap
@@ -1,30 +1,76 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[` render() should render correctly 1`] = `
+exports[` render() should render correctly 1`] = `
`;
diff --git a/__tests__/components/__snapshots__/button.test.js.snap b/__tests__/components/__snapshots__/button.test.js.snap
new file mode 100644
index 0000000..1691ef6
--- /dev/null
+++ b/__tests__/components/__snapshots__/button.test.js.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render button correctly 1`] = `
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/clipboard.test.js.snap b/__tests__/components/__snapshots__/clipboard.test.js.snap
new file mode 100644
index 0000000..2f0dde4
--- /dev/null
+++ b/__tests__/components/__snapshots__/clipboard.test.js.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render clipboard component correctly 1`] = `
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/confirm-dialog.test.js.snap b/__tests__/components/__snapshots__/confirm-dialog.test.js.snap
new file mode 100644
index 0000000..81a2b02
--- /dev/null
+++ b/__tests__/components/__snapshots__/confirm-dialog.test.js.snap
@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render confirm dialog correctly 1`] = `
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/dropdown.test.js.snap b/__tests__/components/__snapshots__/dropdown.test.js.snap
new file mode 100644
index 0000000..a618be6
--- /dev/null
+++ b/__tests__/components/__snapshots__/dropdown.test.js.snap
@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render dropdown correctly 1`] = `
+
+
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/input.test.js.snap b/__tests__/components/__snapshots__/input.test.js.snap
new file mode 100644
index 0000000..75f90f5
--- /dev/null
+++ b/__tests__/components/__snapshots__/input.test.js.snap
@@ -0,0 +1,34 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render text input correctly 1`] = `
+
+`;
+
+exports[` render() should render textarea correctly 1`] = `
+
+`;
diff --git a/__tests__/components/__snapshots__/modal.test.js.snap b/__tests__/components/__snapshots__/modal.test.js.snap
new file mode 100644
index 0000000..9620f72
--- /dev/null
+++ b/__tests__/components/__snapshots__/modal.test.js.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render modal correctly 1`] = `
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/qrcode.test.js.snap b/__tests__/components/__snapshots__/qrcode.test.js.snap
new file mode 100644
index 0000000..e5a5d38
--- /dev/null
+++ b/__tests__/components/__snapshots__/qrcode.test.js.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render qrcode component correctly 1`] = `
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/transactions-daily.test.js.snap b/__tests__/components/__snapshots__/transactions-daily.test.js.snap
new file mode 100644
index 0000000..4c9200a
--- /dev/null
+++ b/__tests__/components/__snapshots__/transactions-daily.test.js.snap
@@ -0,0 +1,137 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render user daily transactions 1`] = `
+
+
+
+ 2019-01-25T20:38:40.521Z
+
+
+
+
+
+
+
+
+ received
+
+
+ 17:38 PM
+
+
+
+
+ 12345678912345678912...9123456789
+
+
+
+
+ -ZEC 1.789
+
+
+ -USD $0
+
+
+
+
+
+
+
+
+
+
+ sent
+
+
+ 17:38 PM
+
+
+
+
+ 12345678912345678912...9123456789
+
+
+
+
+ -ZEC 0.846
+
+
+ -USD $0
+
+
+
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/wallet-address.test.js.snap b/__tests__/components/__snapshots__/wallet-address.test.js.snap
new file mode 100644
index 0000000..fc8cc34
--- /dev/null
+++ b/__tests__/components/__snapshots__/wallet-address.test.js.snap
@@ -0,0 +1,32 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render wallet address component correctly 1`] = `
+
+
+
+
+
+
+
+
+
+
+`;
From ad34afc1236a0f6d09f312a5335aed9baeae51b6 Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Fri, 25 Jan 2019 17:44:54 -0300
Subject: [PATCH 02/14] feat(test-components): create test files for components
---
__tests__/components/button.test.js | 28 +++++++++++
__tests__/components/clipboard.test.js | 25 ++++++++++
__tests__/components/confirm-dialog.test.js | 27 +++++++++++
__tests__/components/dropdown.test.js | 40 ++++++++++++++++
__tests__/components/input.test.js | 44 ++++++++++++++++++
__tests__/components/modal.test.js | 36 +++++++++++++++
__tests__/components/qrcode.test.js | 21 +++++++++
__tests__/components/sidebar.test.js | 16 +++++--
.../components/transactions-daily.test.js | 46 +++++++++++++++++++
__tests__/components/wallet-address.test.js | 29 ++++++++++++
10 files changed, 307 insertions(+), 5 deletions(-)
create mode 100644 __tests__/components/button.test.js
create mode 100644 __tests__/components/clipboard.test.js
create mode 100644 __tests__/components/confirm-dialog.test.js
create mode 100644 __tests__/components/dropdown.test.js
create mode 100644 __tests__/components/input.test.js
create mode 100644 __tests__/components/modal.test.js
create mode 100644 __tests__/components/qrcode.test.js
create mode 100644 __tests__/components/transactions-daily.test.js
create mode 100644 __tests__/components/wallet-address.test.js
diff --git a/__tests__/components/button.test.js b/__tests__/components/button.test.js
new file mode 100644
index 0000000..1eef549
--- /dev/null
+++ b/__tests__/components/button.test.js
@@ -0,0 +1,28 @@
+// @flow
+
+import React from 'react';
+import { render, cleanup } from 'react-testing-library';
+import { ThemeProvider } from 'styled-components';
+import 'jest-dom/extend-expect';
+
+import { Button } from '../../app/components/button';
+import appTheme from '../../app/theme';
+
+afterEach(cleanup);
+
+describe('', () => {
+ describe('render()', () => {
+ test('should render button correctly', () => {
+ const { container } = render(
+
+
+ );
+
+ expect(container).toMatchSnapshot();
+ });
+ });
+});
diff --git a/__tests__/components/clipboard.test.js b/__tests__/components/clipboard.test.js
new file mode 100644
index 0000000..0adf843
--- /dev/null
+++ b/__tests__/components/clipboard.test.js
@@ -0,0 +1,25 @@
+// @flow
+
+import React from 'react';
+import { render, cleanup } from 'react-testing-library';
+import { ThemeProvider } from 'styled-components';
+import 'jest-dom/extend-expect';
+
+import { Clipboard } from '../../app/components/clipboard';
+import appTheme from '../../app/theme';
+
+afterEach(cleanup);
+
+describe('', () => {
+ describe('render()', () => {
+ test('should render clipboard component correctly', () => {
+ const { container } = render(
+
+
+ ,
+ );
+
+ expect(container).toMatchSnapshot();
+ });
+ });
+});
diff --git a/__tests__/components/confirm-dialog.test.js b/__tests__/components/confirm-dialog.test.js
new file mode 100644
index 0000000..d46d49a
--- /dev/null
+++ b/__tests__/components/confirm-dialog.test.js
@@ -0,0 +1,27 @@
+// @flow
+
+import React from 'react';
+import { render, cleanup } from 'react-testing-library';
+import 'jest-dom/extend-expect';
+
+import { ConfirmDialogComponent } from '../../app/components/confirm-dialog';
+
+afterEach(cleanup);
+
+describe('', () => {
+ describe('render()', () => {
+ test('should render confirm dialog correctly', () => {
+ const { container } = render(
+ alert('Confirm')}
+ renderTrigger={toggle => }
+ >
+ {toggle => Confirm content
}
+ ,
+ );
+
+ expect(container).toMatchSnapshot();
+ });
+ });
+});
diff --git a/__tests__/components/dropdown.test.js b/__tests__/components/dropdown.test.js
new file mode 100644
index 0000000..a6e655a
--- /dev/null
+++ b/__tests__/components/dropdown.test.js
@@ -0,0 +1,40 @@
+// @flow
+
+import React from 'react';
+import { render, cleanup } from 'react-testing-library';
+import { ThemeProvider } from 'styled-components';
+import 'jest-dom/extend-expect';
+
+import { DropdownComponent } from '../../app/components/dropdown';
+import { Button } from '../../app/components/button';
+import appTheme from '../../app/theme';
+
+afterEach(cleanup);
+
+describe('', () => {
+ describe('render()', () => {
+ test('should render dropdown correctly', () => {
+ const { container } = render(
+
+
+ (
+
+ )}
+ options={[
+ { label: 'asbh1yeasbdh23848asdasd', onClick: console.log },
+ { label: 'urtyruhjr374hbfdjdhuh', onClick: console.log },
+ ]}
+ />
+
+ ,
+ );
+
+ expect(container).toMatchSnapshot();
+ });
+ });
+});
diff --git a/__tests__/components/input.test.js b/__tests__/components/input.test.js
new file mode 100644
index 0000000..fb5ced4
--- /dev/null
+++ b/__tests__/components/input.test.js
@@ -0,0 +1,44 @@
+// @flow
+
+import React from 'react';
+import { render, cleanup } from 'react-testing-library';
+import { ThemeProvider } from 'styled-components';
+import 'jest-dom/extend-expect';
+
+import { InputComponent } from '../../app/components/input';
+import appTheme from '../../app/theme';
+
+afterEach(cleanup);
+
+describe('', () => {
+ describe('render()', () => {
+ test('should render text input correctly', () => {
+ const { container } = render(
+
+
+
+ );
+
+ expect(container).toMatchSnapshot();
+ });
+
+ test('should render textarea correctly', () => {
+ const { container } = render(
+
+
+
+ );
+
+ expect(container).toMatchSnapshot();
+ });
+ });
+});
diff --git a/__tests__/components/modal.test.js b/__tests__/components/modal.test.js
new file mode 100644
index 0000000..0f5bfd5
--- /dev/null
+++ b/__tests__/components/modal.test.js
@@ -0,0 +1,36 @@
+// @flow
+
+import React from 'react';
+import { render, cleanup } from 'react-testing-library';
+import 'jest-dom/extend-expect';
+
+import { ModalComponent } from '../../app/components/modal';
+
+afterEach(cleanup);
+
+describe('', () => {
+ describe('render()', () => {
+ test('should render modal correctly', () => {
+ const { container } = render(
+ (
+
+ )}
+ >
+ {toggleVisibility => (
+
+ Modal Content
+
+
+ )}
+ ,
+ );
+
+ expect(container).toMatchSnapshot();
+ });
+ });
+});
diff --git a/__tests__/components/qrcode.test.js b/__tests__/components/qrcode.test.js
new file mode 100644
index 0000000..59adc3d
--- /dev/null
+++ b/__tests__/components/qrcode.test.js
@@ -0,0 +1,21 @@
+// @flow
+
+import React from 'react';
+import { render, cleanup } from 'react-testing-library';
+import 'jest-dom/extend-expect';
+
+import { QRCode } from '../../app/components/qrcode';
+
+afterEach(cleanup);
+
+describe('', () => {
+ describe('render()', () => {
+ test('should render qrcode component correctly', () => {
+ const { container } = render(
+ ,
+ );
+
+ expect(container).toMatchSnapshot();
+ });
+ });
+});
diff --git a/__tests__/components/sidebar.test.js b/__tests__/components/sidebar.test.js
index 76975bd..602c093 100644
--- a/__tests__/components/sidebar.test.js
+++ b/__tests__/components/sidebar.test.js
@@ -1,20 +1,26 @@
// @flow
import React from 'react';
-import { render } from 'react-testing-library';
+import { render, cleanup } from 'react-testing-library';
import { MemoryRouter } from 'react-router-dom';
+import { ThemeProvider } from 'styled-components';
import 'jest-dom/extend-expect';
import { SidebarComponent } from '../../app/components/sidebar';
+import appTheme from '../../app/theme';
-describe('', () => {
+afterEach(cleanup);
+
+describe('', () => {
describe('render()', () => {
test('should render correctly', () => {
// $FlowFixMe
const { asFragment } = render(
-
-
- ,
+
+
+
+
+ ,
);
expect(asFragment()).toMatchSnapshot();
diff --git a/__tests__/components/transactions-daily.test.js b/__tests__/components/transactions-daily.test.js
new file mode 100644
index 0000000..a999ded
--- /dev/null
+++ b/__tests__/components/transactions-daily.test.js
@@ -0,0 +1,46 @@
+// @flow
+
+import React from 'react';
+import { render, cleanup } from 'react-testing-library';
+import { ThemeProvider } from 'styled-components';
+import 'jest-dom/extend-expect';
+
+import { TransactionDailyComponent } from '../../app/components/transaction-daily';
+import appTheme from '../../app/theme';
+
+afterEach(cleanup);
+
+describe('', () => {
+ describe('render()', () => {
+ test('should render user daily transactions', () => {
+ const { container } = render(
+
+
+ ,
+ );
+
+ expect(container).toMatchSnapshot();
+ });
+ });
+});
diff --git a/__tests__/components/wallet-address.test.js b/__tests__/components/wallet-address.test.js
new file mode 100644
index 0000000..d311243
--- /dev/null
+++ b/__tests__/components/wallet-address.test.js
@@ -0,0 +1,29 @@
+// @flow
+
+import React from 'react';
+import { render, cleanup } from 'react-testing-library';
+import { ThemeProvider } from 'styled-components';
+import 'jest-dom/extend-expect';
+
+import { WalletAddress } from '../../app/components/wallet-address';
+import appTheme from '../../app/theme';
+
+afterEach(cleanup);
+
+describe('', () => {
+ describe('render()', () => {
+ test('should render wallet address component correctly', () => {
+ const { container } = render(
+
+
+
+
+ ,
+ );
+
+ expect(container).toMatchSnapshot();
+ });
+ });
+});
From 978fe5c3c7275cd7733a878cf4a0669f9d71bf55 Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Fri, 25 Jan 2019 17:46:16 -0300
Subject: [PATCH 03/14] chore(test-components): add missing semicolon
---
app/components/sidebar.js | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/app/components/sidebar.js b/app/components/sidebar.js
index a0fc896..96b33ea 100644
--- a/app/components/sidebar.js
+++ b/app/components/sidebar.js
@@ -10,7 +10,7 @@ const Wrapper = styled.div`
flex-direction: column;
width: ${props => props.theme.sidebarWidth};
height: ${props => `calc(100vh - ${props.theme.headerHeight})`};
- font-family: ${props => props.theme.fontFamily}
+ font-family: ${props => props.theme.fontFamily};
background-color: ${props => props.theme.colors.sidebarBg};
padding-top: 15px;
position: relative;
From ae25a9a489741223037e029d6f8609714671eb53 Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Fri, 25 Jan 2019 17:47:13 -0300
Subject: [PATCH 04/14] fix(test-components): wallet summary tests
---
__tests__/reducers/wallet-summary.test.js | 16 ++++++++++++----
1 file changed, 12 insertions(+), 4 deletions(-)
diff --git a/__tests__/reducers/wallet-summary.test.js b/__tests__/reducers/wallet-summary.test.js
index 7095f5e..2a88ff9 100644
--- a/__tests__/reducers/wallet-summary.test.js
+++ b/__tests__/reducers/wallet-summary.test.js
@@ -8,12 +8,14 @@ import walletSummaryReducer, {
describe('WalletSummary Reducer', () => {
test('should return the valid initial state', () => {
const initialState = {
+ addresses: [],
+ transactions: [],
total: 0,
shielded: 0,
transparent: 0,
error: null,
isLoading: false,
- dollarValue: 0,
+ zecPrice: 0,
};
const action = {
type: 'UNKNOWN_ACTION',
@@ -29,12 +31,14 @@ describe('WalletSummary Reducer', () => {
payload: {},
};
const expectedState = {
+ addresses: [],
+ transactions: [],
total: 0,
shielded: 0,
transparent: 0,
error: null,
isLoading: true,
- dollarValue: 0,
+ zecPrice: 0,
};
expect(walletSummaryReducer(undefined, action)).toEqual(expectedState);
@@ -53,7 +57,9 @@ describe('WalletSummary Reducer', () => {
...action.payload,
error: null,
isLoading: false,
- dollarValue: 0,
+ addresses: [],
+ transactions: [],
+ zecPrice: 0,
};
expect(walletSummaryReducer(undefined, action)).toEqual(expectedState);
@@ -72,7 +78,9 @@ describe('WalletSummary Reducer', () => {
transparent: 0,
error: action.payload.error,
isLoading: false,
- dollarValue: 0,
+ addresses: [],
+ transactions: [],
+ zecPrice: 0
};
expect(walletSummaryReducer(undefined, action)).toEqual(expectedState);
From 2d512c8b0413c2730d0e88cd91a5845c34118618 Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Fri, 25 Jan 2019 17:47:52 -0300
Subject: [PATCH 05/14] chore(test-components): remove status pill docz story
---
app/components/status-pill.mdx | 22 ----------------------
1 file changed, 22 deletions(-)
delete mode 100644 app/components/status-pill.mdx
diff --git a/app/components/status-pill.mdx b/app/components/status-pill.mdx
deleted file mode 100644
index d013575..0000000
--- a/app/components/status-pill.mdx
+++ /dev/null
@@ -1,22 +0,0 @@
----
-name: StatusPill
----
-
-import { Playground, PropsTable } from 'docz'
-
-import { StatusPill } from './status-pill.js'
-import { DoczWrapper } from '../theme.js'
-
-# StatusPill
-
-## Properties
-
-
-
-## Basic Usage
-
-
-
- {() => }
-
-
From 685113ef2e06504d89c3074ecacfba58ed536c20 Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Fri, 25 Jan 2019 17:48:42 -0300
Subject: [PATCH 06/14] feat(test-components): add asset resolver for jest
---
package.json | 5 ++++-
1 file changed, 4 insertions(+), 1 deletion(-)
diff --git a/package.json b/package.json
index 32c8066..a093d0b 100644
--- a/package.json
+++ b/package.json
@@ -175,7 +175,10 @@
"setupTestFrameworkScriptFile": "/__tests__/setup/jest.js",
"testPathIgnorePatterns": [
"/__tests__/setup/"
- ]
+ ],
+ "moduleNameMapper": {
+ "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "/__tests__/setup/assetTransformer.js"
+ }
},
"resolutions": {
"babel-core": "7.0.0-bridge.0"
From e5f43dff4a6c361f47b81b1bd37840dff22dd467 Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Fri, 25 Jan 2019 17:49:01 -0300
Subject: [PATCH 07/14] feat(test-components): add asset resolver for jest
---
__tests__/setup/assetTransformer.js | 7 +++++++
1 file changed, 7 insertions(+)
create mode 100644 __tests__/setup/assetTransformer.js
diff --git a/__tests__/setup/assetTransformer.js b/__tests__/setup/assetTransformer.js
new file mode 100644
index 0000000..1f173b0
--- /dev/null
+++ b/__tests__/setup/assetTransformer.js
@@ -0,0 +1,7 @@
+const path = require('path');
+
+module.exports = {
+ process(filename) {
+ return 'module.exports = ' + JSON.stringify(path.basename(filename)) + ';';
+ },
+};
\ No newline at end of file
From f9743f50a21d75c5ab7f2ca5e9e2a470126d6a45 Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Mon, 28 Jan 2019 15:11:13 -0300
Subject: [PATCH 08/14] feat(test-components): split visual from logic in
status-pill
---
app/components/header.js | 37 ++++++++++-------
app/components/status-pill.js | 75 ++++++----------------------------
app/components/status-pill.mdx | 54 ++++++++++++++++++++++++
services/sync-status.js | 61 +++++++++++++++++++++++++++
4 files changed, 150 insertions(+), 77 deletions(-)
create mode 100644 app/components/status-pill.mdx
create mode 100644 services/sync-status.js
diff --git a/app/components/header.js b/app/components/header.js
index 5c2a085..5e206b2 100644
--- a/app/components/header.js
+++ b/app/components/header.js
@@ -7,7 +7,9 @@ import { ZcashLogo } from './zcash-logo';
import { TextComponent } from './text';
import { Divider } from './divider';
import { RowComponent } from './row';
-import { StatusPill } from './status-pill';
+import StatusPill from './status-pill';
+
+import withSyncStatus from '../../services/sync-status';
const Wrapper = styled.div`
height: ${props => props.theme.headerHeight};
@@ -59,17 +61,22 @@ type Props = {
title: string,
};
-export const HeaderComponent = ({ title }: Props) => (
-
-
-
-
-
-
-
-
-
-
-
-
-);
+const Status = withSyncStatus(StatusPill);
+
+export const HeaderComponent = ({ title }: Props) => {
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+};
diff --git a/app/components/status-pill.js b/app/components/status-pill.js
index 1e85cd2..496ab43 100644
--- a/app/components/status-pill.js
+++ b/app/components/status-pill.js
@@ -1,12 +1,9 @@
// @flow
import React, { Component } from 'react';
import styled, { keyframes } from 'styled-components';
-import eres from 'eres';
import { TextComponent } from './text';
-import rpc from '../../services/api';
-
import readyIcon from '../assets/images/green_check.png';
import syncIcon from '../assets/images/sync_icon.png';
import errorIcon from '../assets/images/error_icon.png';
@@ -46,70 +43,24 @@ const StatusPillLabel = styled(TextComponent)`
user-select: none;
`;
-type Props = {};
-
type State = {
- type: string,
- icon: string,
+ type: 'syncing' | 'ready' | 'error',
progress: number,
- isSyncing: boolean,
};
-export class StatusPill extends Component {
- timer: ?IntervalID = null;
+export const StatusPill = ({ type, progress }: State) => {
- state = {
- type: 'syncing',
- icon: syncIcon,
- progress: 0,
- isSyncing: true,
- };
+ const isSyncing = type === 'syncing';
- componentDidMount() {
- this.timer = setInterval(() => {
- this.getBlockchainStatus();
- }, 2000);
- }
+ const icon = type === 'error' ? errorIcon : (isSyncing ? syncIcon : readyIcon);
+ const showPercent = isSyncing ? `(${progress.toFixed(2)}%)` : '';
- componentWillUnmount() {
- if (this.timer) {
- clearInterval(this.timer);
- this.timer = null;
- }
- }
+ return (
+
+
+
+
+ );
+};
- getBlockchainStatus = async () => {
- const [blockchainErr, blockchaininfo] = await eres(
- rpc.getblockchaininfo(),
- );
-
- const newProgress = blockchaininfo.verificationprogress * 100;
-
- this.setState({
- progress: newProgress,
- ...(newProgress > 99.99 ? {
- type: 'ready',
- icon: readyIcon,
- isSyncing: false,
- } : {}),
- });
-
- if (blockchainErr) {
- this.setState(() => ({ type: 'error', icon: errorIcon }));
- }
- }
-
- render() {
- const {
- type, icon, progress, isSyncing,
- } = this.state;
- const showPercent = isSyncing ? `(${progress.toFixed(2)}%)` : '';
-
- return (
-
-
-
-
- );
- }
-}
+export default StatusPill;
\ No newline at end of file
diff --git a/app/components/status-pill.mdx b/app/components/status-pill.mdx
new file mode 100644
index 0000000..0a05a74
--- /dev/null
+++ b/app/components/status-pill.mdx
@@ -0,0 +1,54 @@
+---
+name: StatusPill
+---
+
+import { Playground, PropsTable } from 'docz'
+
+import { StatusPill } from './status-pill.js'
+import { DoczWrapper } from '../theme.js'
+
+# StatusPill
+
+## Properties
+
+
+
+## Syching
+
+
+
+ {() =>
+
+ }
+
+
+
+## Ready
+
+
+
+ {() =>
+
+ }
+
+
+
+
+## With Error
+
+
+
+ {() =>
+
+ }
+
+
\ No newline at end of file
diff --git a/services/sync-status.js b/services/sync-status.js
new file mode 100644
index 0000000..cfc00ca
--- /dev/null
+++ b/services/sync-status.js
@@ -0,0 +1,61 @@
+// @flow
+import React, { type ComponentType, Component } from 'react';
+import eres from 'eres';
+
+import rpc from './api';
+
+type Props = {};
+
+type State = {
+ type: 'syncing' | 'ready' | 'error',
+ progress: number,
+};
+
+export default function syncStatus(WrappedComponent: ComponentType) {
+ return class extends Component {
+ timer: ?IntervalID = null;
+
+ state = {
+ type: 'syncing',
+ progress: 0,
+ };
+
+ componentDidMount() {
+ this.timer = setInterval(() => {
+ this.getBlockchainStatus();
+ }, 2000);
+ }
+
+ componentWillUnmount() {
+ if (this.timer) {
+ clearInterval(this.timer);
+ this.timer = null;
+ }
+ }
+
+ getBlockchainStatus = async () => {
+ const [blockchainErr, blockchaininfo] = await eres(
+ rpc.getblockchaininfo(),
+ );
+
+ const newProgress = blockchaininfo.verificationprogress * 100;
+
+ this.setState({
+ progress: newProgress,
+ ...(newProgress > 99.99 ? {
+ type: 'ready',
+ } : {}),
+ });
+
+ if (blockchainErr) {
+ this.setState(() => ({ type: 'error' }));
+ }
+ }
+
+ render() {
+ const { type, progress} = this.state;
+
+ return ;
+ }
+ };
+}
\ No newline at end of file
From 542bacec6f2e5eaf8f15eb8e500f98a62f2cbd03 Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Mon, 28 Jan 2019 15:13:29 -0300
Subject: [PATCH 09/14] feat(test-components): generate snapshots for
components
---
.../__snapshots__/status-pill.test.js.snap | 20 +++++++++++++
.../transactions-daily.test.js.snap | 22 +++++++-------
__tests__/components/status-pill.test.js | 29 +++++++++++++++++++
3 files changed, 60 insertions(+), 11 deletions(-)
create mode 100644 __tests__/components/__snapshots__/status-pill.test.js.snap
create mode 100644 __tests__/components/status-pill.test.js
diff --git a/__tests__/components/__snapshots__/status-pill.test.js.snap b/__tests__/components/__snapshots__/status-pill.test.js.snap
new file mode 100644
index 0000000..5c90257
--- /dev/null
+++ b/__tests__/components/__snapshots__/status-pill.test.js.snap
@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render visual component status correctly 1`] = `
+
+
+
+
+ syncing (83.00%)
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/transactions-daily.test.js.snap b/__tests__/components/__snapshots__/transactions-daily.test.js.snap
index 4c9200a..18b231c 100644
--- a/__tests__/components/__snapshots__/transactions-daily.test.js.snap
+++ b/__tests__/components/__snapshots__/transactions-daily.test.js.snap
@@ -9,7 +9,7 @@ exports[` render() should render user daily transac
class="sc-ckVGcZ kFpbuU sc-htpNat jxQpDz"
color="#FFF"
>
- 2019-01-25T20:38:40.521Z
+ 2019-01-28T18:11:27.791Z
render() should render user daily transac
width=""
>
- received
+ receive
- 17:38 PM
+ 15:11 PM
@@ -58,16 +58,16 @@ exports[` render() should render user daily transac
width=""
>
- -ZEC 1.789
+ +ZEC 1.789
- -USD $0
+ +USD $2.406
@@ -96,13 +96,13 @@ exports[` render() should render user daily transac
class="sc-cSHVUG bHGbwE sc-htpNat dkQVQA"
color="#FFF"
>
- sent
+ send
- 17:38 PM
+ 15:11 PM
@@ -127,7 +127,7 @@ exports[` render() should render user daily transac
class="sc-htpNat dhSLjI"
color="#5d5d65"
>
- -USD $0
+ -USD $1.138
diff --git a/__tests__/components/status-pill.test.js b/__tests__/components/status-pill.test.js
new file mode 100644
index 0000000..75351c1
--- /dev/null
+++ b/__tests__/components/status-pill.test.js
@@ -0,0 +1,29 @@
+// @flow
+
+import React from 'react';
+import { render, cleanup } from 'react-testing-library';
+import { MemoryRouter } from 'react-router-dom';
+import { ThemeProvider } from 'styled-components';
+import 'jest-dom/extend-expect';
+
+import { StatusPill } from '../../app/components/status-pill';
+import appTheme from '../../app/theme';
+
+afterEach(cleanup);
+
+describe('', () => {
+ describe('render()', () => {
+ test('should render visual component status correctly', () => {
+ // $FlowFixMe
+ const { asFragment } = render(
+
+
+
+
+ ,
+ );
+
+ expect(asFragment()).toMatchSnapshot();
+ });
+ });
+});
From d86dfa09d01b11f8d31ea84b4c417251a62dad32 Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Tue, 29 Jan 2019 10:44:05 -0300
Subject: [PATCH 10/14] fix(test-components): flow and eslint issues
---
app/components/header.js | 35 +++++++++++-------------
app/components/status-pill.js | 50 +++++++++++++++++++++++------------
services/sync-status.js | 25 +++++++++---------
3 files changed, 62 insertions(+), 48 deletions(-)
diff --git a/app/components/header.js b/app/components/header.js
index 3f9f0ab..ade949e 100644
--- a/app/components/header.js
+++ b/app/components/header.js
@@ -7,9 +7,9 @@ import { ZcashLogo } from './zcash-logo';
import { TextComponent } from './text';
import { Divider } from './divider';
import { RowComponent } from './row';
-import StatusPill from './status-pill';
+import { StatusPill } from './status-pill';
-import withSyncStatus from '../../services/sync-status';
+import { withSyncStatus } from '../../services/sync-status';
const Wrapper = styled.div`
height: ${props => props.theme.headerHeight};
@@ -63,20 +63,17 @@ type Props = {
const Status = withSyncStatus(StatusPill);
-export const HeaderComponent = ({ title }: Props) => {
-
- return (
-
- )
-};
+export const HeaderComponent = ({ title }: Props) => (
+
+);
diff --git a/app/components/status-pill.js b/app/components/status-pill.js
index 882d5fb..8c93f91 100644
--- a/app/components/status-pill.js
+++ b/app/components/status-pill.js
@@ -1,5 +1,5 @@
// @flow
-import React, { Component } from 'react';
+import React from 'react';
import styled, { keyframes } from 'styled-components';
import { TextComponent } from './text';
@@ -12,7 +12,6 @@ const rotate = keyframes`
from {
transform: rotate(0deg);
}
-
to {
transform: rotate(360deg);
}
@@ -43,24 +42,41 @@ const StatusPillLabel = styled(TextComponent)`
user-select: none;
`;
-type State = {
+type Props = {
type: 'syncing' | 'ready' | 'error',
progress: number,
};
-export const StatusPill = ({ type, progress }: State) => {
-
- const isSyncing = type === 'syncing';
-
- const icon = type === 'error' ? errorIcon : (isSyncing ? syncIcon : readyIcon);
- const showPercent = isSyncing ? `(${progress.toFixed(2)}%)` : '';
-
- return (
-
-
-
-
- );
+type State = {
+ withError: boolean,
};
-export default StatusPill;
+export class StatusPill extends React.PureComponent {
+ state = {
+ withError: false,
+ };
+
+ componentDidMount() {
+ const { type } = this.props;
+ if (type === 'error') {
+ this.setState(() => ({ withError: false }));
+ }
+ }
+
+ render() {
+ const { type, progress } = this.props;
+ const { withError } = this.state;
+
+ const isSyncing = type === 'syncing';
+
+ const icon = isSyncing ? syncIcon : readyIcon;
+ const showPercent = isSyncing ? `(${progress.toFixed(2)}%)` : '';
+
+ return (
+
+
+
+
+ );
+ }
+}
diff --git a/services/sync-status.js b/services/sync-status.js
index cfc00ca..930c5cb 100644
--- a/services/sync-status.js
+++ b/services/sync-status.js
@@ -7,12 +7,14 @@ import rpc from './api';
type Props = {};
type State = {
- type: 'syncing' | 'ready' | 'error',
+ type?: 'syncing' | 'ready' | 'error',
progress: number,
};
-export default function syncStatus(WrappedComponent: ComponentType) {
- return class extends Component {
+/* eslint-disable max-len */
+export const withSyncStatus = (
+ WrappedComponent: ComponentType,
+): ComponentType<$Diff> => class extends Component {
timer: ?IntervalID = null;
state = {
@@ -25,28 +27,28 @@ export default function syncStatus(WrappedComponent: ComponentType)
this.getBlockchainStatus();
}, 2000);
}
-
+
componentWillUnmount() {
if (this.timer) {
clearInterval(this.timer);
this.timer = null;
}
}
-
+
getBlockchainStatus = async () => {
const [blockchainErr, blockchaininfo] = await eres(
rpc.getblockchaininfo(),
);
-
+
const newProgress = blockchaininfo.verificationprogress * 100;
-
+
this.setState({
progress: newProgress,
...(newProgress > 99.99 ? {
type: 'ready',
} : {}),
});
-
+
if (blockchainErr) {
this.setState(() => ({ type: 'error' }));
}
@@ -54,8 +56,7 @@ export default function syncStatus(WrappedComponent: ComponentType)
render() {
const { type, progress} = this.state;
-
- return ;
+
+ return ;
}
- };
-}
\ No newline at end of file
+ };
\ No newline at end of file
From 4a515c3ad4f7dad6d2f5fc4a0de0699607b3b6ab Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Thu, 31 Jan 2019 13:32:52 -0300
Subject: [PATCH 11/14] feat(test-components): generate new snapshots
---
.../__snapshots__/button.test.js.snap | 11 --
.../__snapshots__/clipboard.test.js.snap | 11 --
.../__snapshots__/column.test.js.snap | 20 +++
.../__snapshots__/confirm-dialog.test.js.snap | 8 +-
.../__snapshots__/divider.test.js.snap | 10 ++
.../__snapshots__/dropdown.test.js.snap | 15 --
.../empty-transactions.test.js.snap | 17 +++
.../__snapshots__/header.test.js.snap | 20 +++
.../__snapshots__/input-label.test.js.snap | 12 ++
.../__snapshots__/input.test.js.snap | 34 -----
.../__snapshots__/layout.test.js.snap | 20 +++
.../__snapshots__/modal.test.js.snap | 11 --
.../__snapshots__/qrcode.test.js.snap | 11 --
.../components/__snapshots__/row.test.js.snap | 19 +++
.../__snapshots__/select.test.js.snap | 29 ++++
.../__snapshots__/sidebar.test.js.snap | 71 +++++++++
.../__snapshots__/status-pill.test.js.snap | 20 ---
.../__snapshots__/text.test.js.snap | 12 ++
.../transactions-daily.test.js.snap | 137 ------------------
.../__snapshots__/wallet-address.test.js.snap | 32 ----
20 files changed, 231 insertions(+), 289 deletions(-)
delete mode 100644 __tests__/components/__snapshots__/button.test.js.snap
delete mode 100644 __tests__/components/__snapshots__/clipboard.test.js.snap
create mode 100644 __tests__/components/__snapshots__/column.test.js.snap
create mode 100644 __tests__/components/__snapshots__/divider.test.js.snap
delete mode 100644 __tests__/components/__snapshots__/dropdown.test.js.snap
create mode 100644 __tests__/components/__snapshots__/empty-transactions.test.js.snap
create mode 100644 __tests__/components/__snapshots__/header.test.js.snap
create mode 100644 __tests__/components/__snapshots__/input-label.test.js.snap
delete mode 100644 __tests__/components/__snapshots__/input.test.js.snap
create mode 100644 __tests__/components/__snapshots__/layout.test.js.snap
delete mode 100644 __tests__/components/__snapshots__/modal.test.js.snap
delete mode 100644 __tests__/components/__snapshots__/qrcode.test.js.snap
create mode 100644 __tests__/components/__snapshots__/row.test.js.snap
create mode 100644 __tests__/components/__snapshots__/select.test.js.snap
create mode 100644 __tests__/components/__snapshots__/sidebar.test.js.snap
delete mode 100644 __tests__/components/__snapshots__/status-pill.test.js.snap
create mode 100644 __tests__/components/__snapshots__/text.test.js.snap
delete mode 100644 __tests__/components/__snapshots__/transactions-daily.test.js.snap
delete mode 100644 __tests__/components/__snapshots__/wallet-address.test.js.snap
diff --git a/__tests__/components/__snapshots__/button.test.js.snap b/__tests__/components/__snapshots__/button.test.js.snap
deleted file mode 100644
index 1691ef6..0000000
--- a/__tests__/components/__snapshots__/button.test.js.snap
+++ /dev/null
@@ -1,11 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[` render() should render button correctly 1`] = `
-
-
-
-`;
diff --git a/__tests__/components/__snapshots__/clipboard.test.js.snap b/__tests__/components/__snapshots__/clipboard.test.js.snap
deleted file mode 100644
index 2f0dde4..0000000
--- a/__tests__/components/__snapshots__/clipboard.test.js.snap
+++ /dev/null
@@ -1,11 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[` render() should render clipboard component correctly 1`] = `
-
-
-
-`;
diff --git a/__tests__/components/__snapshots__/column.test.js.snap b/__tests__/components/__snapshots__/column.test.js.snap
new file mode 100644
index 0000000..0d3a634
--- /dev/null
+++ b/__tests__/components/__snapshots__/column.test.js.snap
@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` should render correctly 1`] = `
+
+
+
+ ZEC
+
+
+ React
+
+
+ Wallet
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/confirm-dialog.test.js.snap b/__tests__/components/__snapshots__/confirm-dialog.test.js.snap
index 81a2b02..f668d22 100644
--- a/__tests__/components/__snapshots__/confirm-dialog.test.js.snap
+++ b/__tests__/components/__snapshots__/confirm-dialog.test.js.snap
@@ -1,9 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[` render() should render confirm dialog correctly 1`] = `
-
-
-
-`;
+exports[` should render confirm dialog correctly 1`] = `null`;
diff --git a/__tests__/components/__snapshots__/divider.test.js.snap b/__tests__/components/__snapshots__/divider.test.js.snap
new file mode 100644
index 0000000..837b115
--- /dev/null
+++ b/__tests__/components/__snapshots__/divider.test.js.snap
@@ -0,0 +1,10 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` should render correctly 1`] = `
+
+`;
diff --git a/__tests__/components/__snapshots__/dropdown.test.js.snap b/__tests__/components/__snapshots__/dropdown.test.js.snap
deleted file mode 100644
index a618be6..0000000
--- a/__tests__/components/__snapshots__/dropdown.test.js.snap
+++ /dev/null
@@ -1,15 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[` render() should render dropdown correctly 1`] = `
-
-
-
-
-
-`;
diff --git a/__tests__/components/__snapshots__/empty-transactions.test.js.snap b/__tests__/components/__snapshots__/empty-transactions.test.js.snap
new file mode 100644
index 0000000..989ce50
--- /dev/null
+++ b/__tests__/components/__snapshots__/empty-transactions.test.js.snap
@@ -0,0 +1,17 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` should render correctly 1`] = `
+
+`;
diff --git a/__tests__/components/__snapshots__/header.test.js.snap b/__tests__/components/__snapshots__/header.test.js.snap
new file mode 100644
index 0000000..99852db
--- /dev/null
+++ b/__tests__/components/__snapshots__/header.test.js.snap
@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` should render correctly 1`] = `
+
+
+
+ ZEC
+
+
+ React
+
+
+ Wallet
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/input-label.test.js.snap b/__tests__/components/__snapshots__/input-label.test.js.snap
new file mode 100644
index 0000000..82cfbac
--- /dev/null
+++ b/__tests__/components/__snapshots__/input-label.test.js.snap
@@ -0,0 +1,12 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` should render correctly 1`] = `
+
+`;
diff --git a/__tests__/components/__snapshots__/input.test.js.snap b/__tests__/components/__snapshots__/input.test.js.snap
deleted file mode 100644
index 75f90f5..0000000
--- a/__tests__/components/__snapshots__/input.test.js.snap
+++ /dev/null
@@ -1,34 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[` render() should render text input correctly 1`] = `
-
-`;
-
-exports[` render() should render textarea correctly 1`] = `
-
-`;
diff --git a/__tests__/components/__snapshots__/layout.test.js.snap b/__tests__/components/__snapshots__/layout.test.js.snap
new file mode 100644
index 0000000..f81f182
--- /dev/null
+++ b/__tests__/components/__snapshots__/layout.test.js.snap
@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` should render correctly 1`] = `
+
+
+
+ ZEC
+
+
+ React
+
+
+ Wallet
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/modal.test.js.snap b/__tests__/components/__snapshots__/modal.test.js.snap
deleted file mode 100644
index 9620f72..0000000
--- a/__tests__/components/__snapshots__/modal.test.js.snap
+++ /dev/null
@@ -1,11 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[` render() should render modal correctly 1`] = `
-
-
-
-`;
diff --git a/__tests__/components/__snapshots__/qrcode.test.js.snap b/__tests__/components/__snapshots__/qrcode.test.js.snap
deleted file mode 100644
index e5a5d38..0000000
--- a/__tests__/components/__snapshots__/qrcode.test.js.snap
+++ /dev/null
@@ -1,11 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[` render() should render qrcode component correctly 1`] = `
-
-
-
-`;
diff --git a/__tests__/components/__snapshots__/row.test.js.snap b/__tests__/components/__snapshots__/row.test.js.snap
new file mode 100644
index 0000000..ed1fda9
--- /dev/null
+++ b/__tests__/components/__snapshots__/row.test.js.snap
@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` should render correctly 1`] = `
+
+
+
+ ZEC
+
+
+ React
+
+
+ Wallet
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/select.test.js.snap b/__tests__/components/__snapshots__/select.test.js.snap
new file mode 100644
index 0000000..19bc70d
--- /dev/null
+++ b/__tests__/components/__snapshots__/select.test.js.snap
@@ -0,0 +1,29 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` should generate snapshot correctly 1`] = `
+
+
+
+ Select a address
+
+
+
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/sidebar.test.js.snap b/__tests__/components/__snapshots__/sidebar.test.js.snap
new file mode 100644
index 0000000..bfb0b58
--- /dev/null
+++ b/__tests__/components/__snapshots__/sidebar.test.js.snap
@@ -0,0 +1,71 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` render() should render correctly 1`] = `
+
+
+
+`;
diff --git a/__tests__/components/__snapshots__/status-pill.test.js.snap b/__tests__/components/__snapshots__/status-pill.test.js.snap
deleted file mode 100644
index 5c90257..0000000
--- a/__tests__/components/__snapshots__/status-pill.test.js.snap
+++ /dev/null
@@ -1,20 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[` render() should render visual component status correctly 1`] = `
-
-
-
-
- syncing (83.00%)
-
-
-
-`;
diff --git a/__tests__/components/__snapshots__/text.test.js.snap b/__tests__/components/__snapshots__/text.test.js.snap
new file mode 100644
index 0000000..e12d42f
--- /dev/null
+++ b/__tests__/components/__snapshots__/text.test.js.snap
@@ -0,0 +1,12 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` should render correctly 1`] = `
+
+`;
diff --git a/__tests__/components/__snapshots__/transactions-daily.test.js.snap b/__tests__/components/__snapshots__/transactions-daily.test.js.snap
deleted file mode 100644
index 18b231c..0000000
--- a/__tests__/components/__snapshots__/transactions-daily.test.js.snap
+++ /dev/null
@@ -1,137 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[` render() should render user daily transactions 1`] = `
-
-
-
- 2019-01-28T18:11:27.791Z
-
-
-
-
-
-
-
-
- receive
-
-
- 15:11 PM
-
-
-
-
- 12345678912345678912...9123456789
-
-
-
-
- +ZEC 1.789
-
-
- +USD $2.406
-
-
-
-
-
-
-
-
-
-
- send
-
-
- 15:11 PM
-
-
-
-
- 12345678912345678912...9123456789
-
-
-
-
- -ZEC 0.846
-
-
- -USD $1.138
-
-
-
-
-
-
-`;
diff --git a/__tests__/components/__snapshots__/wallet-address.test.js.snap b/__tests__/components/__snapshots__/wallet-address.test.js.snap
deleted file mode 100644
index fc8cc34..0000000
--- a/__tests__/components/__snapshots__/wallet-address.test.js.snap
+++ /dev/null
@@ -1,32 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[` render() should render wallet address component correctly 1`] = `
-
-
-
-
-
-
-
-
-
-
-`;
From 8e308acbf2341bd55843d1226d95fa5d5ec42f3f Mon Sep 17 00:00:00 2001
From: eliabejr
Date: Thu, 31 Jan 2019 13:38:42 -0300
Subject: [PATCH 12/14] feat(test-components): update components with testid
attribute
---
app/components/button.js | 4 ++--
app/components/clipboard.js | 14 ++++++++------
app/components/dropdown.js | 2 +-
app/components/empty-transactions.js | 2 +-
app/components/input.js | 3 ++-
app/components/loading-screen.js | 2 +-
app/components/modal.js | 1 +
app/components/qrcode.js | 2 +-
app/components/select.js | 1 +
app/components/status-pill.js | 2 +-
app/components/transaction-daily.js | 2 +-
app/components/wallet-address.js | 2 +-
12 files changed, 21 insertions(+), 16 deletions(-)
diff --git a/app/components/button.js b/app/components/button.js
index f3291cf..5a44bf7 100644
--- a/app/components/button.js
+++ b/app/components/button.js
@@ -102,12 +102,12 @@ export const Button = ({
const buttonLabel = isLoading ? 'Loading...' : label;
const component = variant === 'primary' ? (
-
+
{icon ? : null}
{buttonLabel}
) : (
-
+
{icon ? : null}
{buttonLabel}
diff --git a/app/components/clipboard.js b/app/components/clipboard.js
index bda14ca..7f42e61 100644
--- a/app/components/clipboard.js
+++ b/app/components/clipboard.js
@@ -39,12 +39,14 @@ export class Clipboard extends PureComponent {
const { copied } = this.state;
return (
-
+
+
+
);
}
}
diff --git a/app/components/dropdown.js b/app/components/dropdown.js
index 3bd880c..2eca400 100644
--- a/app/components/dropdown.js
+++ b/app/components/dropdown.js
@@ -107,7 +107,7 @@ export class DropdownComponent extends Component {
)}
{options.map(({ label: optionLabel, onClick }) => (
-
+
))}
diff --git a/app/components/empty-transactions.js b/app/components/empty-transactions.js
index c0247f0..6d5ce99 100644
--- a/app/components/empty-transactions.js
+++ b/app/components/empty-transactions.js
@@ -13,7 +13,7 @@ const Wrapper = styled.div`
`;
export const EmptyTransactionsComponent = () => (
-
+
);
diff --git a/app/components/input.js b/app/components/input.js
index 82f4ea0..497a3b0 100644
--- a/app/components/input.js
+++ b/app/components/input.js
@@ -62,11 +62,12 @@ export const InputComponent = ({
onChange={evt => onChange(evt.target.value)}
withRightElement={Boolean(rightElement)}
bgColor={bgColor}
+ data-testid='Input'
{...props}
/>
),
textarea: () => (
-