WA-230 Extracting DOM safe deployment via eth tx into deployedSafe builder helper class

src/routes/open/components/Layout.test.js

@@ -1,33 +1,18 @@
 // @flow
-import * as React from 'react'
 import TestUtils from 'react-dom/test-utils'
-import Open from '~/routes/open/container/Open'
-import { Provider } from 'react-redux'
-import { ConnectedRouter } from 'react-router-redux'
+import { store } from '~/store'
 import { FIELD_NAME, FIELD_OWNERS, FIELD_CONFIRMATIONS, getOwnerNameBy, getOwnerAddressBy } from '~/routes/open/components/fields'
 import { DEPLOYED_COMPONENT_ID } from '~/routes/open/components/FormConfirmation'
-import { history, store } from '~/store'
 import { sleep } from '~/utils/timer'
 import { getProviderInfo } from '~/wallets/getWeb3'
-import addProvider from '~/wallets/store/actions/addProvider'
-import { makeProvider } from '~/wallets/store/model/provider'
+import { renderSafe } from '~/routes/safe/store/test/builder/deployedSafe.builder'
 
 describe('React DOM TESTS > Create Safe form', () => {
   let open
   let provider
   beforeEach(async () => {
-    // init app web3 instance
     provider = await getProviderInfo()
-    const walletRecord = makeProvider(provider)
-    store.dispatch(addProvider(walletRecord))
-
-    open = TestUtils.renderIntoDocument((
-      <Provider store={store}>
-        <ConnectedRouter history={history}>
-          <Open />
-        </ConnectedRouter>
-      </Provider>
-    ))
+    open = await renderSafe(store)
   })
 
   it('should create a 1 owner safe after rendering correctly the form', async () => {

src/routes/safe/store/test/builder/deployedSafe.builder.js

@@ -0,0 +1,72 @@
+// @flow
+import * as React from 'react'
+import { type Store } from 'redux'
+import TestUtils from 'react-dom/test-utils'
+import { Provider } from 'react-redux'
+import { ConnectedRouter } from 'react-router-redux'
+import { DEPLOYED_COMPONENT_ID } from '~/routes/open/components/FormConfirmation'
+import Open from '~/routes/open/container/Open'
+import { history, type GlobalState } from '~/store'
+import { sleep } from '~/utils/timer'
+import { getProviderInfo } from '~/wallets/getWeb3'
+import addProvider from '~/wallets/store/actions/addProvider'
+import { makeProvider } from '~/wallets/store/model/provider'
+
+export const renderSafe = async (localStore: Store<GlobalState>) => {
+  const provider = await getProviderInfo()
+  const walletRecord = makeProvider(provider)
+  localStore.dispatch(addProvider(walletRecord))
+
+  return (
+    TestUtils.renderIntoDocument((
+      <Provider store={localStore}>
+        <ConnectedRouter history={history}>
+          <Open />
+        </ConnectedRouter>
+      </Provider>
+    ))
+  )
+}
+
+const deploySafe = async (safe: React$Component<{}>) => {
+  const inputs = TestUtils.scryRenderedDOMComponentsWithTag(safe, 'input')
+  const fieldName = inputs[0]
+  const fieldOwners = inputs[1]
+  const fieldConfirmations = inputs[2]
+
+  TestUtils.Simulate.change(fieldOwners, { target: { value: '1' } })
+  const inputsExpanded = TestUtils.scryRenderedDOMComponentsWithTag(safe, 'input')
+  const ownerName = inputsExpanded[2]
+
+  TestUtils.Simulate.change(fieldName, { target: { value: 'Adolfo Safe' } })
+  TestUtils.Simulate.change(fieldConfirmations, { target: { value: '1' } })
+  TestUtils.Simulate.change(ownerName, { target: { value: 'Adolfo Eth Account' } })
+
+  const form = TestUtils.findRenderedDOMComponentWithTag(safe, 'form')
+
+  TestUtils.Simulate.submit(form) // fill the form
+  TestUtils.Simulate.submit(form) // confirming data
+  TestUtils.Simulate.submit(form) // Executing transaction
+
+  // giving some time to the component for updating its state with safe
+  // before destroying its context
+  await sleep(1500)
+
+  // THEN
+  const deployed = TestUtils.findRenderedDOMComponentWithClass(safe, DEPLOYED_COMPONENT_ID)
+  if (!deployed) {
+    throw new Error()
+  }
+
+  const transactionHash = JSON.parse(deployed.getElementsByTagName('pre')[0].innerHTML)
+  delete transactionHash.logsBloom
+
+  return transactionHash
+}
+
+export const aDeployedSafe = async (specificStore: Store<GlobalState>) => {
+  const safe: React$Component<{}> = await renderSafe(specificStore)
+  const deployedSafe = deploySafe(safe)
+
+  return deployedSafe
+}