feat: added support for creating a new wallet (#38)

* feat: added support for creating new wallet * test: added test for creating new wallet * chore: rename variable
agoric-labs · Apr 1, 2024 · 2b4f3e8 · 2b4f3e8
1 parent 520b473
commit 2b4f3e8
Show file tree

Hide file tree

Showing 7 changed files with 147 additions and 9 deletions.
diff --git a/commands/keplr.js b/commands/keplr.js
@@ -93,6 +93,88 @@ const keplr = {
     );
     return true;
   },
+  async createWallet(password, walletName, selectedChains) {
+    await module.exports.goToRegistration();
+    await playwright.waitAndClickByText(
+      onboardingElements.createWalletButton,
+      playwright.keplrWindow(),
+    );
+
+    await playwright.waitAndClickByText(
+      onboardingElements.createNewRecoveryPhraseButton,
+      playwright.keplrWindow(),
+    );
+    await playwright.waitAndClickByText(
+      onboardingElements.showMyPhraseButton,
+      playwright.keplrWindow(),
+      true,
+    );
+
+    await playwright.waitAndClickByText(
+      onboardingElements.phraseCount24,
+      playwright.keplrWindow(),
+    );
+    await playwright.waitAndClickByText(
+      onboardingElements.copyToClipboardButton,
+      playwright.keplrWindow(),
+    );
+
+    const mnemonicPhraseArray = clipboardy.readSync().split(' ');
+    await playwright.waitAndClickByText(
+      onboardingElements.nextButton,
+      playwright.keplrWindow(),
+    );
+
+    const wordLabels = await playwright.waitForElementsByText(
+      /Word #\d+/,
+      playwright.keplrWindow(),
+      true,
+    );
+
+    await playwright.waitFor(onboardingElements.focusedInput);
+    for (const wordLabel of wordLabels) {
+      const wordLabelText = await wordLabel.innerText();
+      const wordNumber = Number(wordLabelText.split('Word #')[1]) - 1;
+      const wordInputElement = wordLabel.locator('..').locator('input').first();
+      await playwright.waitAndType(
+        wordInputElement,
+        mnemonicPhraseArray[wordNumber],
+      );
+    }
+
+    await playwright.waitAndType(onboardingElements.walletInput, walletName);
+    const passwordFieldExists =
+      await playwright.waitForAndCheckElementExistence(
+        onboardingElements.passwordInput,
+      );
+
+    if (passwordFieldExists) {
+      await playwright.waitAndType(onboardingElements.passwordInput, password);
+      await playwright.waitAndType(
+        onboardingElements.confirmPasswordInput,
+        password,
+      );
+    }
+
+    await playwright.waitAndClick(
+      onboardingElements.submitWalletDataButton,
+      playwright.keplrWindow(),
+    );
+
+    await playwright.waitForByText(
+      onboardingElements.phraseSelectChain,
+      playwright.keplrWindow(),
+    );
+
+    await module.exports.handleSelectChain(selectedChains);
+
+    await playwright.waitForByText(
+      onboardingElements.phraseAccountCreated,
+      playwright.keplrWindow(),
+    );
+
+    return true;
+  },
   async importWallet(
     secretWordsOrPrivateKey,
     password,
@@ -133,6 +215,7 @@ const keplr = {
       );
     }
 
+    await playwright.waitFor(onboardingElements.focusedInput);
     await playwright.waitAndType(onboardingElements.walletInput, walletName);
 
     const passwordFieldExists =
