Browse Source

#87 Add title to AttributesSummary

Jordi Coscolla 1 year ago
parent
commit
8ee319c2f5

+ 3 - 2
apps/wallet/screens/AttributesSummary.js

@@ -2,7 +2,7 @@ import React from 'react';
2 2
 import { connect } from 'react-redux';
3 3
 import PropTypes from 'prop-types';
4 4
 import { Constants, SecureStore, WebBrowser } from 'expo';
5
-import { Linking, View } from 'react-native';
5
+import { Linking, View, Text } from 'react-native';
6 6
 import { goToPetitionSummary } from '../application/redux/actions/navigation';
7 7
 import Button from '../application/components/Button/Button';
8 8
 import { addCredential } from '../application/redux/actions/attributes';
@@ -46,6 +46,7 @@ class AttributesSummary extends React.Component {
46 46
   render() {
47 47
     return (
48 48
       <View>
49
+        <Text>{this.props.petition.title}</Text>
49 50
         <Button
50 51
           name="Verify with Barcelona Council"
51 52
           onPress={this.openWebBrowserAsync}
@@ -85,7 +86,7 @@ const mapStateToProps = state => ({
85 86
 });
86 87
 
87 88
 const mapDispatchToProps = dispatch => ({
88
-  getPetition: (petitionLink) => { dispatch(getPetition(petitionLink)); },
89
+  getPetition: petitionLink => dispatch(getPetition(petitionLink)),
89 90
   goToPetitionSummary: (petitionLink) => { dispatch(goToPetitionSummary(petitionLink)); },
90 91
   addCredential: (attribute, walletId, url) => {
91 92
     dispatch(addCredential(attribute, walletId, url, SecureStore.setItemAsync));

+ 1 - 1
apps/wallet/test/acceptance/sign.test.js

@@ -6,7 +6,7 @@ import Adapter from 'enzyme-adapter-react-16';
6 6
 import thunk from 'redux-thunk';
7 7
 import PetitionSummary from '../../screens/PetitionSummary';
8 8
 import Button from '../../application/components/Button/Button';
9
-// import { jsdom } from 'jsdom'
9
+
10 10
 Enzyme.configure({ adapter: new Adapter() });
11 11
 
12 12
 const mockStore = configureMockStore([thunk]);

+ 128 - 96
apps/wallet/test/components/AttributesSummary.test.js

@@ -1,96 +1,128 @@
1
-// import React from 'react';
2
-// import configureStore from 'redux-mock-store';
3
-// import thunk from 'redux-thunk';
4
-// import Enzyme, { shallow } from 'enzyme';
5
-// import Adapter from 'enzyme-adapter-react-16/build/index';
6
-// import Button from '../../application/components/Button/Button';
7
-// import AttributesSummary from '../../screens/AttributesSummary';
8
-//
9
-//
10
-// Enzyme.configure({ adapter: new Adapter() });
11
-//
12
-// const mockStore = configureStore([thunk]);
13
-//
14
-// describe('The AttributesSummary page', () => {
15
-//   const somePetitionLink = 'http://some-petition.com';
16
-//   const goToPetitionSummaryMock = jest.fn();
17
-//   const openWebBroswerAsyncMock = jest.fn();
18
-//
19
-//   // it('should show any unverified required attribute for the petition', () => {
20
-//   //
21
-//   // });
22
-//
23
-//
24
-//   // describe('when the verify button is pressed', () => {
25
-//   //   it('should go to credential issuer', () => {
26
-//   //     const initialState = {
27
-//   //       petitionLink: {
28
-//   //         petitionLink: somePetitionLink,
29
-//   //       },
30
-//   //       petition: {
31
-//   //         petition: {
32
-//   //           title: 'hello',
33
-//   //           description: 'world',
34
-//   //           closingDate: 'today',
35
-//   //           id: '1234',
36
-//   //           isEthereum: 'false',
37
-//   //         },
38
-//   //       },
39
-//   //       wallet: {
40
-//   //         id: 'something',
41
-//   //       },
42
-//   //       authorization: {},
43
-//   //     };
44
-//   //
45
-//   //     const wrapper = shallow(
46
-//   //       <AttributesSummary />,
47
-//   //       { context: { store: mockStore(initialState) } },
48
-//   //     );
49
-//   //
50
-//   //     // wrapper.dive().find(Button).first().simulate('click');
51
-//   //
52
-//   //     const spy = jest.spyOn(wrapper.instance(), 'openWebBrowserAsync');
53
-//   //     wrapper.update();
54
-//   //     wrapper.find(Button).simulate('click');
55
-//   //     expect(spy).toHaveBeenCalled();
56
-//   //   });
57
-//   // });
58
-//
59
-//   // describe('on redirect from credential issuer', () => {
60
-//   //   it('should go to petitionSummary page', () => {
61
-//   //     const initialState = {
62
-//   //       petitionLink: {
63
-//   //         petitionLink: somePetitionLink,
64
-//   //       },
65
-//   //       petition: {
66
-//   //         petition: {
67
-//   //           title: 'hello',
68
-//   //           description: 'world',
69
-//   //           closingDate: 'today',
70
-//   //           id: '1234',
71
-//   //           isEthereum: 'false',
72
-//   //         },
73
-//   //       },
74
-//   //       wallet: {
75
-//   //         id: 'something',
76
-//   //       },
77
-//   //       authorization: {},
78
-//   //     };
79
-//   //
80
-//   //     const wrapper = shallow(
81
-//   //       <AttributesSummary />,
82
-//   //       { context: { store: mockStore(initialState) } },
83
-//   //     );
84
-//   //
85
-//   //     const attributesSummaryComponent = wrapper.dive().instance();
86
-//   //     attributesSummaryComponent.props = {
87
-//   //       ...attributesSummaryComponent.props,
88
-//   //       goToPetitionSummary: goToPetitionSummaryMock,
89
-//   //     };
90
-//   //
91
-//   //     wrapper.dive().find(Button).first().simulate('click');
92
-//   //
93
-//   //     expect(goToPetitionSummaryMock).toBeCalledWith(somePetitionLink);
94
-//   //   });
95
-//   // });
96
-// });
1
+import React from 'react';
2
+import { Text } from 'react-native';
3
+import configureStore from 'redux-mock-store';
4
+import fetchMock from 'fetch-mock';
5
+import thunk from 'redux-thunk';
6
+import Enzyme, { shallow } from 'enzyme';
7
+import Adapter from 'enzyme-adapter-react-16/build/index';
8
+import Button from '../../application/components/Button/Button';
9
+import AttributesSummary from '../../screens/AttributesSummary';
10
+
11
+
12
+Enzyme.configure({ adapter: new Adapter() });
13
+
14
+const mockStore = configureStore([thunk]);
15
+
16
+describe('The AttributesSummary page', () => {
17
+  const somePetitionLink = 'http://some-petition.com';
18
+  const goToPetitionSummaryMock = jest.fn();
19
+  // const openWebBroswerAsyncMock = jest.fn();
20
+
21
+  // GIVEN A PETITION
22
+  const initialState = {
23
+    petitionLink: {
24
+      petitionLink: 'http://something.com',
25
+    },
26
+    petition: {
27
+      petition: {
28
+      },
29
+    },
30
+    attributes: {
31
+      isRequiredAttributeEnabled: false,
32
+      optionalAttributesToggleStatus: {
33
+        age: false,
34
+        gender: false,
35
+      },
36
+      list: [],
37
+    },
38
+    wallet: {
39
+      id: 'something',
40
+    },
41
+  };
42
+
43
+  afterEach(() => {
44
+    fetchMock.reset();
45
+    fetchMock.restore();
46
+  });
47
+
48
+  it('should show the verify with barcelona button', () => {
49
+    const store = mockStore(initialState);
50
+
51
+    // WHEN I VISUALIZE THE Attribute Summary
52
+    const wrapper = shallow(
53
+      <AttributesSummary />,
54
+      { context: { store } },
55
+    );
56
+
57
+    const buttonWrapper = wrapper.dive().find(Button);
58
+
59
+    // Only one button
60
+    expect(buttonWrapper).toHaveLength(1);
61
+    expect(buttonWrapper.prop('name')).toEqual('Verify with Barcelona Council');
62
+
63
+    // I see the title
64
+    expect(buttonWrapper.first().prop('enabled')).toEqual(true);
65
+  });
66
+
67
+  it('should show the title of the petition', () => {
68
+    const title = 'Petition Title';
69
+    const state = {
70
+      ...initialState,
71
+      petition: {
72
+        petition: {
73
+          title,
74
+          description: 'world',
75
+          closingDate: 'today',
76
+          id: '1234',
77
+          isEthereum: 'false',
78
+        },
79
+      },
80
+    };
81
+    const store = mockStore(state);
82
+
83
+    // WHEN I VISUALIZE THE Attribute Summary
84
+    const wrapper = shallow(
85
+      <AttributesSummary />,
86
+      { context: { store } },
87
+    );
88
+
89
+    const TextWrappers = wrapper.dive().find(Text).findWhere(n => n.text() === title);
90
+    expect(TextWrappers).toHaveLength(1);
91
+    console.log(TextWrappers.debug());
92
+  });
93
+
94
+  describe('when the verify button is pressed', () => {
95
+    xit('should go to credential issuer', () => {
96
+      const wrapper = shallow(
97
+        <AttributesSummary />,
98
+        { context: { store: mockStore(initialState) } },
99
+      );
100
+
101
+      // wrapper.dive().find(Button).first().simulate('click');
102
+
103
+      const spy = jest.spyOn(wrapper.instance(), 'openWebBrowserAsync');
104
+      wrapper.update();
105
+      wrapper.find(Button).simulate('click');
106
+      expect(spy).toHaveBeenCalled();
107
+    });
108
+  });
109
+
110
+  describe('on redirect from credential issuer', () => {
111
+    xit('should go to petitionSummary page', () => {
112
+      const wrapper = shallow(
113
+        <AttributesSummary />,
114
+        { context: { store: mockStore(initialState) } },
115
+      );
116
+
117
+      const attributesSummaryComponent = wrapper.dive().instance();
118
+      attributesSummaryComponent.props = {
119
+        ...attributesSummaryComponent.props,
120
+        goToPetitionSummary: goToPetitionSummaryMock,
121
+      };
122
+
123
+      wrapper.dive().find(Button).first().simulate('click');
124
+
125
+      expect(goToPetitionSummaryMock).toBeCalledWith(somePetitionLink);
126
+    });
127
+  });
128
+});