From 6fcccbf692ae894258f6f98a75889ad86a958dd2 Mon Sep 17 00:00:00 2001 From: Priya Date: Fri, 12 Jul 2024 16:00:24 +0200 Subject: [PATCH] revert: un-revert metrics and signature refactor test (#25758) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## **Description** [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/25758?quickstart=1) ## **Related issues** Fixes: ## **Manual testing steps** 1. Go to this page... 2. 3. ## **Screenshots/Recordings** ### **Before** ### **After** ## **Pre-merge author checklist** - [ ] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Extension Coding Standards](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/CODING_GUIDELINES.md). - [ ] I've completed the PR template to the best of my ability - [ ] I’ve included tests if applicable - [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [ ] I’ve applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots. --- test/e2e/tests/confirmations/header.spec.js | 114 ------------------ test/e2e/tests/confirmations/helpers.ts | 51 ++++++++ .../confirmations/signatures/permit.spec.ts | 64 ++++++++-- .../signatures/personal-sign.spec.ts | 32 ++++- .../signatures/sign-typed-data-v3.spec.ts | 65 ++++++++-- .../signatures/sign-typed-data-v4.spec.ts | 47 +++++++- .../signatures/sign-typed-data.spec.ts | 45 ++++++- .../signatures/signature-helpers.ts | 101 ++++++++++++++++ 8 files changed, 383 insertions(+), 136 deletions(-) delete mode 100644 test/e2e/tests/confirmations/header.spec.js create mode 100644 test/e2e/tests/confirmations/signatures/signature-helpers.ts diff --git a/test/e2e/tests/confirmations/header.spec.js b/test/e2e/tests/confirmations/header.spec.js deleted file mode 100644 index 91828147b4ab..000000000000 --- a/test/e2e/tests/confirmations/header.spec.js +++ /dev/null @@ -1,114 +0,0 @@ -const { strict: assert } = require('assert'); -const { - defaultGanacheOptions, - openDapp, - unlockWallet, - WINDOW_TITLES, - withFixtures, -} = require('../../helpers'); -const FixtureBuilder = require('../../fixture-builder'); - -const SIGNATURE_CONFIRMATIONS = [ - { name: 'Personal Sign signature', testDAppBtnId: 'personalSign' }, - { name: 'Sign Typed Data signature', testDAppBtnId: 'signTypedData' }, - { name: 'Sign Typed Data v3 signature', testDAppBtnId: 'signTypedDataV3' }, - { name: 'Sign Typed Data v4 signature', testDAppBtnId: 'signTypedDataV4' }, - { name: 'Sign Permit signature', testDAppBtnId: 'signPermit' }, -]; - -const WALLET_ADDRESS = '0x5CfE73b6021E818B776b421B1c4Db2474086a7e1'; -const WALLET_ETH_BALANCE = '25'; - -describe('Confirmation Header Component', function () { - SIGNATURE_CONFIRMATIONS.forEach((confirmation) => { - it(`${confirmation.name} component includes header with balance`, async function () { - await withFixtures( - { - dapp: true, - fixtures: new FixtureBuilder() - .withPermissionControllerConnectedToTestDapp() - .withPreferencesController({ - preferences: { redesignedConfirmationsEnabled: true }, - }) - .build(), - ganacheOptions: defaultGanacheOptions, - title: this.test?.fullTitle(), - }, - async ({ driver }) => { - await unlockWallet(driver); - await openDapp(driver); - - await clickConfirmationBtnOnTestDapp( - driver, - confirmation.testDAppBtnId, - ); - await clickHeaderInfoBtn(driver); - - await assertHeaderInfoBalance(driver, WALLET_ETH_BALANCE); - }, - ); - }); - - it(`${confirmation.name} component includes copyable address element`, async function () { - await withFixtures( - { - dapp: true, - fixtures: new FixtureBuilder() - .withPermissionControllerConnectedToTestDapp() - .withPreferencesController({ - preferences: { redesignedConfirmationsEnabled: true }, - }) - .build(), - ganacheOptions: defaultGanacheOptions, - title: this.test?.fullTitle(), - }, - async ({ driver }) => { - await unlockWallet(driver); - await openDapp(driver); - - await clickConfirmationBtnOnTestDapp( - driver, - confirmation.testDAppBtnId, - ); - await clickHeaderInfoBtn(driver); - await copyAddressAndPasteWalletAddress(driver); - - await assertPastedAddress(driver, WALLET_ADDRESS); - }, - ); - }); - - async function clickConfirmationBtnOnTestDapp(driver, btnId) { - await driver.switchToWindowWithTitle(WINDOW_TITLES.TestDApp); - await driver.clickElement(`#${btnId}`); - await driver.delay(2000); - } - - async function clickHeaderInfoBtn(driver) { - await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog); - await driver.clickElement( - 'button[data-testid="header-info__account-details-button"]', - ); - } - - async function assertHeaderInfoBalance(driver, walletEthBalance) { - const headerBalanceEl = await driver.findElement( - '[data-testid="confirmation-account-details-modal__account-balance"]', - ); - await driver.waitForNonEmptyElement(headerBalanceEl); - assert.equal(await headerBalanceEl.getText(), `${walletEthBalance}\nETH`); - } - - async function copyAddressAndPasteWalletAddress(driver) { - await driver.clickElement('[data-testid="address-copy-button-text"]'); - await driver.switchToWindowWithTitle(WINDOW_TITLES.TestDApp); - await driver.findElement('#eip747ContractAddress'); - await driver.pasteFromClipboardIntoField('#eip747ContractAddress'); - } - - async function assertPastedAddress(driver, walletAddress) { - const formFieldEl = await driver.findElement('#eip747ContractAddress'); - assert.equal(await formFieldEl.getProperty('value'), walletAddress); - } - }); -}); diff --git a/test/e2e/tests/confirmations/helpers.ts b/test/e2e/tests/confirmations/helpers.ts index b6a19a6b95a9..ba27cbb44da2 100644 --- a/test/e2e/tests/confirmations/helpers.ts +++ b/test/e2e/tests/confirmations/helpers.ts @@ -1,5 +1,6 @@ import FixtureBuilder from '../../fixture-builder'; import { defaultGanacheOptions, withFixtures } from '../../helpers'; +import { Mockttp } from '../../mock-e2e'; import { Driver } from '../../webdriver/driver'; export async function scrollAndConfirmAndAssertConfirm(driver: Driver) { @@ -23,6 +24,10 @@ export function withRedesignConfirmationFixtures( }, fixtures: new FixtureBuilder() .withPermissionControllerConnectedToTestDapp() + .withMetaMetricsController({ + metaMetricsId: 'fake-metrics-id', + participateInMetaMetrics: true, + }) .withPreferencesController({ preferences: { redesignedConfirmationsEnabled: true, @@ -31,7 +36,53 @@ export function withRedesignConfirmationFixtures( .build(), ganacheOptions: defaultGanacheOptions, title, + testSpecificMock: mockSegment, }, testFunction, ); } + +async function mockSegment(mockServer: Mockttp) { + return [ + await mockServer + .forPost('https://api.segment.io/v1/batch') + .withJsonBodyIncluding({ + batch: [{ type: 'track', event: 'Signature Requested' }], + }) + .thenCallback(() => { + return { + statusCode: 200, + }; + }), + await mockServer + .forPost('https://api.segment.io/v1/batch') + .withJsonBodyIncluding({ + batch: [{ type: 'track', event: 'Signature Approved' }], + }) + .thenCallback(() => { + return { + statusCode: 200, + }; + }), + await mockServer + .forPost('https://api.segment.io/v1/batch') + .withJsonBodyIncluding({ + batch: [{ type: 'track', event: 'Signature Rejected' }], + }) + .thenCallback(() => { + return { + statusCode: 200, + }; + }), + await mockServer + .forPost('https://api.segment.io/v1/batch') + .withJsonBodyIncluding({ + batch: [{ type: 'track', event: 'Account Details Opened' }], + }) + .thenCallback(() => { + return { + statusCode: 200, + }; + }), + ]; +} diff --git a/test/e2e/tests/confirmations/signatures/permit.spec.ts b/test/e2e/tests/confirmations/signatures/permit.spec.ts index 03941dbecc3f..18b2e473120e 100644 --- a/test/e2e/tests/confirmations/signatures/permit.spec.ts +++ b/test/e2e/tests/confirmations/signatures/permit.spec.ts @@ -13,21 +13,32 @@ import { } from '../../../helpers'; import { Ganache } from '../../../seeder/ganache'; import { Driver } from '../../../webdriver/driver'; +import { Mockttp } from '../../../mock-e2e'; +import { + assertAccountDetailsMetrics, + assertHeaderInfoBalance, + assertPastedAddress, + assertSignatureMetrics, + clickHeaderInfoBtn, + copyAddressAndPasteWalletAddress, +} from './signature-helpers'; describe('Confirmation Signature - Permit', function (this: Suite) { if (!process.env.ENABLE_CONFIRMATION_REDESIGN) { return; } - it('initiates and confirms', async function () { + it('initiates and confirms and emits the correct events', async function () { await withRedesignConfirmationFixtures( this.test?.fullTitle(), async ({ driver, ganacheServer, + mockedEndpoint: mockedEndpoints, }: { driver: Driver; ganacheServer: Ganache; + mockedEndpoint: Mockttp; }) => { const addresses = await ganacheServer.getAccounts(); const publicAddress = addresses?.[0] as string; @@ -37,17 +48,45 @@ describe('Confirmation Signature - Permit', function (this: Suite) { await driver.clickElement('#signPermit'); await switchToNotificationWindow(driver); + await clickHeaderInfoBtn(driver); + await assertHeaderInfoBalance(driver); + await assertAccountDetailsMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData_v4', + ); + + await copyAddressAndPasteWalletAddress(driver); + await assertPastedAddress(driver); + await switchToNotificationWindow(driver); + await assertInfoValues(driver); await scrollAndConfirmAndAssertConfirm(driver); + await driver.delay(1000); + + await assertSignatureMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData_v4', + 'Permit', + ['redesigned_confirmation', 'permit'], + ); + await assertVerifiedResults(driver, publicAddress); }, ); }); - it('initiates and rejects', async function () { + it('initiates and rejects and emits the correct events', async function () { await withRedesignConfirmationFixtures( this.test?.fullTitle(), - async ({ driver }: { driver: Driver }) => { + async ({ + driver, + mockedEndpoint: mockedEndpoints, + }: { + driver: Driver; + mockedEndpoint: Mockttp; + }) => { await unlockWallet(driver); await openDapp(driver); await driver.clickElement('#signPermit'); @@ -56,15 +95,24 @@ describe('Confirmation Signature - Permit', function (this: Suite) { await driver.clickElement( '[data-testid="confirm-footer-cancel-button"]', ); + await driver.delay(1000); await driver.waitUntilXWindowHandles(2); await driver.switchToWindowWithTitle(WINDOW_TITLES.TestDApp); - const rejectionResult = await driver.waitForSelector({ - css: '#signPermitResult', - text: 'Error: User rejected the request.', - }); - assert.ok(rejectionResult); + const rejectionResult = await driver.findElement('#signPermitResult'); + assert.equal( + await rejectionResult.getText(), + 'Error: User rejected the request.', + ); + + await assertSignatureMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData_v4', + 'Permit', + ['redesigned_confirmation', 'permit'], + ); }, ); }); diff --git a/test/e2e/tests/confirmations/signatures/personal-sign.spec.ts b/test/e2e/tests/confirmations/signatures/personal-sign.spec.ts index 175f7459d467..6f1368026e9a 100644 --- a/test/e2e/tests/confirmations/signatures/personal-sign.spec.ts +++ b/test/e2e/tests/confirmations/signatures/personal-sign.spec.ts @@ -10,6 +10,15 @@ import { } from '../../../helpers'; import { Ganache } from '../../../seeder/ganache'; import { Driver } from '../../../webdriver/driver'; +import { Mockttp } from '../../../mock-e2e'; +import { + assertHeaderInfoBalance, + assertPastedAddress, + clickHeaderInfoBtn, + copyAddressAndPasteWalletAddress, + assertSignatureMetrics, + assertAccountDetailsMetrics, +} from './signature-helpers'; describe('Confirmation Signature - Personal Sign', function (this: Suite) { if (!process.env.ENABLE_CONFIRMATION_REDESIGN) { @@ -22,9 +31,11 @@ describe('Confirmation Signature - Personal Sign', function (this: Suite) { async ({ driver, ganacheServer, + mockedEndpoint: mockedEndpoints, }: { driver: Driver; ganacheServer: Ganache; + mockedEndpoint: Mockttp; }) => { const addresses = await ganacheServer.getAccounts(); const publicAddress = addresses?.[0] as string; @@ -34,11 +45,23 @@ describe('Confirmation Signature - Personal Sign', function (this: Suite) { await driver.clickElement('#personalSign'); await switchToNotificationWindow(driver); + await clickHeaderInfoBtn(driver); + await assertHeaderInfoBalance(driver); + + await copyAddressAndPasteWalletAddress(driver); + await assertPastedAddress(driver); + await assertAccountDetailsMetrics( + driver, + mockedEndpoints, + 'personal_sign', + ); + await switchToNotificationWindow(driver); await assertInfoValues(driver); await driver.clickElement('[data-testid="confirm-footer-button"]'); await assertVerifiedPersonalMessage(driver, publicAddress); + await assertSignatureMetrics(driver, mockedEndpoints, 'personal_sign'); }, ); }); @@ -46,7 +69,13 @@ describe('Confirmation Signature - Personal Sign', function (this: Suite) { it('initiates and rejects', async function () { await withRedesignConfirmationFixtures( this.test?.fullTitle(), - async ({ driver }: { driver: Driver }) => { + async ({ + driver, + mockedEndpoint: mockedEndpoints, + }: { + driver: Driver; + mockedEndpoint: Mockttp; + }) => { await unlockWallet(driver); await openDapp(driver); await driver.clickElement('#personalSign'); @@ -64,6 +93,7 @@ describe('Confirmation Signature - Personal Sign', function (this: Suite) { text: 'Error: User rejected the request.', }); assert.ok(rejectionResult); + await assertSignatureMetrics(driver, mockedEndpoints, 'personal_sign'); }, ); }); diff --git a/test/e2e/tests/confirmations/signatures/sign-typed-data-v3.spec.ts b/test/e2e/tests/confirmations/signatures/sign-typed-data-v3.spec.ts index 4dfdb9851b2a..11243b08b0d7 100644 --- a/test/e2e/tests/confirmations/signatures/sign-typed-data-v3.spec.ts +++ b/test/e2e/tests/confirmations/signatures/sign-typed-data-v3.spec.ts @@ -13,6 +13,15 @@ import { } from '../../../helpers'; import { Ganache } from '../../../seeder/ganache'; import { Driver } from '../../../webdriver/driver'; +import { Mockttp } from '../../../mock-e2e'; +import { + assertHeaderInfoBalance, + assertPastedAddress, + clickHeaderInfoBtn, + copyAddressAndPasteWalletAddress, + assertSignatureMetrics, + assertAccountDetailsMetrics, +} from './signature-helpers'; describe('Confirmation Signature - Sign Typed Data V3', function (this: Suite) { if (!process.env.ENABLE_CONFIRMATION_REDESIGN) { @@ -25,9 +34,11 @@ describe('Confirmation Signature - Sign Typed Data V3', function (this: Suite) { async ({ driver, ganacheServer, + mockedEndpoint: mockedEndpoints, }: { driver: Driver; ganacheServer: Ganache; + mockedEndpoint: Mockttp; }) => { const addresses = await ganacheServer.getAccounts(); const publicAddress = addresses?.[0] as string; @@ -37,8 +48,26 @@ describe('Confirmation Signature - Sign Typed Data V3', function (this: Suite) { await driver.clickElement('#signTypedDataV3'); await switchToNotificationWindow(driver); + await clickHeaderInfoBtn(driver); + await assertHeaderInfoBalance(driver); + + await copyAddressAndPasteWalletAddress(driver); + await assertPastedAddress(driver); + await assertAccountDetailsMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData_v3', + ); + await switchToNotificationWindow(driver); + await assertInfoValues(driver); await scrollAndConfirmAndAssertConfirm(driver); + await driver.delay(1000); + await assertSignatureMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData_v3', + ); await assertVerifiedResults(driver, publicAddress); }, ); @@ -47,7 +76,13 @@ describe('Confirmation Signature - Sign Typed Data V3', function (this: Suite) { it('initiates and rejects', async function () { await withRedesignConfirmationFixtures( this.test?.fullTitle(), - async ({ driver }: { driver: Driver }) => { + async ({ + driver, + mockedEndpoint: mockedEndpoints, + }: { + driver: Driver; + mockedEndpoint: Mockttp; + }) => { await unlockWallet(driver); await openDapp(driver); await driver.clickElement('#signTypedDataV3'); @@ -56,21 +91,31 @@ describe('Confirmation Signature - Sign Typed Data V3', function (this: Suite) { await driver.clickElement( '[data-testid="confirm-footer-cancel-button"]', ); + await driver.delay(1000); + + await assertSignatureMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData_v3', + ); await driver.waitUntilXWindowHandles(2); await driver.switchToWindowWithTitle(WINDOW_TITLES.TestDApp); - const rejectionResult = await driver.waitForSelector({ - css: '#signTypedDataV3Result', - text: 'Error: User rejected the request.', - }); - assert.ok(rejectionResult); + const rejectionResult = await driver.findElement( + '#signTypedDataV3Result', + ); + assert.equal( + await rejectionResult.getText(), + 'Error: User rejected the request.', + ); }, ); }); }); async function assertInfoValues(driver: Driver) { + await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog); const origin = driver.findElement({ text: DAPP_HOST_ADDRESS }); const contractPetName = driver.findElement({ css: '.name__value', @@ -102,14 +147,12 @@ async function assertInfoValues(driver: Driver) { async function assertVerifiedResults(driver: Driver, publicAddress: string) { await driver.waitUntilXWindowHandles(2); - await driver.switchToWindowWithTitle(WINDOW_TITLES.TestDApp); + const windowHandles = await driver.getAllWindowHandles(); + await driver.switchToWindowWithTitle('E2E Test Dapp', windowHandles); await driver.clickElement('#signTypedDataV3Verify'); + await driver.delay(500); const verifyResult = await driver.findElement('#signTypedDataV3Result'); - await driver.waitForSelector({ - css: '#signTypedDataV3VerifyResult', - text: publicAddress, - }); const verifyRecoverAddress = await driver.findElement( '#signTypedDataV3VerifyResult', ); diff --git a/test/e2e/tests/confirmations/signatures/sign-typed-data-v4.spec.ts b/test/e2e/tests/confirmations/signatures/sign-typed-data-v4.spec.ts index 5c5101d5e018..605998c421df 100644 --- a/test/e2e/tests/confirmations/signatures/sign-typed-data-v4.spec.ts +++ b/test/e2e/tests/confirmations/signatures/sign-typed-data-v4.spec.ts @@ -13,6 +13,15 @@ import { } from '../../../helpers'; import { Ganache } from '../../../seeder/ganache'; import { Driver } from '../../../webdriver/driver'; +import { Mockttp } from '../../../mock-e2e'; +import { + assertHeaderInfoBalance, + assertPastedAddress, + clickHeaderInfoBtn, + copyAddressAndPasteWalletAddress, + assertSignatureMetrics, + assertAccountDetailsMetrics, +} from './signature-helpers'; describe('Confirmation Signature - Sign Typed Data V4', function (this: Suite) { if (!process.env.ENABLE_CONFIRMATION_REDESIGN) { @@ -25,9 +34,11 @@ describe('Confirmation Signature - Sign Typed Data V4', function (this: Suite) { async ({ driver, ganacheServer, + mockedEndpoint: mockedEndpoints, }: { driver: Driver; ganacheServer: Ganache; + mockedEndpoint: Mockttp; }) => { const addresses = await ganacheServer.getAccounts(); const publicAddress = addresses?.[0] as string; @@ -37,8 +48,27 @@ describe('Confirmation Signature - Sign Typed Data V4', function (this: Suite) { await driver.clickElement('#signTypedDataV4'); await switchToNotificationWindow(driver); + await clickHeaderInfoBtn(driver); + await assertHeaderInfoBalance(driver); + + await copyAddressAndPasteWalletAddress(driver); + await assertPastedAddress(driver); + await assertAccountDetailsMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData_v4', + ); + await assertInfoValues(driver); await scrollAndConfirmAndAssertConfirm(driver); + await driver.delay(1000); + + await assertSignatureMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData_v4', + 'Mail', + ); await assertVerifiedResults(driver, publicAddress); }, ); @@ -47,7 +77,13 @@ describe('Confirmation Signature - Sign Typed Data V4', function (this: Suite) { it('initiates and rejects', async function () { await withRedesignConfirmationFixtures( this.test?.fullTitle(), - async ({ driver }: { driver: Driver }) => { + async ({ + driver, + mockedEndpoint: mockedEndpoints, + }: { + driver: Driver; + mockedEndpoint: Mockttp; + }) => { await unlockWallet(driver); await openDapp(driver); await driver.clickElement('#signTypedDataV4'); @@ -56,6 +92,14 @@ describe('Confirmation Signature - Sign Typed Data V4', function (this: Suite) { await driver.clickElement( '[data-testid="confirm-footer-cancel-button"]', ); + await driver.delay(1000); + + await assertSignatureMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData_v4', + 'Mail', + ); await driver.waitUntilXWindowHandles(2); await driver.switchToWindowWithTitle(WINDOW_TITLES.TestDApp); @@ -71,6 +115,7 @@ describe('Confirmation Signature - Sign Typed Data V4', function (this: Suite) { }); async function assertInfoValues(driver: Driver) { + await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog); const origin = driver.findElement({ text: DAPP_HOST_ADDRESS }); const contractPetName = driver.findElement({ css: '.name__value', diff --git a/test/e2e/tests/confirmations/signatures/sign-typed-data.spec.ts b/test/e2e/tests/confirmations/signatures/sign-typed-data.spec.ts index 01f807397a97..db4f051d2c98 100644 --- a/test/e2e/tests/confirmations/signatures/sign-typed-data.spec.ts +++ b/test/e2e/tests/confirmations/signatures/sign-typed-data.spec.ts @@ -10,6 +10,15 @@ import { } from '../../../helpers'; import { Ganache } from '../../../seeder/ganache'; import { Driver } from '../../../webdriver/driver'; +import { Mockttp } from '../../../mock-e2e'; +import { + assertAccountDetailsMetrics, + assertHeaderInfoBalance, + assertPastedAddress, + assertSignatureMetrics, + clickHeaderInfoBtn, + copyAddressAndPasteWalletAddress, +} from './signature-helpers'; describe('Confirmation Signature - Sign Typed Data', function (this: Suite) { if (!process.env.ENABLE_CONFIRMATION_REDESIGN) { @@ -22,9 +31,11 @@ describe('Confirmation Signature - Sign Typed Data', function (this: Suite) { async ({ driver, ganacheServer, + mockedEndpoint: mockedEndpoints, }: { driver: Driver; ganacheServer: Ganache; + mockedEndpoint: Mockttp; }) => { const addresses = await ganacheServer.getAccounts(); const publicAddress = addresses?.[0] as string; @@ -34,9 +45,27 @@ describe('Confirmation Signature - Sign Typed Data', function (this: Suite) { await driver.clickElement('#signTypedData'); await switchToNotificationWindow(driver); + await clickHeaderInfoBtn(driver); + await assertHeaderInfoBalance(driver); + + await copyAddressAndPasteWalletAddress(driver); + await assertPastedAddress(driver); + await assertAccountDetailsMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData', + ); + await assertInfoValues(driver); await driver.clickElement('[data-testid="confirm-footer-button"]'); + await driver.delay(1000); + + await assertSignatureMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData', + ); await assertVerifiedResults(driver, publicAddress); }, @@ -46,7 +75,13 @@ describe('Confirmation Signature - Sign Typed Data', function (this: Suite) { it('initiates and rejects', async function () { await withRedesignConfirmationFixtures( this.test?.fullTitle(), - async ({ driver }: { driver: Driver }) => { + async ({ + driver, + mockedEndpoint: mockedEndpoints, + }: { + driver: Driver; + mockedEndpoint: Mockttp; + }) => { await unlockWallet(driver); await openDapp(driver); await driver.clickElement('#signTypedData'); @@ -55,6 +90,13 @@ describe('Confirmation Signature - Sign Typed Data', function (this: Suite) { await driver.clickElement( '[data-testid="confirm-footer-cancel-button"]', ); + await driver.delay(1000); + + await assertSignatureMetrics( + driver, + mockedEndpoints, + 'eth_signTypedData', + ); await driver.waitUntilXWindowHandles(2); await driver.switchToWindowWithTitle(WINDOW_TITLES.TestDApp); @@ -70,6 +112,7 @@ describe('Confirmation Signature - Sign Typed Data', function (this: Suite) { }); async function assertInfoValues(driver: Driver) { + await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog); const origin = driver.findElement({ text: DAPP_HOST_ADDRESS }); const message = driver.findElement({ text: 'Hi, Alice!' }); diff --git a/test/e2e/tests/confirmations/signatures/signature-helpers.ts b/test/e2e/tests/confirmations/signatures/signature-helpers.ts new file mode 100644 index 000000000000..937dbe3e021d --- /dev/null +++ b/test/e2e/tests/confirmations/signatures/signature-helpers.ts @@ -0,0 +1,101 @@ +import { strict as assert } from 'assert'; +import { WINDOW_TITLES, getEventPayloads } from '../../../helpers'; +import { Driver } from '../../../webdriver/driver'; +import { Mockttp } from '../../../mock-e2e'; + +export const WALLET_ADDRESS = '0x5CfE73b6021E818B776b421B1c4Db2474086a7e1'; +export const WALLET_ETH_BALANCE = '25'; + +export async function assertSignatureMetrics( + driver: Driver, + mockedEndpoints: Mockttp, + type: string, + primaryType: string = '', + uiCustomizations = ['redesigned_confirmation'], +) { + const events = await getEventPayloads(driver, mockedEndpoints); + + // eslint-disable-next-line @typescript-eslint/no-explicit-any + const signatureEventProperty: any = { + account_type: 'MetaMask', + signature_type: type, + category: 'inpage_provider', + chain_id: '0x539', + environment_type: 'background', + locale: 'en', + security_alert_response: 'NotApplicable', + ui_customizations: uiCustomizations, + }; + + if (primaryType !== '') { + signatureEventProperty.eip712_primary_type = primaryType; + } + + assert.deepStrictEqual( + events[0].properties, + { + ...signatureEventProperty, + security_alert_reason: 'NotApplicable', + }, + 'Signature request event details do not match', + ); + assert.deepStrictEqual( + events[1].properties, + signatureEventProperty, + 'Signature Accepted/Rejected event properties do not match', + ); +} + +export async function assertAccountDetailsMetrics( + driver: Driver, + mockedEndpoints: Mockttp, + type: string, +) { + const events = await getEventPayloads(driver, mockedEndpoints); + + assert.equal(events[1].event, 'Account Details Opened'); + assert.deepStrictEqual( + events[1].properties, + { + action: 'Confirm Screen', + location: 'signature_confirmation', + signature_type: type, + category: 'Confirmations', + locale: 'en', + chain_id: '0x539', + environment_type: 'notification', + }, + 'Account Details Metrics do not match', + ); +} + +export async function clickHeaderInfoBtn(driver: Driver) { + await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog); + await driver.clickElement( + 'button[data-testid="header-info__account-details-button"]', + ); +} + +export async function assertHeaderInfoBalance(driver: Driver) { + const headerBalanceEl = await driver.findElement( + '[data-testid="confirmation-account-details-modal__account-balance"]', + ); + await driver.waitForNonEmptyElement(headerBalanceEl); + assert.equal(await headerBalanceEl.getText(), `${WALLET_ETH_BALANCE}\nETH`); +} + +export async function copyAddressAndPasteWalletAddress(driver: Driver) { + await driver.clickElement('[data-testid="address-copy-button-text"]'); + await driver.delay(500); // Added delay to avoid error Element is not clickable at point (x,y) because another element obscures it, happens as soon as the mouse hovers over the close button + await driver.clickElement( + '[data-testid="confirmation-account-details-modal__close-button"]', + ); + await driver.switchToWindowWithTitle(WINDOW_TITLES.TestDApp); + await driver.findElement('#eip747ContractAddress'); + await driver.pasteFromClipboardIntoField('#eip747ContractAddress'); +} + +export async function assertPastedAddress(driver: Driver) { + const formFieldEl = await driver.findElement('#eip747ContractAddress'); + assert.equal(await formFieldEl.getAttribute('value'), WALLET_ADDRESS); +}