@@ -297,6 +380,7 @@ const keplr = {
       newAccount,
       walletName,
       selectedChains,
+      createNewWallet,
     },
   ) {
     if (playwrightInstance) {
@@ -308,13 +392,18 @@ const keplr = {
     await playwright.assignWindows();
     await playwright.switchToKeplrWindow();
     await module.exports.getExtensionDetails();
-    await module.exports.importWallet(
-      secretWordsOrPrivateKey,
-      password,
-      newAccount,
-      walletName,
-      selectedChains,
-    );
+    if (createNewWallet) {
+      await module.exports.createWallet(password, walletName, selectedChains);
+    } else {
+      await module.exports.importWallet(
+        secretWordsOrPrivateKey,
+        password,
+        newAccount,
+        walletName,
+        selectedChains,
+      );
+    }
+
     await playwright.switchToCypressWindow();
   },
 

diff --git a/commands/playwright-keplr.js b/commands/playwright-keplr.js
@@ -194,6 +194,19 @@ module.exports = {
     }
     return element;
   },
+  async waitForElementsByText(text, page = keplrWindow, exact = false) {
+    await module.exports.waitUntilStable(page);
+    const elements = await page.getByText(text, { exact: exact }).all();
+    await Promise.all(elements.map(element => element.waitFor()));
+    if (process.env.STABLE_MODE) {
+      if (!isNaN(process.env.STABLE_MODE)) {
+        await page.waitForTimeout(Number(process.env.STABLE_MODE));
+      } else {
+        await page.waitForTimeout(300);
+      }
+    }
+    return elements;
+  },
   async waitForByText(text, page = keplrWindow, exact = false) {
     await module.exports.waitUntilStable(page);
     const element = page.getByText(text, { exact: exact }).first();
@@ -296,7 +309,15 @@ module.exports = {
     if (typeof value === 'number') {
       value = value.toString();
     }
-    const element = await module.exports.waitFor(selector, page);
+    let element;
+    if (typeof selector === 'string') {
+      element = await module.exports.waitFor(selector, page);
+    } else {
+      // for locator element
+      element = selector;
+      await element.waitFor();
+    }
+
     await element.type(value);
     await module.exports.waitUntilStable(page);
   },

diff --git a/pages/keplr/first-time-flow-page.js b/pages/keplr/first-time-flow-page.js
@@ -1,10 +1,15 @@
 const createWalletButton = 'Create a new wallet';
 const existingWalletButton = 'Import an existing wallet';
 const importRecoveryPhraseButton = 'Import existing recovery phrase';
+const createNewRecoveryPhraseButton = 'Create new recovery phrase';
+const showMyPhraseButton = 'I understood. Show my phrase.';
+const copyToClipboardButton = 'Copy to clipboard';
+const nextButton = 'Next';
+const focusedInput = 'input:focus';
 const useRecoveryPhraseButton = 'Use recovery phrase or private key';
 const phraseCount24 = '24 words';
 const phrasePrivateKey = 'Private key';
-const walletInput = 'input[name="name"]:focus';
+const walletInput = 'input[name="name"]';
 const passwordInput = 'input[name="password"]';
 const confirmPasswordInput = 'input[name="confirmPassword"]';
 const submitWalletDataButton = 'button[type="submit"]';
@@ -20,6 +25,11 @@ module.exports.onboardingElements = {
   existingWalletButton,
   createWalletButton,
   importRecoveryPhraseButton,
+  createNewRecoveryPhraseButton,
+  showMyPhraseButton,
+  copyToClipboardButton,
+  nextButton,
+  focusedInput,
   useRecoveryPhraseButton,
   importButtonSelector,
   phraseCount24,

diff --git a/plugins/keplr-plugin.js b/plugins/keplr-plugin.js
@@ -100,13 +100,15 @@ module.exports = (on, config) => {
       newAccount,
       walletName,
       selectedChains,
+      createNewWallet,
     }) => {
       await keplr.initialSetup(null, {
         secretWordsOrPrivateKey,
         password,
         newAccount,
         walletName,
         selectedChains,
+        createNewWallet,
       });
       return true;
     },

diff --git a/support/commands.js b/support/commands.js
@@ -418,6 +418,7 @@ Cypress.Commands.add('setupWallet', (args = {}) => {
     newAccount = false,
     walletName = 'My Wallet',
     selectedChains = [],
+    createNewWallet = false,
   } = args;
   return cy.task('setupWallet', {
     secretWordsOrPrivateKey:
@@ -428,6 +429,7 @@ Cypress.Commands.add('setupWallet', (args = {}) => {
     newAccount,
     walletName,
     selectedChains,
+    createNewWallet,
   });
 });
 

diff --git a/support/index.d.ts b/support/index.d.ts
@@ -521,6 +521,7 @@ declare namespace Cypress {
       newAccount?: boolean;
       walletName?: string;
       selectedChains?: Array<string>;
+      createNewWallet?: boolean;
     }): Chainable<Subject>;
   }
 }
diff --git a/tests/e2e/specs/keplr/keplr-spec.js b/tests/e2e/specs/keplr/keplr-spec.js
@@ -25,6 +25,14 @@ describe('Keplr', () => {
       );
     });
 
+    it(`should create a brand new wallet`, () => {
+      cy.setupWallet({
+        createNewWallet: true,
+        walletName: 'my created wallet',
+      }).then(setupFinished => {
+        expect(setupFinished).to.be.true;
+      });
+    });
     it(`should complete Keplr setup by  importing an existing wallet using 24 word phrase`, () => {
       cy.setupWallet().then(setupFinished => {
         expect(setupFinished).to.be.true;
@@ -153,5 +161,10 @@ describe('Keplr', () => {
         expect(walletAddress.length).to.be.equal(45);
       });
     });
+    it(`should create a brand new wallet without password input`, () => {
+      cy.setupWallet({ createNewWallet: true }).then(setupFinished => {
+        expect(setupFinished).to.be.true;
+      });
+    });
   });
 });