Add create DAO tests

.github/workflows/ci.yaml

@@ -1,6 +1,6 @@
 name: continuous-integration
 
-on: [push, pull_request]
+on: [pull_request]
 
 jobs:
   CI:
@@ -18,7 +18,7 @@ jobs:
       - name: Setup Node.js
         uses: actions/setup-node@master
         with:
-          node-version: '${{ steps.nvm.outputs.NVMRC }}'
+          node-version: "${{ steps.nvm.outputs.NVMRC }}"
 
       - name: Check for cached node_modules
         uses: actions/cache@v2
@@ -36,9 +36,13 @@ jobs:
       - name: Lint
         run: yarn run lint:ci
 
-      - name: Build
-        run: yarn run build
+      # - name: Build
+      #   run: yarn run build
 
       # TO-DO: Uncomment when tests are ready to be run on CI (such as those in issues #129-#131)
-      # - name: Test
-      #  run: yarn test:ci
+      - name: Run App
+        run: yarn run dev &
+          sleep 50
+
+      - name: Test
+        run: yarn test

package.json

@@ -27,6 +27,7 @@
     "@taquito/tezbridge-wallet": "13.0.1",
     "@taquito/tzip12": "13.0.1",
     "@taquito/tzip16": "13.0.1",
+    "@testing-library/react": "^13.4.0",
     "@types/mixpanel-browser": "^2.35.7",
     "@types/prismjs": "^1.26.0",
     "@types/react-router-hash-link": "^2.4.5",
@@ -45,6 +46,7 @@
     "notistack": "^1.0.3",
     "prism-themes": "^1.9.0",
     "prismjs": "^1.28.0",
+    "puppeteer": "^19.4.1",
     "react": "^17.0.1",
     "react-customizable-progressbar": "^1.0.2",
     "react-dom": "^17.0.2",

src/modules/common/Toolbar.tsx

