diff --git a/test/e2e/page-objects/pages/header-navbar.ts b/test/e2e/page-objects/pages/header-navbar.ts index 100c23b851e4..5c0808eea93a 100644 --- a/test/e2e/page-objects/pages/header-navbar.ts +++ b/test/e2e/page-objects/pages/header-navbar.ts @@ -5,6 +5,9 @@ class HeaderNavbar { private readonly accountMenuButton = '[data-testid="account-menu-icon"]'; + private readonly allPermissionsButton = + '[data-testid="global-menu-connected-sites"]'; + private readonly threeDotMenuButton = '[data-testid="account-options-menu-button"]'; @@ -54,6 +57,12 @@ class HeaderNavbar { } } + async openPermissionsPage(): Promise { + console.log('Open permissions page in header navbar'); + await this.openThreeDotMenu(); + await this.driver.clickElement(this.allPermissionsButton); + } + async openSnapListPage(): Promise { console.log('Open account snap page'); await this.openThreeDotMenu(); diff --git a/test/e2e/page-objects/pages/permission/permission-list-page.ts b/test/e2e/page-objects/pages/permission/permission-list-page.ts new file mode 100644 index 000000000000..10f214fd8da6 --- /dev/null +++ b/test/e2e/page-objects/pages/permission/permission-list-page.ts @@ -0,0 +1,50 @@ +import { Driver } from '../../../webdriver/driver'; + +/** + * Represents the permissions list page. + * This page allows users to view permissions for connected sites. + */ +class PermissionListPage { + private driver: Driver; + + private readonly permissionsPage = '[data-testid="permissions-page"]'; + + constructor(driver: Driver) { + this.driver = driver; + } + + async check_pageIsLoaded(): Promise { + try { + await this.driver.waitForSelector(this.permissionsPage); + } catch (e) { + console.log( + 'Timeout while waiting for permission list page to be loaded', + e, + ); + throw e; + } + console.log('Permission list page is loaded'); + } + + /** + * Open permission page for site + * + * @param site - Site to open + */ + async openPermissionPageForSite(site: string): Promise { + console.log('Open permission page for site', site); + await this.driver.clickElement({ text: site, tag: 'p' }); + } + + /** + * Check if account is connected to site + * + * @param site - Site to check + */ + async check_connectedToSite(site: string): Promise { + console.log('Check if account is connected to site', site); + await this.driver.waitForSelector({ text: site, tag: 'p' }); + } +} + +export default PermissionListPage; diff --git a/test/e2e/page-objects/pages/permission/site-permission-page.ts b/test/e2e/page-objects/pages/permission/site-permission-page.ts new file mode 100644 index 000000000000..bc5eee61c781 --- /dev/null +++ b/test/e2e/page-objects/pages/permission/site-permission-page.ts @@ -0,0 +1,36 @@ +import { Driver } from '../../../webdriver/driver'; + +/** + * Represents the site permission page. + * This page allows users to view and manage permissions for a connected site. + */ +class SitePermissionPage { + private driver: Driver; + + private readonly permissionPage = '[data-testid ="connections-page"]'; + + constructor(driver: Driver) { + this.driver = driver; + } + + /** + * Check if site permission page is loaded + * + * @param site - Site to check + */ + async check_pageIsLoaded(site: string): Promise { + try { + await this.driver.waitForSelector(this.permissionPage); + await this.driver.waitForSelector({ text: site, tag: 'span' }); + } catch (e) { + console.log( + 'Timeout while waiting for site permission page to be loaded', + e, + ); + throw e; + } + console.log('Site permission page is loaded'); + } +} + +export default SitePermissionPage; diff --git a/test/e2e/page-objects/pages/settings/experimental-settings.ts b/test/e2e/page-objects/pages/settings/experimental-settings.ts index 3af5c8a538e4..c3f81d99bf23 100644 --- a/test/e2e/page-objects/pages/settings/experimental-settings.ts +++ b/test/e2e/page-objects/pages/settings/experimental-settings.ts @@ -15,6 +15,9 @@ class ExperimentalSettings { private readonly redesignedSignatureToggle = '[data-testid="toggle-redesigned-confirmations-container"]'; + private readonly requestQueueToggle = + '[data-testid="experimental-setting-toggle-request-queue"] label'; + constructor(driver: Driver) { this.driver = driver; } @@ -41,6 +44,11 @@ class ExperimentalSettings { console.log('Toggle Redesigned Signature on experimental setting page'); await this.driver.clickElement(this.redesignedSignatureToggle); } + + async toggleRequestQueue(): Promise { + console.log('Toggle Request Queue on experimental setting page'); + await this.driver.clickElement(this.requestQueueToggle); + } } export default ExperimentalSettings; diff --git a/test/e2e/tests/account/import-flow.spec.ts b/test/e2e/tests/account/import-flow.spec.ts index 2a8bd0256999..dbb7b2f85d49 100644 --- a/test/e2e/tests/account/import-flow.spec.ts +++ b/test/e2e/tests/account/import-flow.spec.ts @@ -1,4 +1,5 @@ import path from 'path'; +import { DEFAULT_FIXTURE_ACCOUNT } from '../../constants'; import { withFixtures } from '../../helpers'; import FixtureBuilder from '../../fixture-builder'; import AccountListPage from '../../page-objects/pages/account-list-page'; @@ -9,7 +10,6 @@ import { completeImportSRPOnboardingFlow } from '../../page-objects/flows/onboar describe('Import flow @no-mmi', function () { it('Import wallet using Secret Recovery Phrase with pasting word by word', async function () { - const testAddress = '0x5CfE73b6021E818B776b421B1c4Db2474086a7e1'; await withFixtures( { fixtures: new FixtureBuilder({ onboarding: true }).build(), @@ -33,7 +33,7 @@ describe('Import flow @no-mmi', function () { await accountListPage.check_pageIsLoaded(); await accountListPage.openAccountDetailsModal('Account 1'); await accountListPage.check_addressInAccountDetailsModal( - testAddress.toLowerCase(), + DEFAULT_FIXTURE_ACCOUNT.toLowerCase(), ); }, ); diff --git a/test/e2e/tests/multichain/all-permissions-page.spec.js b/test/e2e/tests/multichain/all-permissions-page.spec.js deleted file mode 100644 index 47601c58bb2f..000000000000 --- a/test/e2e/tests/multichain/all-permissions-page.spec.js +++ /dev/null @@ -1,90 +0,0 @@ -const { strict: assert } = require('assert'); -const { - withFixtures, - WINDOW_TITLES, - connectToDapp, - logInWithBalanceValidation, - defaultGanacheOptions, -} = require('../../helpers'); -const FixtureBuilder = require('../../fixture-builder'); - -describe('Permissions Page', function () { - it('should show connected site permissions when a single dapp is connected', async function () { - await withFixtures( - { - dapp: true, - fixtures: new FixtureBuilder().build(), - title: this.test.fullTitle(), - ganacheOptions: defaultGanacheOptions, - }, - async ({ driver, ganacheServer }) => { - await logInWithBalanceValidation(driver, ganacheServer); - await connectToDapp(driver); - - // close test dapp window to avoid future confusion - const windowHandles = await driver.getAllWindowHandles(); - await driver.closeWindowHandle(windowHandles[1]); - // disconnect dapp in fullscreen view - await driver.switchToWindowWithTitle( - WINDOW_TITLES.ExtensionInFullScreenView, - ); - await driver.clickElement( - '[data-testid ="account-options-menu-button"]', - ); - await driver.clickElement({ text: 'All Permissions', tag: 'div' }); - const connectedDapp = await driver.isElementPresent({ - text: '127.0.0.1:8080', - tag: 'p', - }); - assert.ok(connectedDapp, 'Account connected to Dapp1'); - }, - ); - }); - - it('should show all permissions listed when experimental settings toggle is off', async function () { - await withFixtures( - { - dapp: true, - fixtures: new FixtureBuilder().build(), - title: this.test.fullTitle(), - ganacheOptions: defaultGanacheOptions, - }, - async ({ driver, ganacheServer }) => { - await logInWithBalanceValidation(driver, ganacheServer); - await connectToDapp(driver); - - // close test dapp window to avoid future confusion - const windowHandles = await driver.getAllWindowHandles(); - await driver.closeWindowHandle(windowHandles[1]); - // disconnect dapp in fullscreen view - await driver.switchToWindowWithTitle( - WINDOW_TITLES.ExtensionInFullScreenView, - ); - await driver.clickElement( - '[data-testid="account-options-menu-button"]', - ); - await driver.clickElement({ text: 'Settings', tag: 'div' }); - await driver.clickElement({ - text: 'Experimental', - tag: 'div', - }); - - await driver.clickElement( - '[data-testid="experimental-setting-toggle-request-queue"] label', - ); - await driver.clickElement( - '.settings-page__header__title-container__close-button', - ); - await driver.clickElement( - '[data-testid ="account-options-menu-button"]', - ); - await driver.clickElement({ text: 'All Permissions', tag: 'div' }); - const connectedDapp = await driver.isElementPresent({ - text: '127.0.0.1:8080', - tag: 'p', - }); - assert.ok(connectedDapp, 'Account connected to Dapp1'); - }, - ); - }); -}); diff --git a/test/e2e/tests/multichain/all-permissions-page.spec.ts b/test/e2e/tests/multichain/all-permissions-page.spec.ts new file mode 100644 index 000000000000..756bae735f15 --- /dev/null +++ b/test/e2e/tests/multichain/all-permissions-page.spec.ts @@ -0,0 +1,75 @@ +import { DEFAULT_FIXTURE_ACCOUNT, DAPP_HOST_ADDRESS } from '../../constants'; +import { withFixtures, WINDOW_TITLES } from '../../helpers'; +import FixtureBuilder from '../../fixture-builder'; +import ExperimentalSettings from '../../page-objects/pages/settings/experimental-settings'; +import HeaderNavbar from '../../page-objects/pages/header-navbar'; +import Homepage from '../../page-objects/pages/home/homepage'; +import PermissionListPage from '../../page-objects/pages/permission/permission-list-page'; +import SettingsPage from '../../page-objects/pages/settings/settings-page'; +import TestDapp from '../../page-objects/pages/test-dapp'; +import { loginWithoutBalanceValidation } from '../../page-objects/flows/login.flow'; + +describe('Permissions Page', function () { + it('should show connected site permissions when a single dapp is connected', async function () { + await withFixtures( + { + dapp: true, + fixtures: new FixtureBuilder().build(), + title: this.test?.fullTitle(), + }, + async ({ driver }) => { + await loginWithoutBalanceValidation(driver); + const testDapp = new TestDapp(driver); + await testDapp.openTestDappPage(); + await testDapp.connectAccount(DEFAULT_FIXTURE_ACCOUNT); + + // switch to extension window and check the site permissions + await driver.switchToWindowWithTitle( + WINDOW_TITLES.ExtensionInFullScreenView, + ); + const homepage = new Homepage(driver); + await homepage.check_pageIsLoaded(); + await homepage.check_expectedBalanceIsDisplayed(); + await homepage.headerNavbar.openPermissionsPage(); + + const permissionListPage = new PermissionListPage(driver); + await permissionListPage.check_pageIsLoaded(); + await permissionListPage.check_connectedToSite(DAPP_HOST_ADDRESS); + }, + ); + }); + + it('should show all permissions listed when experimental settings toggle is off', async function () { + await withFixtures( + { + dapp: true, + fixtures: new FixtureBuilder() + .withPermissionControllerConnectedToTestDapp() + .build(), + title: this.test?.fullTitle(), + }, + async ({ driver }) => { + await loginWithoutBalanceValidation(driver); + const headerNavbar = new HeaderNavbar(driver); + await headerNavbar.openSettingsPage(); + + // go to experimental settings page and toggle request queue + const settingsPage = new SettingsPage(driver); + await settingsPage.check_pageIsLoaded(); + await settingsPage.goToExperimentalSettings(); + + const experimentalSettings = new ExperimentalSettings(driver); + await experimentalSettings.check_pageIsLoaded(); + await experimentalSettings.toggleRequestQueue(); + await settingsPage.closeSettingsPage(); + + // go to homepage and check site permissions + await new Homepage(driver).check_pageIsLoaded(); + await headerNavbar.openPermissionsPage(); + const permissionListPage = new PermissionListPage(driver); + await permissionListPage.check_pageIsLoaded(); + await permissionListPage.check_connectedToSite(DAPP_HOST_ADDRESS); + }, + ); + }); +}); diff --git a/test/e2e/tests/multichain/permission-page.spec.js b/test/e2e/tests/multichain/permission-page.spec.js deleted file mode 100644 index e2b7208045e0..000000000000 --- a/test/e2e/tests/multichain/permission-page.spec.js +++ /dev/null @@ -1,80 +0,0 @@ -const { strict: assert } = require('assert'); -const { - withFixtures, - WINDOW_TITLES, - connectToDapp, - logInWithBalanceValidation, - defaultGanacheOptions, -} = require('../../helpers'); -const FixtureBuilder = require('../../fixture-builder'); - -describe('Permissions Page', function () { - it('should show connected site permissions when a single dapp is connected', async function () { - await withFixtures( - { - dapp: true, - fixtures: new FixtureBuilder().build(), - title: this.test.fullTitle(), - ganacheOptions: defaultGanacheOptions, - }, - async ({ driver, ganacheServer }) => { - await logInWithBalanceValidation(driver, ganacheServer); - await connectToDapp(driver); - - // close test dapp window to avoid future confusion - const windowHandles = await driver.getAllWindowHandles(); - await driver.closeWindowHandle(windowHandles[1]); - // disconnect dapp in fullscreen view - await driver.switchToWindowWithTitle( - WINDOW_TITLES.ExtensionInFullScreenView, - ); - await driver.clickElement( - '[data-testid ="account-options-menu-button"]', - ); - await driver.clickElement({ text: 'All Permissions', tag: 'div' }); - const connectedDapp = await driver.isElementPresent({ - text: '127.0.0.1:8080', - tag: 'p', - }); - assert.ok(connectedDapp, 'Account connected to Dapp1'); - }, - ); - }); - - it('should redirect users to connections page when users click on connected permission', async function () { - await withFixtures( - { - dapp: true, - fixtures: new FixtureBuilder().build(), - title: this.test.fullTitle(), - ganacheOptions: defaultGanacheOptions, - }, - async ({ driver, ganacheServer }) => { - await logInWithBalanceValidation(driver, ganacheServer); - await connectToDapp(driver); - - // close test dapp window to avoid future confusion - const windowHandles = await driver.getAllWindowHandles(); - await driver.closeWindowHandle(windowHandles[1]); - // disconnect dapp in fullscreen view - await driver.switchToWindowWithTitle( - WINDOW_TITLES.ExtensionInFullScreenView, - ); - await driver.clickElement( - '[data-testid ="account-options-menu-button"]', - ); - await driver.clickElement({ text: 'All Permissions', tag: 'div' }); - await driver.clickElement({ - text: '127.0.0.1:8080', - tag: 'p', - }); - await driver.clickElement('[data-testid ="connections-page"]'); - const connectionsPage = await driver.isElementPresent({ - text: '127.0.0.1:8080', - tag: 'span', - }); - assert.ok(connectionsPage, 'Connections Page is defined'); - }, - ); - }); -}); diff --git a/test/e2e/tests/multichain/permission-page.spec.ts b/test/e2e/tests/multichain/permission-page.spec.ts new file mode 100644 index 000000000000..a85e4f9ba1a4 --- /dev/null +++ b/test/e2e/tests/multichain/permission-page.spec.ts @@ -0,0 +1,33 @@ +import { DAPP_HOST_ADDRESS } from '../../constants'; +import { withFixtures } from '../../helpers'; +import FixtureBuilder from '../../fixture-builder'; +import HeaderNavbar from '../../page-objects/pages/header-navbar'; +import PermissionListPage from '../../page-objects/pages/permission/permission-list-page'; +import SitePermissionPage from '../../page-objects/pages/permission/site-permission-page'; +import { loginWithoutBalanceValidation } from '../../page-objects/flows/login.flow'; + +describe('Permissions Page', function () { + it('should redirect users to connections page when users click on connected permission', async function () { + await withFixtures( + { + dapp: true, + fixtures: new FixtureBuilder() + .withPermissionControllerConnectedToTestDapp() + .build(), + title: this.test?.fullTitle(), + }, + async ({ driver }) => { + await loginWithoutBalanceValidation(driver); + const headerNavbar = new HeaderNavbar(driver); + await headerNavbar.openPermissionsPage(); + const permissionListPage = new PermissionListPage(driver); + await permissionListPage.check_pageIsLoaded(); + + await permissionListPage.openPermissionPageForSite(DAPP_HOST_ADDRESS); + await new SitePermissionPage(driver).check_pageIsLoaded( + DAPP_HOST_ADDRESS, + ); + }, + ); + }); +});