Adding Keplr Interaction for Importing Wallet using Private Key

commands/keplr.js

@@ -35,47 +35,56 @@ const keplr = {
     };
   },
 
-  async importWallet(secretWords, password) {
+  async importWallet(secretWordsOrPrivateKey, password, newAccount) {
     await playwright.waitAndClickByText(
-      onboardingElements.createWalletButton,
-      await playwright.keplrWindow(),
-    );
-    await playwright.waitAndClickByText(
-      onboardingElements.importRecoveryPhraseButton,
-      await playwright.keplrWindow(),
-    );
-    await playwright.waitAndClickByText(
-      onboardingElements.useRecoveryPhraseButton,
+      newAccount
+        ? onboardingElements.createWalletButton
+        : onboardingElements.existingWalletButton,
       await playwright.keplrWindow(),
     );
+
     await playwright.waitAndClickByText(
-      onboardingElements.phraseCount24,
+      newAccount
+        ? onboardingElements.importRecoveryPhraseButton
+        : onboardingElements.useRecoveryPhraseButton,
       await playwright.keplrWindow(),
     );
 
-    for (const [index, word] of secretWords.split(' ').entries()) {
-      await playwright.waitAndTypeByLocator(
-        onboardingElements.textAreaSelector,
-        word,
-        index,
+    newAccount &&
+      (await playwright.waitAndClickByText(
+        onboardingElements.useRecoveryPhraseButton,
+        await playwright.keplrWindow(),
+      ));
+
+    if (secretWordsOrPrivateKey.includes(' ')) {
+      await module.exports.importWalletWithPhrase(
+        secretWordsOrPrivateKey,
+        password,
+      );
+    } else {
+      await module.exports.importWalletWithPrivateKey(
+        secretWordsOrPrivateKey,
+        password,
       );
     }
 
-    await playwright.waitAndClick(
-      onboardingElements.submitPhraseButton,
-      await playwright.keplrWindow(),
-    );
-
     await playwright.waitAndType(
       onboardingElements.walletInput,
       onboardingElements.walletName,
     );
-    await playwright.waitAndType(onboardingElements.passwordInput, password);
-    await playwright.waitAndType(
-      onboardingElements.confirmPasswordInput,
-      password,
+
+    const passwordFieldExists = await playwright.doesElementExist(
+      onboardingElements.passwordInput,
     );
 
+    if (passwordFieldExists) {
+      await playwright.waitAndType(onboardingElements.passwordInput, password);
+      await playwright.waitAndType(
+        onboardingElements.confirmPasswordInput,
+        password,
+      );
+    }
+
     await playwright.waitAndClick(
       onboardingElements.submitWalletDataButton,
       await playwright.keplrWindow(),
@@ -105,7 +114,42 @@ const keplr = {
 
     return true;
   },
+  async importWalletWithPhrase(secretWords) {
+    await playwright.waitAndClickByText(
+      onboardingElements.phraseCount24,
+      await playwright.keplrWindow(),
+    );
+
+    for (const [index, word] of secretWords.split(' ').entries()) {
+      await playwright.waitAndTypeByLocator(
+        onboardingElements.textAreaSelector,
+        word,
+        index,
+      );
+    }
+
+    await playwright.waitAndClick(
+      onboardingElements.submitPhraseButton,
+      await playwright.keplrWindow(),
+    );
+  },
+  async importWalletWithPrivateKey(privateKey) {
+    await playwright.waitAndClickByText(
+      onboardingElements.phrasePrivateKey,
+      await playwright.keplrWindow(),
+      true,
+    );
+
+    await playwright.waitAndTypeByLocator(
+      onboardingElements.textAreaSelector,
+      privateKey,
+    );
 
+    await playwright.waitAndClick(
+      onboardingElements.submitPhraseButton,
+      await playwright.keplrWindow(),
+    );
+  },
   async acceptAccess() {
     const notificationPage = await playwright.switchToKeplrNotification();
     await playwright.waitAndClick(
@@ -128,7 +172,7 @@ const keplr = {
 
   async initialSetup(
     playwrightInstance,
-    { secretWordsOrPrivateKey, password },
+    { secretWordsOrPrivateKey, password, newAccount },
   ) {
     if (playwrightInstance) {
       await playwright.init(playwrightInstance);
@@ -139,8 +183,12 @@ const keplr = {
     await playwright.assignWindows();
     await playwright.assignActiveTabName('keplr');
     await module.exports.getExtensionDetails();
-    await module.exports.importWallet(secretWordsOrPrivateKey, password);
+    await module.exports.importWallet(
+      secretWordsOrPrivateKey,
+      password,
+      newAccount,
+    );
   },
 };
 
-module.exports = keplr;
+module.exports = keplr;

commands/playwright-keplr.js

@@ -7,6 +7,7 @@ let browser;
 let mainWindow;
 let keplrWindow;
 let keplrNotificationWindow;
+let keplrRegistrationWindow;
 let activeTabName;
 let extensionsData = {};
 let retries = 0;
@@ -19,6 +20,7 @@ module.exports = {
     keplrWindow = undefined;
     activeTabName = undefined;
     keplrNotificationWindow = undefined;
+    keplrRegistrationWindow = undefined;
     retries = 0;
     extensionsData = {};
   },
@@ -77,9 +79,9 @@ module.exports = {
     return keplrNotificationWindow;
   },
 
-  async waitAndClickByText(text, page = keplrWindow) {
+  async waitAndClickByText(text, page = keplrWindow, exact = false) {
     await module.exports.waitForByText(text, page);
-    const element = `:is(:text-is("${text}"), :text("${text}"))`;
+    const element = `:is(:text-is("${text}")${exact ? '' : `, :text("${text}")`})`;
     await page.click(element);
     await module.exports.waitUntilStable();
   },
@@ -170,16 +172,13 @@ module.exports = {
   },
 
   async waitUntilStable(page) {
-    const keplrExtensionData = (await module.exports.getExtensionsData())
-      .keplr;
+    const keplrExtensionData = (await module.exports.getExtensionsData()).keplr;
 
     if (
       page &&
       page
         .url()
-        .includes(
-          `chrome-extension://${keplrExtensionData.id}/register.html`,
-        )
+        .includes(`chrome-extension://${keplrExtensionData.id}/register.html`)
     ) {
       await page.waitForLoadState('load');
       await page.waitForLoadState('domcontentloaded');
@@ -216,6 +215,14 @@ module.exports = {
     }
     return element;
   },
+  async doesElementExist(selector, timeout = 1000, page = keplrWindow) {
+    try {
+      await page.waitForSelector(selector, { timeout });
+      return true;
+    } catch (error) {
+      return false;
+    }
+  },
   async waitForByText(text, page = keplrWindow) {
     await module.exports.waitUntilStable(page);
     // await page.waitForSelector(selector, { strict: false });
@@ -347,6 +354,15 @@ module.exports = {
     return extensionsData;
   },
 
+  async switchToKeplrRegistrationWindow() {
+    const keplrExtensionData = (await module.exports.getExtensionsData()).keplr;
+    const browserContext = await browser.contexts()[0];
+    keplrRegistrationWindow = await browserContext.newPage();
+    await keplrRegistrationWindow.goto(
+      `chrome-extension://${keplrExtensionData.id}/register.html`,
+    );
+    return true;
+  },
   async switchToKeplrNotification() {
     const keplrExtensionData = (await module.exports.getExtensionsData()).keplr;
 
@@ -375,4 +391,4 @@ module.exports = {
       );
     }
   },
-};
+};

pages/keplr/first-time-flow-page.js

@@ -1,7 +1,9 @@
 const createWalletButton = 'Create a new wallet';
-const importRecoveryPhraseButton = 'Import existing recovery phrase';
+const existingWalletButton = 'Import an existing wallet';
+const importRecoveryPhraseButton = 'Import existing recovery phrase'; 
 const useRecoveryPhraseButton = 'Use recovery phrase or private key';
 const phraseCount24 = '24 words';
+const phrasePrivateKey = 'Private key';
 const walletInput = 'input[name="name"]:focus';
 const passwordInput = 'input[name="password"]';
 const confirmPasswordInput = 'input[name="confirmPassword"]';
@@ -15,10 +17,12 @@ const textAreaSelector = 'textbox';
 const submitPhraseButton = 'button[type="submit"]';
 
 module.exports.onboardingElements = {
+  existingWalletButton,
   createWalletButton,
   importRecoveryPhraseButton,
   useRecoveryPhraseButton,
   phraseCount24,
+  phrasePrivateKey,
   walletInput,
   walletName,
   passwordInput,

plugins/keplr-plugin.js

@@ -59,24 +59,21 @@ module.exports = (on, config) => {
     clearWindows: playwright.clearWindows,
     isCypressWindowActive: playwright.isCypressWindowActive,
     switchToExtensionWindow: playwright.switchToKeplrWindow,
+    switchToExtensionRegistrationWindow: playwright.switchToKeplrRegistrationWindow,
 
     // keplr commands
     importWallet: keplr.importWallet,
     acceptAccess: keplr.acceptAccess,
     confirmTransaction: keplr.confirmTransaction,
     setupWallet: async ({
       secretWordsOrPrivateKey,
-      network,
       password,
-      enableAdvancedSettings,
-      enableExperimentalSettings,
+      newAccount,
     }) => {
       await keplr.initialSetup(null, {
         secretWordsOrPrivateKey,
-        network,
         password,
-        enableAdvancedSettings,
-        enableExperimentalSettings,
+        newAccount
       });
       return true;
     },

support/commands.js

@@ -415,10 +415,12 @@ Cypress.Commands.add(
   (
     secretWordsOrPrivateKey = 'orbit bench unit task food shock brand bracket domain regular warfare company announce wheel grape trust sphere boy doctor half guard ritual three ecology',
     password = 'Test1234',
+    newAccount = false
   ) => {
     return cy.task('setupWallet', {
       secretWordsOrPrivateKey,
-      password
+      password,
+      newAccount
     });
   },
 );
@@ -437,4 +439,8 @@ Cypress.Commands.add('isExtensionWindowActive', () => {
 
 Cypress.Commands.add('switchToExtensionWindow', () => {
   return cy.task('switchToExtensionWindow');
+});
+
+Cypress.Commands.add('switchToExtensionRegistrationWindow', () => {
+  return cy.task('switchToExtensionRegistrationWindow');
 });

tests/e2e/specs/keplr/keplr-spec.js

@@ -1,30 +1,54 @@
 /* eslint-disable ui-testing/no-disabled-tests */
 describe('Keplr', () => {
-    context('Test commands', () => {
-      it(`setupWallet should finish Keplr setup using secret words`, () => {
-        cy.setupWallet().then(setupFinished => {
-          expect(setupFinished).to.be.true;
-        });
-      });
-
-      it(`acceptAccess should accept connection request to Keplr`, () => {
+  context('Test commands', () => {
+    it(`should complete Keplr connect with wallet, and confirm transaction after importing an existing wallet using 24 word phrase`, () => {
+      cy.setupWallet().then(setupFinished => {
+        expect(setupFinished).to.be.true;
+
         cy.visit('/');
         cy.contains('Connect Wallet').click();
         cy.acceptAccess().then(taskCompleted => {
           expect(taskCompleted).to.be.true;
+
+          cy.contains('Make an Offer').click();
+          cy.confirmTransaction().then(taskCompleted => {
+            expect(taskCompleted).to.be.true;
+          });
         });
-        cy.get('.card')
-          .contains('My Wallet')
-          .then(p => console.log(p));
-
-        cy.contains('agoric1p2aqakv3ulz4qfy2nut86j9gx0dx0yw09h96md');
       });
-
-      it(`confirmTransaction should confirm transaction for token creation (contract deployment) and check tx data`, () => {
-        cy.contains('Make an Offer').click();
-        cy.confirmTransaction().then(taskCompleted => {
-          expect(taskCompleted).to.be.true;
+    });
+
+    it(`should complete Keplr connect with wallet, and confirm transaction after creating a new wallet using 24 word phrase`, () => {
+      cy.switchToExtensionRegistrationWindow().then(() => {
+        cy.setupWallet(
+          'orbit bench unit task food shock brand bracket domain regular warfare company announce wheel grape trust sphere boy doctor half guard ritual three ecology',
+          'Test1234',
+          true,
+        ).then(setupFinished => {
+          expect(setupFinished).to.be.true;
+
+          cy.visit('/');
+          cy.contains('Connect Wallet').click();
+          cy.acceptAccess().then(taskCompleted => {
+            expect(taskCompleted).to.be.true;
+
+            cy.contains('Make an Offer').click();
+            cy.confirmTransaction().then(taskCompleted => {
+              expect(taskCompleted).to.be.true;
+            });
+          });
+        });
+      });
+    });
+
+    it(`should complete Keplr setup by importing the wallet using private key`, () => {
+      cy.switchToExtensionRegistrationWindow().then(() => {
+        cy.setupWallet(
+          'A9C09B6E4AF70DE1F1B621CB1AA66CFD0B4AA977E4C18497C49132DD9E579485',
+        ).then(setupFinished => {
+          expect(setupFinished).to.be.true;
         });
       });
     });
-  });
+  });
+});