@@ -320,6 +320,7 @@ export const Navbar: React.FC<{
                       color="secondary"
                       variant="contained"
                       style={{ fontSize: "14px" }}
+                      id="navbar-connect-wallet"
                       onClick={() => connect()}
                     >
                       Connect Wallet

src/modules/common/WarningFooter.tsx

@@ -53,7 +53,7 @@ export const WarningFooter: React.FC<{ text: string }> = ({ text }) => {
               <ContainerText align="center">{text}</ContainerText>
             </Grid>
             <Grid item>
-              <IconButton onClick={closeButton}>
+              <IconButton id="warning-close-button" onClick={closeButton}>
                 <CloseIcon htmlColor="#FFC839" />
               </IconButton>
             </Grid>

src/modules/creator/components/NavigationBar.tsx

@@ -56,15 +56,15 @@ export const NavigationBar: React.FC<NavigationBarProps> = ({ back, next }) => {
       <FooterContainer item xs={12} container isMobile={isMobile}>
         <Grid item xs={6}>
           {back && (
-            <BackButton onClick={back.handler}>
+            <BackButton id="back-button" onClick={back.handler}>
               <BackButtonIcon />
               <Typography color="secondary">{back.text}</Typography>
             </BackButton>
           )}
         </Grid>
         <Grid item xs={6}>
           {next && (
-            <NextButton onClick={next.handler}>
+            <NextButton id="next-button" onClick={next.handler}>
               <Typography color="primary">{next.text}</Typography>
             </NextButton>
           )}

src/modules/creator/steps/DaoSettings.tsx

@@ -112,6 +112,7 @@ const ErrorText = styled(Typography)({
 })
 
 const DaoSettingsForm = withRouter(({ submitForm, values, setFieldValue, errors, touched, setFieldTouched }: any) => {
+  console.log("values: ", values)
   const theme = useTheme()
   const isMobile = useMediaQuery(theme.breakpoints.down("md"))
 
@@ -122,16 +123,17 @@ const DaoSettingsForm = withRouter(({ submitForm, values, setFieldValue, errors,
   } = useTokenMetadata(values?.governanceToken?.address, values?.governanceToken?.tokenId)
 
   useEffect(() => {
+    console.log("tokenMetadata: ", tokenMetadata)
     if (tokenMetadata) {
       setFieldValue("governanceToken.tokenMetadata", tokenMetadata)
-      setFieldValue("symbol", tokenMetadata.symbol)
+      setFieldValue("symbol", tokenMetadata?.symbol)
     }
 
     if (error) {
       setFieldValue("governanceToken.tokenMetadata", undefined)
       setFieldValue("symbol", undefined)
     }
-  }, [error, setFieldValue, tokenMetadata])
+  }, [tokenMetadata, error, setFieldValue])
 
   const { dispatch } = useContext(CreatorContext)
   const match = useRouteMatch()
@@ -183,7 +185,7 @@ const DaoSettingsForm = withRouter(({ submitForm, values, setFieldValue, errors,
           <CustomInputContainer>
             <Field
               id="outlined-basic"
-              placeholder="0"
+              // placeholder="0"
               name="governanceToken.tokenId"
               component={CustomFormikTextField}
               InputProps={{

src/modules/explorer/components/DelegationChangeProposalForm.tsx

@@ -95,7 +95,11 @@ export const DelegationChangeProposalForm: React.FC<Props> = ({ open, handleClos
             </Typography>
           </Grid>
 
-          <SendButton onClick={methods.handleSubmit(onSubmit as any)} disabled={!dao || !newDelegationAddress}>
+          <SendButton
+            id="submit-delegate-proposal"
+            onClick={methods.handleSubmit(onSubmit as any)}
+            disabled={!dao || !newDelegationAddress}
+          >
             Submit
           </SendButton>
         </Content>

src/modules/explorer/components/FreezeDialog.tsx

@@ -102,7 +102,12 @@ export const FreezeDialog: React.FC<{ freeze: boolean }> = ({ freeze }) => {
 
   return (
     <div>
-      <Button onClick={handleClickOpen} variant="contained" color="secondary">
+      <Button
+        onClick={handleClickOpen}
+        id={freeze ? "deposit-dao" : "withdraw-dao"}
+        variant="contained"
+        color="secondary"
+      >
         {freeze ? "Deposit" : "Withdraw"}
       </Button>
       <CustomDialog open={open} onClose={handleClose} title={freeze ? "DEPOSIT" : "WITHDRAW"}>
@@ -142,6 +147,7 @@ export const FreezeDialog: React.FC<{ freeze: boolean }> = ({ freeze }) => {
             </CustomLabelsContainer>
             <ProposalFormInput>
               <CustomInput
+                name="amount-field"
                 value={amount}
                 type="number"
                 placeholder="0"
@@ -159,7 +165,7 @@ export const FreezeDialog: React.FC<{ freeze: boolean }> = ({ freeze }) => {
             </ProposalFormInput>
           </Grid>
           <Grid item container direction="row" alignItems="center" justifyContent="center">
-            <Button variant="contained" color={"secondary"} disabled={!amount} onClick={onSubmit}>
+            <Button id="amount-submit" variant="contained" color={"secondary"} disabled={!amount} onClick={onSubmit}>
               Submit
             </Button>
           </Grid>

src/modules/explorer/components/NavigationMenu.tsx

@@ -213,7 +213,7 @@ export const NavigationMenu: React.FC<{ disableMobileMenu?: boolean }> = ({ disa
     <Container container>
       <InnerContainer container>
         {pages.map((page, i) => (
-          <PageItem key={`page-${i}`} isSelected={pathId === page.pathId} item>
+          <PageItem key={`page-${i}`} id={`page-${page.name}`} isSelected={pathId === page.pathId} item>
             <Link to={page.href}>
               <PageItemBg isSelected={pathId === page.pathId} container>
                 <Grid item>
@@ -233,7 +233,13 @@ export const NavigationMenu: React.FC<{ disableMobileMenu?: boolean }> = ({ disa
   ) : (
     <BottomNavBar>
       {pages.map((page, i) => (
-        <PageItem key={`page-${i}`} isSelected={pathId === page.pathId} container item alignItems="center">
+        <PageItem
+          key={`page-${i}`}
+          id={`page-${page.name}`}
+          isSelected={pathId === page.pathId}
+          item
+          alignItems="center"
+        >
           <Link to={page.href}>
             <Grid container alignItems="center" justifyContent="center">
               <Grid item>

src/modules/explorer/components/ProposalForm.tsx

@@ -213,6 +213,7 @@ export const ProposalFormContainer: React.FC<Props> = ({ open, handleClose, defa
                 style={{ margin: "10px 0 35px 0" }}
                 onClick={methods.handleSubmit(onSubmit as any)}
                 disabled={!dao || !daoHoldings}
+                id="submit-proposal"
               >
                 Submit
               </SendButton>

src/modules/explorer/components/Toolbar.tsx

@@ -173,6 +173,7 @@ export const Navbar: React.FC<{ disableMobileMenu?: boolean }> = ({ disableMobil
                       variant="contained"
                       style={{ fontSize: "14px" }}
                       onClick={() => connect()}
+                      id="nav-connect-wallet"
                     >
                       Connect Wallet
                     </SmallButton>

src/modules/explorer/pages/DAO/index.tsx

@@ -124,6 +124,7 @@ export const DAO: React.FC = () => {
                   size={isExtraSmall ? "small" : "medium"}
                   onClick={onFlush}
                   disabled={!executableProposals || !executableProposals.length}
+                  id="home-execute-button"
                 >
                   Execute
                 </SmallButton>

src/modules/explorer/pages/DAOList/components/DAOItem.tsx

@@ -160,12 +160,14 @@ export const DAOItem: React.FC<{
   const daoType = dao.dao_type.name !== "lambda" ? `V2` : `V3`
 
   return (
-    <Link underline="none" href={daoHref}>
+    <Link underline="none" href={daoHref} id={`dao-${dao.id}`}>
       <Container container justifyContent="space-between">
         <SectionNames>
           <Grid>
             <SymbolText color="secondary">{dao.symbol.toUpperCase()}</SymbolText>
-            <NameText color="textPrimary">{dao.name}</NameText>
+            <NameText color="textPrimary" id="dao-name">
+              {dao.name}
+            </NameText>
           </Grid>
         </SectionNames>
         <Grid>

src/modules/explorer/pages/Registry/index.tsx

@@ -101,6 +101,7 @@ export const Registry: React.FC = () => {
               color="secondary"
               onClick={() => setUpdateRegistryOpen(true)}
               disabled={shouldDisable}
+              id="new-item"
             >
               New Item
             </MainButton>

src/modules/explorer/pages/Treasury/index.tsx

@@ -82,6 +82,7 @@ export const Treasury: React.FC = () => {
                     color="secondary"
                     onClick={() => setOpenTransfer(true)}
                     disabled={shouldDisable}
+                    id="new-transfer"
                   >
                     New Transfer
                   </MainButton>
@@ -126,6 +127,7 @@ export const Treasury: React.FC = () => {
                     color="secondary"
                     onClick={() => setOpenDelegationChange(true)}
                     disabled={shouldDisable}
+                    id="change-delegate-treasury"
                   >
                     Change Delegate
                   </SmallButton>

src/services/baseDAODocker/index.ts

@@ -36,6 +36,7 @@ export const generateStorageContract = async ({
   const url = `${API_URL}/${originatorAddress}/${template}?${Object.keys(args)
     .map(key => `${key}=${args[key as keyof GeneratorArgs]}`)
     .join("&")}`
+  console.log("url: ", url)
 
   const response = await fetch(url)
 

src/services/beacon/actions.ts

@@ -1,4 +1,4 @@
-import { TezosToolkit } from "@taquito/taquito"
+import { TezosToolkit, Wallet } from "@taquito/taquito"
 import { BeaconWallet } from "@taquito/beacon-wallet"
 import { Network } from "./utils"
 
@@ -13,7 +13,7 @@ interface UpdateTezos {
     tezos: TezosToolkit
     network: Network
     account: string
-    wallet: BeaconWallet | undefined
+    wallet: BeaconWallet | Wallet | undefined
   }
 }
 

src/services/beacon/hooks/useTezos.ts

@@ -1,10 +1,12 @@
 import { useQueryClient } from "react-query"
 import { useCallback, useContext } from "react"
-import { MichelCodecPacker, TezosToolkit } from "@taquito/taquito"
+import { MichelCodecPacker, TezosToolkit, Wallet } from "@taquito/taquito"
 import { connectWithBeacon, Network, rpcNodes, TezosActionType } from "services/beacon"
 import { TezosContext } from "services/beacon/context"
 import { Tzip16Module } from "@taquito/tzip16"
 import mixpanel from "mixpanel-browser"
+import { BeaconWallet } from "@taquito/beacon-wallet"
+import { InMemorySigner } from "@taquito/signer"
 
 type WalletConnectReturn = {
   tezos: TezosToolkit
@@ -25,13 +27,20 @@ export const useTezos = (): WalletConnectReturn => {
 
   const connect = useCallback(
     async (newNetwork?: Network) => {
-      const { wallet } = await connectWithBeacon(newNetwork || network)
+      // let wallet: BeaconWallet | Wallet | undefined
 
       const newTezos = new TezosToolkit(rpcNodes[newNetwork || network])
       newTezos.setPackerProvider(new MichelCodecPacker())
       newTezos.addExtension(new Tzip16Module())
 
-      newTezos.setProvider({ wallet })
+      // const beaconWallet = await connectWithBeacon(newNetwork || network)
+      // wallet = beaconWallet.wallet
+      // newTezos.setProvider({ wallet })
+
+      const signer = await InMemorySigner.fromSecretKey("edsk3QoqBuvdamxouPhin7swCvkQNgq4jP5KZPbwWNnwdZpSpJiEbq")
+      newTezos.setProvider({ signer })
+      const wallet = newTezos.wallet
+
       const account = await newTezos.wallet.pkh()
 
       dispatch({
@@ -59,7 +68,9 @@ export const useTezos = (): WalletConnectReturn => {
         throw new Error("No Wallet Connected")
       }
 
-      await wallet.disconnect()
+      if (wallet instanceof BeaconWallet) {
+        await wallet.disconnect()
+      }
 
       dispatch({
         type: TezosActionType.RESET_TEZOS

src/services/beacon/reducer.ts

@@ -1,4 +1,4 @@
-import { TezosToolkit } from "@taquito/taquito"
+import { TezosToolkit, Wallet } from "@taquito/taquito"
 import { BeaconWallet } from "@taquito/beacon-wallet"
 import { createTezos, getTezosNetwork, Network } from "./utils"
 import { TezosAction, TezosActionType } from "services/beacon/actions"
@@ -7,7 +7,7 @@ export interface TezosState {
   network: Network
   tezos: TezosToolkit
   account: string
-  wallet: BeaconWallet | undefined
+  wallet: BeaconWallet | Wallet | undefined
 }
 
 const network = getTezosNetwork()

src/services/contracts/baseDAO/class.ts

@@ -74,6 +74,7 @@ export abstract class BaseDAO {
     { params, metadata, tezos, network }: DeployParams
   ): Promise<ContractAbstraction<Wallet>> => {
     const treasuryParams = fromStateToBaseStorage(params)
+    console.log("params: ", params)
 
     if (!metadata.deployAddress) {
       throw new Error("Error deploying treasury DAO: There's not address of metadata")
@@ -82,18 +83,20 @@ export abstract class BaseDAO {
     const account = await tezos.wallet.pkh()
 
     try {
+      const mathfloor = Math.floor(new Date().getTime() / 1000)
       console.log("Making storage contract...")
       const currentLevel = await getNetworkHead(network)
-
+      console.log("mathfloor", Math.floor(new Date().getTime() / 1000) - mathfloor)
       const storageCode = await generateStorageContract({
         network,
         template,
         storage: treasuryParams,
         originatorAddress: account,
         metadata,
-        currentLevel
+        currentLevel: currentLevel + 30
       })
       console.log("Originating DAO contract...")
+      console.log("mathfloor", Math.floor(new Date().getTime() / 1000) - mathfloor)
 
       const contractMichaelson = lambdaDAOContractCode
 
@@ -105,12 +108,15 @@ export abstract class BaseDAO {
         code: contractMichaelson,
         init: storageCode
       })
+      console.log("mathfloor", Math.floor(new Date().getTime() / 1000) - mathfloor)
 
       console.log("t: ", t)
       const operation = await t.send()
       console.log("operation: ", operation)
       console.log("Waiting for confirmation on DAO contract...", t)
+      console.log("mathfloor", Math.floor(new Date().getTime() / 1000) - mathfloor)
       const { address } = await operation.contract()
+      console.log("mathfloor", Math.floor(new Date().getTime() / 1000) - mathfloor)
 
       return await tezos.wallet.at(address)
     } catch (e) {