refs tasitlabs#12

demo/components/presentational/EthereumSignUpForm.js

@@ -1,9 +1,17 @@
 import React from "react";
 import { Button, StyleSheet, View, Text, TextInput } from "react-native";
+import { Account } from "tasit-sdk";
 
 export default class EthereumSignUpForm extends React.Component {
   state = {
     text: "",
+    address: "",
+  };
+
+  createAccount = async () => {
+    // TODO: Remove await when SDK 0.0.3 is out
+    const wallet = await Account.create();
+    this.setState({ address: wallet.address });
   };
 
   render() {
@@ -25,7 +33,7 @@ export default class EthereumSignUpForm extends React.Component {
           </View>
         </View>
         <View style={styles.buttonView}>
-          <Button title="Continue" onPress={() => {}} />
+          <Button title="Continue" onPress={() => this.createAccount()} />
         </View>
       </React.Fragment>
     );

demo/components/presentational/EthereumSignUpForm.test.js

@@ -0,0 +1,22 @@
+import React from "react";
+import NavigationTestUtils from "react-navigation/NavigationTestUtils";
+import { shallow } from "enzyme";
+import EthereumSignUpForm from "./EthereumSignUpForm";
+
+describe("EthereumSignUpForm", () => {
+  jest.useFakeTimers();
+  beforeEach(() => {
+    NavigationTestUtils.resetInternalState();
+  });
+
+  it("renders the component", async () => {
+    expect(shallow(<EthereumSignUpForm />)).toMatchSnapshot();
+  });
+
+  it("creates a wallet - calling function", async () => {
+    const wrapper = shallow(<EthereumSignUpForm />);
+    expect(wrapper.state("address")).toEqual("");
+    await wrapper.instance().createAccount();
+    expect(wrapper.state("address")).not.toEqual("");
+  });
+});

demo/components/presentational/__snapshots__/EthereumSignUpForm.test.js.snap

@@ -0,0 +1,70 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EthereumSignUpForm renders the component 1`] = `
+<Fragment>
+  <Component
+    style={
+      Object {
+        "flexDirection": "row",
+      }
+    }
+  >
+    <Component
+      style={
+        Object {
+          "alignItems": "flex-end",
+          "flex": 1,
+        }
+      }
+    >
+      <TextInput
+        allowFontScaling={true}
+        autoCapitalize="none"
+        autoCorrect={false}
+        onChangeText={[Function]}
+        placeholder="username"
+        style={
+          Object {
+            "fontSize": 20,
+            "justifyContent": "flex-start",
+            "width": 90,
+          }
+        }
+        underlineColorAndroid="transparent"
+        value=""
+      />
+    </Component>
+    <Component
+      style={
+        Object {
+          "flex": 1,
+        }
+      }
+    >
+      <Component
+        style={
+          Object {
+            "fontSize": 20,
+            "justifyContent": "flex-end",
+          }
+        }
+      >
+        .tasitid.eth
+      </Component>
+    </Component>
+  </Component>
+  <Component
+    style={
+      Object {
+        "flexDirection": "row",
+        "marginTop": 30,
+      }
+    }
+  >
+    <Button
+      onPress={[Function]}
+      title="Continue"
+    />
+  </Component>
+</Fragment>
+`;

demo/screens/Home.js

@@ -1,16 +1,9 @@
 import React from "react";
 import { Image, Button, StyleSheet, View } from "react-native";
-import { Account } from "tasit-sdk";
 import LargeText from "../components/presentational/LargeText";
 import Colors from "../constants/Colors";
 
 export default class Home extends React.Component {
-  componentDidMount = async () => {
-    // TODO: Remove await when SDK 0.0.3 is out
-    const wallet = await Account.create();
-    console.log(wallet.address);
-  };
-
   render() {
     return (
       <View style={styles.container}>