Getting Wallet Address #17

rabi-siddique · 2024-03-05T13:46:39Z

The PR adds implementation for extracting the wallet address of the chain.

rabi-siddique · 2024-03-05T14:05:04Z

commands/keplr.js

+    await playwright.waitAndClickByText(notificationPageElements.copyAddress);
+    await page.click(notificationPageElements.copyWalletAddressSelector);
+    const walletAddress = clipboardy.readSync();
+    await playwright.switchToCypressWindow();


I've initially tried to get value from the clipboard by executing a script through execute in Playwright. When I tried to get value from the clipboard in the browser, it asked me for permission to access it. It was showing a popup. I tried these things which didn't work:

I tried changing permissions in the browser config but they didn't apply. With the Playwright, it involved setting up a whole new context. With Cypress, the options were not according to our needs.

I also tried using the Tab key. I tried to press the Tab key 3 times using Playwright, to focus on the permission popup and then press the Enter key to get the permission but encountered issues related to focus there.

I tried a few more things which mainly involved executing a script through execute. But didn't work. So I explored some libraries and found clipboardy. I feel it is an intuitive way of catching the value from the clipboard without adding any complexity. And it is working fine.

rabi-siddique · 2024-03-05T14:06:39Z

commands/playwright-keplr.js

@@ -44,6 +44,9 @@ module.exports = {
  isCypressWindowActive() {
    return activeTabName === 'cypress';
  },
+  activeTabName() {
+    return activeTabName;
+  },
  async switchToKeplrWindow() {


Not being used but I feel it's still handy and can be used in the future. It was helpful when I was debugging an issue in keplr.js file.

rabi-siddique · 2024-03-05T14:28:30Z

pages/keplr/notification-page.js

@@ -1,5 +1,9 @@
 const approveButton = `button`;
+const copyAddress = 'Copy Address';
+const copyWalletAddressSelector = 'div.sc-dkzDqf div.sc-hKMtZM.sc-kDDrLX.cyoEAq.dkJSBQ'



At the moment, using a selector to copy cosmos address. This is temporary as I have to add an implementation for selecting agoric chain in our importWallet flow. Then I'll update the selector based on that.

rabi-siddique · 2024-03-05T14:30:28Z

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

+  it(`should get wallet address`, () => {
+    cy.getWalletAddress().then(walletAddress => {
+      expect(walletAddress.length).to.be.equal(45);
+    });


At the moment, validating it based on the length. Because cosmos address seems to change in subsequent iterations of running tests. But once I add select chain implementation in our importWallet flow, we will check the exact value over here.

why not get the agoriclocal address instead? that is always constant

Yeah, that chain still has to be selected for its address to be visible when collecting wallet addresses. For the implementation I'm referring to, I am planning to select agoric as well as agoric-local in it.

frazarshad · 2024-03-05T16:32:21Z

commands/keplr.js

+    const page = await playwright.keplrWindow();
+    await playwright.waitAndClickByText(notificationPageElements.copyAddress);
+    await page.click(notificationPageElements.copyWalletAddressSelector);
+    const walletAddress = clipboardy.readSync();


why would we want to store the walletAddress globally? don't we have multiple addresses, depending on our chain?

also remove const to avoid variable shadowing

At one time, we will be dealing with one instance of the wallet. And for that instance there will be only only one wallet address for the agoric chain

frazarshad · 2024-03-05T16:32:46Z

commands/keplr.js

+    await module.exports.goToHome();
+    const page = await playwright.keplrWindow();
+    await playwright.waitAndClickByText(notificationPageElements.copyAddress);
+    await page.click(notificationPageElements.copyWalletAddressSelector);


waitAndClick should be used instead of calling click directly

This is a temp. I'll update it according to the appropriate helper method after adding implementation for selecting chain in our import wallet flow. Btw, you tried it with waitAndClick?

frazarshad · 2024-03-05T16:34:28Z

commands/keplr.js

@@ -60,13 +74,15 @@ const keplr = {
    extensionVersion = keplrExtensionData.version;
    registrationUrl = `chrome-extension://${extensionId}/register.html`;
    permissionsUrl = `chrome-extension://${extensionId}/popup.html#/setting/security/permission`;
+    popupUrl = `chrome-extension://${extensionId}/popup.html`;


rename to 'dashbaordUrl' or 'homeUrl'. it more closely resemble the intended purpose of the page

You're right. These names are more intention revealing. But I'm noticing that popup.html has dynamic content. For example, it's the same URL when we encounter a notification. I feel we should stick with popupUrl as a generic

frazarshad · 2024-03-05T16:35:33Z

commands/keplr.js

+  async getWalletAddress() {
+    await playwright.switchToKeplrWindow();
+    await module.exports.goToHome();
+    const page = await playwright.keplrWindow();


keplrWindow is not async :))

* Remove leftover TODOs * Remove text based locators * Add `Known problems with MetaMask` section * Remove Promise wrap from `cy.setupMetamask()` (Synthetixio#927) * Fix localized Chrome's extension id (Synthetixio#928) * Fix localized Chrome's extension id * Improve id handling --------- Co-authored-by: Piotr Frankowski <piotr@f-dev.io> * Lint * Feature/revoke permission to all (Synthetixio#932) * Fix typo in Permission word * Add permission revoking actions * Add tests for permission revoking actions * Regenerate synpress commands file * Add `switchNetwork` option to `acceptAccess` function * Add new release section to README * Use `goerli` for testing (Synthetixio#1082) * Use `goerli` for testing * Trigger tests * Add `shouldWaitForPopupClosure` option to approvals and txs (Synthetixio#1081) * feature: intial setup for integration of keplr * chore: use Error object for throwing an error related to invalid extension name * Adding Keplr Interaction for Importing Wallet using Private Key (#2) * feature: adding keplr interaction for creating an account using private key * feature: keplr interaction for importing an existing wallet and creating a new wallet * fix: fixed implementation of waitAndClickByText to perform exact matching --------- Co-authored-by: Fraz Arshad <fraz.arshad12@gmail.com> * Disconnect Wallet Interaction (#7) * chore: removing call to acceptAccess function * feature: adding intereaction for disconnecting with wallet * remve the default arg * Added Interaction to handle rejection of wallet connection (#8) * feat: added code to handle reject wallet access * feat: added test case for reject wallet access + modified test structure * Include code for Offer up Dapp (#10) * feat(ci): Included ui/ and contract/ from offer-up-dapp (with changes) * refactor: moved ui/ and contract/ to tools/ folder * Updates to CI/CD to use Agoric chain and Offer up DApp (#4) * feat(ci): Included ui/ and contract/ from offer-up-dapp (with changes) * feat(ci): Updated CI to use agoric chain + offer up dapp * fix(ci): updated scripts in package.json * refactor(ci): Moved ui/ and contract/ to tools/ * refactor: moved json-server-db.json to tools folder * Single Screen Interaction, Approve Button Fix and Code Cleanup (#9) * chore: organize code in playwright.keplr.js and remove not used states * chore: resolve merge conflicts with dev branch * chore: using a consistent and more intention revealing name for a helper function * chore: adding a test case for validating the switchToExtensionWindow function * chore: change selector for Approve button on connecting with wallet UI * chore: addressing PR comments * Interaction for transaction rejection (#12) * feat: added logic for transaction rejection * feat: added test for transaction rejection * fix: typo in test name * chore:remove call to switchToKeplrWindow in metamask.js (#16) * Abstracting Calls to Switching Extension in Keplr Helper Methods (#13) * chore: abstracting calls to switching to keplr window in keplr helper functions * chore: removing unnecessary awaits with sync function * Enable setup of the keplr extension in the beforeAll hook for cypress (#14) * fix: added code to handle setup of keplr wallet beforehand * chore: lint fixes * Add command to switch to another wallet (#18) * feat: interaction to switch wallet * chore: fixes for await async * Getting Wallet Address (#17) * feat: initial working setup for retrieving wallet address * chore:code cleanup * feat: interaction to switch wallet * chore: simplifying switching screens in import wallet flow * chore format code with prettier * chore: moving get wallet address test case in the main context * chore: fixes for await async * chore: address PR comments --------- Co-authored-by: Fraz Arshad <fraz.arshad12@gmail.com> * Added Interaction to get the value of a certain token (#19) * feat: added command to get tokens * chore: await/async fixes * Updates to CI/CD flow (#20) * ci: new docker ci file for keplr * ci: using docker workflow instead of debug workflow temporarily * ci: updated config to have not retires in ci * Adding Selecting Chain Interaction And Flow Improvements (#21) * chore: changing the flow of test cases; starting by creating a new wallet rather than importing * feature: adding behavior in import wallet flow to select a chain when importing/creating wallet * feature: adding helper methods to click elements in a reliable way * chore: using helper methods inside keplr.js * chore: handling edge case for grabbing token values when values are large numbers containing commas * chore: updating selector for getting wallet address and adding test cases to validate the behavior * chore: addressing PR comments * chore: addressing PR comments * chore: replacing Agoric local with Agoric localhost * feat: included settings to setup npm (#22) * refactor: changed args for setupWallet (#24) * Added automatic linting to the repository (#23) * style:changing settings for linting * style: fixes to lint + styling throughout repo * Enabled CI Pipeline for NPM deployment (#25) * feat: release workflow enabled * feat: added CI cache folders to .npmignore * chore: revert back to master after testing --------- Co-authored-by: duckception <spidiritsu@gmail.com> Co-authored-by: Peter F <pietras93@gmail.com> Co-authored-by: Piotr Frankowski <piotr@f-dev.io> Co-authored-by: Rafał Majchrzak <rafal2228@gmail.com> Co-authored-by: rabi-siddique <rabisiddique27@gmail.com> Co-authored-by: Rabi Siddique <60459172+rabi-siddique@users.noreply.github.com>

* Remove leftover TODOs * Remove text based locators * Add `Known problems with MetaMask` section * Remove Promise wrap from `cy.setupMetamask()` (Synthetixio#927) * Fix localized Chrome's extension id (Synthetixio#928) * Fix localized Chrome's extension id * Improve id handling --------- Co-authored-by: Piotr Frankowski <piotr@f-dev.io> * Lint * Feature/revoke permission to all (Synthetixio#932) * Fix typo in Permission word * Add permission revoking actions * Add tests for permission revoking actions * Regenerate synpress commands file * Add `switchNetwork` option to `acceptAccess` function * Add new release section to README * Use `goerli` for testing (Synthetixio#1082) * Use `goerli` for testing * Trigger tests * Add `shouldWaitForPopupClosure` option to approvals and txs (Synthetixio#1081) * feature: intial setup for integration of keplr * chore: use Error object for throwing an error related to invalid extension name * Adding Keplr Interaction for Importing Wallet using Private Key (#2) * feature: adding keplr interaction for creating an account using private key * feature: keplr interaction for importing an existing wallet and creating a new wallet * fix: fixed implementation of waitAndClickByText to perform exact matching --------- Co-authored-by: Fraz Arshad <fraz.arshad12@gmail.com> * Disconnect Wallet Interaction (#7) * chore: removing call to acceptAccess function * feature: adding intereaction for disconnecting with wallet * remve the default arg * Added Interaction to handle rejection of wallet connection (#8) * feat: added code to handle reject wallet access * feat: added test case for reject wallet access + modified test structure * Include code for Offer up Dapp (#10) * feat(ci): Included ui/ and contract/ from offer-up-dapp (with changes) * refactor: moved ui/ and contract/ to tools/ folder * Updates to CI/CD to use Agoric chain and Offer up DApp (#4) * feat(ci): Included ui/ and contract/ from offer-up-dapp (with changes) * feat(ci): Updated CI to use agoric chain + offer up dapp * fix(ci): updated scripts in package.json * refactor(ci): Moved ui/ and contract/ to tools/ * refactor: moved json-server-db.json to tools folder * Single Screen Interaction, Approve Button Fix and Code Cleanup (#9) * chore: organize code in playwright.keplr.js and remove not used states * chore: resolve merge conflicts with dev branch * chore: using a consistent and more intention revealing name for a helper function * chore: adding a test case for validating the switchToExtensionWindow function * chore: change selector for Approve button on connecting with wallet UI * chore: addressing PR comments * Interaction for transaction rejection (#12) * feat: added logic for transaction rejection * feat: added test for transaction rejection * fix: typo in test name * chore:remove call to switchToKeplrWindow in metamask.js (#16) * Abstracting Calls to Switching Extension in Keplr Helper Methods (#13) * chore: abstracting calls to switching to keplr window in keplr helper functions * chore: removing unnecessary awaits with sync function * Enable setup of the keplr extension in the beforeAll hook for cypress (#14) * fix: added code to handle setup of keplr wallet beforehand * chore: lint fixes * Add command to switch to another wallet (#18) * feat: interaction to switch wallet * chore: fixes for await async * Getting Wallet Address (#17) * feat: initial working setup for retrieving wallet address * chore:code cleanup * feat: interaction to switch wallet * chore: simplifying switching screens in import wallet flow * chore format code with prettier * chore: moving get wallet address test case in the main context * chore: fixes for await async * chore: address PR comments --------- Co-authored-by: Fraz Arshad <fraz.arshad12@gmail.com> * Added Interaction to get the value of a certain token (#19) * feat: added command to get tokens * chore: await/async fixes * Updates to CI/CD flow (#20) * ci: new docker ci file for keplr * ci: using docker workflow instead of debug workflow temporarily * ci: updated config to have not retires in ci * Adding Selecting Chain Interaction And Flow Improvements (#21) * chore: changing the flow of test cases; starting by creating a new wallet rather than importing * feature: adding behavior in import wallet flow to select a chain when importing/creating wallet * feature: adding helper methods to click elements in a reliable way * chore: using helper methods inside keplr.js * chore: handling edge case for grabbing token values when values are large numbers containing commas * chore: updating selector for getting wallet address and adding test cases to validate the behavior * chore: addressing PR comments * chore: addressing PR comments * chore: replacing Agoric local with Agoric localhost * feat: included settings to setup npm (#22) * refactor: changed args for setupWallet (#24) * Added automatic linting to the repository (#23) * style:changing settings for linting * style: fixes to lint + styling throughout repo * Enabled CI Pipeline for NPM deployment (#25) * feat: release workflow enabled * feat: added CI cache folders to .npmignore * chore: revert back to master after testing * Fix for switching between keplr windows with same url (#27) * fix: checking added for window instance * test: test added for edge case * fix: added click after timeout to resolve flakiness (#28) * Updated README.md (#29) * docs: updated README.md * docs: added env section to readme * docs: 24 words memonics --------- Co-authored-by: duckception <spidiritsu@gmail.com> Co-authored-by: Peter F <pietras93@gmail.com> Co-authored-by: Piotr Frankowski <piotr@f-dev.io> Co-authored-by: Rafał Majchrzak <rafal2228@gmail.com> Co-authored-by: rabi-siddique <rabisiddique27@gmail.com> Co-authored-by: Rabi Siddique <60459172+rabi-siddique@users.noreply.github.com>

rabi-siddique and others added 5 commits March 5, 2024 17:33

feat: initial working setup for retrieving wallet address

6009faa

chore:code cleanup

5590696

feat: interaction to switch wallet

9567506

chore: simplifying switching screens in import wallet flow

682e71d

chore format code with prettier

9ab2db4

rabi-siddique commented Mar 5, 2024

View reviewed changes

rabi-siddique and others added 4 commits March 5, 2024 19:35

chore: moving get wallet address test case in the main context

9ff28d3

chore: fixes for await async

1638199

merge switch wallet PR and resolve conflicts

7c1c89e

Merge branch 'dev' into rs-interaction-for-getting-wallet-address

8715041

frazarshad reviewed Mar 5, 2024

View reviewed changes

chore: address PR comments

157131c

frazarshad merged commit fa21859 into dev Mar 5, 2024
2 checks passed

frazarshad deleted the rs-interaction-for-getting-wallet-address branch March 5, 2024 17:16

frazarshad approved these changes Mar 5, 2024

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Getting Wallet Address #17

Getting Wallet Address #17

rabi-siddique commented Mar 5, 2024 •

edited

Loading

rabi-siddique Mar 5, 2024

rabi-siddique Mar 5, 2024

rabi-siddique Mar 5, 2024

rabi-siddique Mar 5, 2024

frazarshad Mar 5, 2024

rabi-siddique Mar 5, 2024 •

edited

Loading

frazarshad Mar 5, 2024

rabi-siddique Mar 5, 2024

frazarshad Mar 5, 2024

rabi-siddique Mar 5, 2024

frazarshad Mar 5, 2024

rabi-siddique Mar 5, 2024

frazarshad Mar 5, 2024

Getting Wallet Address #17

Getting Wallet Address #17

Conversation

rabi-siddique commented Mar 5, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

rabi-siddique Mar 5, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

rabi-siddique commented Mar 5, 2024 •

edited

Loading

rabi-siddique Mar 5, 2024 •

edited

Loading