From 516747e929d3aa582c4857c882a5e6cf1b099747 Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Thu, 18 Jun 2026 15:04:44 +0200 Subject: [PATCH 1/4] Switch settings to site settings --- apps/studio/e2e/localization.test.ts | 6 ++++-- apps/studio/e2e/page-objects/settings-tab.ts | 2 +- apps/studio/e2e/page-objects/site-content.ts | 8 ++++---- .../src/components/tests/site-content-tabs.test.tsx | 4 ++-- apps/studio/src/hooks/use-content-tabs.tsx | 2 +- 5 files changed, 12 insertions(+), 10 deletions(-) diff --git a/apps/studio/e2e/localization.test.ts b/apps/studio/e2e/localization.test.ts index 03028388ff..7260c37030 100644 --- a/apps/studio/e2e/localization.test.ts +++ b/apps/studio/e2e/localization.test.ts @@ -149,7 +149,9 @@ test.describe( 'Localization', () => { await expect( siteContent.siteNameHeading ).toBeVisible( { timeout: 120_000 } ); await expect( siteContent.runningButton ).toBeAttached( { timeout: 120_000 } ); - const settingsTabButton = session.mainWindow.getByRole( 'tab', { name: /Settings|設定/i } ); + const settingsTabButton = session.mainWindow.getByRole( 'tab', { + name: /Site Settings|サイト設定|設定/i, + } ); await settingsTabButton.click(); const copyWpAdminButton = session.mainWindow.getByTestId( 'copy-wp-admin-url' ); await expect( copyWpAdminButton ).toBeVisible(); @@ -175,7 +177,7 @@ test.describe( 'Localization', () => { } ); const siteContentEnglish = new SiteContent( session.mainWindow, siteName ); - const settingsTab = await siteContentEnglish.navigateToTab( 'Settings' ); + const settingsTab = await siteContentEnglish.navigateToTab( 'Site Settings' ); await settingsTab.openDeleteSiteModal(); // Wait for the confirmation dialog to be auto-confirmed and deletion to complete diff --git a/apps/studio/e2e/page-objects/settings-tab.ts b/apps/studio/e2e/page-objects/settings-tab.ts index a026d1de9d..0915a637c7 100644 --- a/apps/studio/e2e/page-objects/settings-tab.ts +++ b/apps/studio/e2e/page-objects/settings-tab.ts @@ -7,7 +7,7 @@ export default class SettingsTab { ) {} get locator() { - return this.page.getByRole( 'tabpanel', { name: 'Settings' } ); + return this.page.getByRole( 'tabpanel', { name: 'Site Settings' } ); } get copyWPAdminButton() { diff --git a/apps/studio/e2e/page-objects/site-content.ts b/apps/studio/e2e/page-objects/site-content.ts index cc23b6a54a..60f82836c2 100644 --- a/apps/studio/e2e/page-objects/site-content.ts +++ b/apps/studio/e2e/page-objects/site-content.ts @@ -36,14 +36,14 @@ export default class SiteContent { return this.locator.getByLabel( 'Copy site url', { exact: false } ); } - getTabButton( tabName: 'Preview' | 'Settings' | 'Import / Export' ) { + getTabButton( tabName: 'Preview' | 'Site Settings' | 'Import / Export' ) { return this.locator.getByRole( 'tab', { name: tabName } ); } - async navigateToTab( tabName: 'Settings' ): Promise< SettingsTab >; + async navigateToTab( tabName: 'Site Settings' ): Promise< SettingsTab >; async navigateToTab( tabName: 'Import / Export' ): Promise< ImportExportTab >; async navigateToTab( - tabName: 'Preview' | 'Settings' | 'Import / Export' + tabName: 'Preview' | 'Site Settings' | 'Import / Export' ): Promise< SettingsTab | ImportExportTab > { const tabButton = this.getTabButton( tabName ); await tabButton.click(); @@ -51,7 +51,7 @@ export default class SiteContent { switch ( tabName ) { case 'Preview': throw new Error( 'Not implemented' ); - case 'Settings': { + case 'Site Settings': { const tab = new SettingsTab( this.page, this.siteName ); await expect( tab.locator ).toBeVisible(); return tab; diff --git a/apps/studio/src/components/tests/site-content-tabs.test.tsx b/apps/studio/src/components/tests/site-content-tabs.test.tsx index c87b37d906..15687ebf48 100644 --- a/apps/studio/src/components/tests/site-content-tabs.test.tsx +++ b/apps/studio/src/components/tests/site-content-tabs.test.tsx @@ -86,7 +86,7 @@ describe( 'SiteContentTabs', () => { loadingServer: {}, } ); await act( async () => renderWithProvider( ) ); - expect( screen.getByRole( 'tab', { name: 'Settings' } ) ).toBeInTheDocument(); + expect( screen.getByRole( 'tab', { name: 'Site Settings' } ) ).toBeInTheDocument(); expect( screen.getByRole( 'tab', { name: 'Sync' } ) ).toBeInTheDocument(); expect( screen.getByRole( 'tab', { name: 'Previews' } ) ).toBeInTheDocument(); expect( screen.getByRole( 'tab', { name: 'Import / Export' } ) ).toBeInTheDocument(); @@ -104,7 +104,7 @@ describe( 'SiteContentTabs', () => { expect( screen.queryByRole( 'tab', { name: 'Overview', selected: true } ) ).toBeVisible(); expect( screen.queryByRole( 'tab', { name: 'Sync', selected: false } ) ).toBeVisible(); expect( screen.queryByRole( 'tab', { name: 'Previews', selected: false } ) ).toBeVisible(); - expect( screen.queryByRole( 'tab', { name: 'Settings', selected: false } ) ).toBeVisible(); + expect( screen.queryByRole( 'tab', { name: 'Site Settings', selected: false } ) ).toBeVisible(); expect( screen.queryByRole( 'tab', { name: 'Studio Code', selected: false } ) ).toBeVisible(); expect( screen.queryByRole( 'tab', { name: 'Backup', selected: false } ) diff --git a/apps/studio/src/hooks/use-content-tabs.tsx b/apps/studio/src/hooks/use-content-tabs.tsx index 5c7e3283a2..43d1abc89c 100644 --- a/apps/studio/src/hooks/use-content-tabs.tsx +++ b/apps/studio/src/hooks/use-content-tabs.tsx @@ -37,7 +37,7 @@ function useTabs() { { order: 5, name: 'settings', - title: __( 'Settings' ), + title: __( 'Site Settings' ), } ); From 422824818d3739daf44e6cdb84fb746f1b2bedc8 Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Fri, 19 Jun 2026 10:32:04 +0200 Subject: [PATCH 2/4] Fix how tests are called and executed --- apps/studio/e2e/blueprints.test.ts | 12 ++++---- apps/studio/e2e/import-export.test.ts | 2 +- apps/studio/e2e/import.test.ts | 2 +- apps/studio/e2e/localization.test.ts | 6 ++-- apps/studio/e2e/page-objects/settings-tab.ts | 2 +- apps/studio/e2e/page-objects/site-content.ts | 32 ++++++++++---------- apps/studio/e2e/site-navigation.test.ts | 2 +- apps/studio/e2e/sites.test.ts | 12 ++++---- 8 files changed, 34 insertions(+), 36 deletions(-) diff --git a/apps/studio/e2e/blueprints.test.ts b/apps/studio/e2e/blueprints.test.ts index fffc3775c7..3ec0e17ad2 100644 --- a/apps/studio/e2e/blueprints.test.ts +++ b/apps/studio/e2e/blueprints.test.ts @@ -71,7 +71,7 @@ test.describe( 'Blueprints', () => { await expect( siteContent.runningButton ).toBeAttached( { timeout: 120_000 } ); // Navigate to Settings tab to get admin URL - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); const wpAdminUrl = await settingsTab.copyWPAdminUrlToClipboard( session.electronApp ); // Verify theme was installed @@ -106,7 +106,7 @@ test.describe( 'Blueprints', () => { await expect( siteContent.runningButton ).toBeAttached( { timeout: 120_000 } ); // Navigate to Settings tab to get admin URL - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); const wpAdminUrl = await settingsTab.copyWPAdminUrlToClipboard( session.electronApp ); // Verify theme was activated @@ -143,7 +143,7 @@ test.describe( 'Blueprints', () => { await expect( siteContent.runningButton ).toBeAttached( { timeout: 120_000 } ); // Navigate to Settings tab to get admin URL - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); const wpAdminUrl = await settingsTab.copyWPAdminUrlToClipboard( session.electronApp ); // Verify plugin was installed @@ -178,7 +178,7 @@ test.describe( 'Blueprints', () => { await expect( siteContent.runningButton ).toBeAttached( { timeout: 120_000 } ); // Navigate to Settings tab to get admin URL - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); const wpAdminUrl = await settingsTab.copyWPAdminUrlToClipboard( session.electronApp ); // Verify plugin was activated @@ -216,7 +216,7 @@ test.describe( 'Blueprints', () => { await expect( siteContent.runningButton ).toBeAttached( { timeout: 120_000 } ); // Navigate to Settings tab to verify site is accessible - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); const wpAdminUrl = await settingsTab.copyWPAdminUrlToClipboard( session.electronApp ); // Verify the site was created successfully and admin is accessible @@ -254,7 +254,7 @@ test.describe( 'Blueprints', () => { await expect( siteContent.runningButton ).toBeAttached( { timeout: 120_000 } ); // Navigate to Settings tab to verify site is accessible - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); const wpAdminUrl = await settingsTab.copyWPAdminUrlToClipboard( session.electronApp ); // Verify the site was created successfully and admin is accessible diff --git a/apps/studio/e2e/import-export.test.ts b/apps/studio/e2e/import-export.test.ts index 91131c0388..9ec0d5e0ce 100644 --- a/apps/studio/e2e/import-export.test.ts +++ b/apps/studio/e2e/import-export.test.ts @@ -37,7 +37,7 @@ test.describe( 'Import / Export', () => { const siteContent = new SiteContent( session.mainWindow, defaultSiteName ); // Navigate to the Import / Export tab - const tab = await siteContent.navigateToTab( 'Import / Export' ); + const tab = await siteContent.navigateToTab( 'import-export' ); // TypeScript doesn't narrow the union type, so we need to assert it // We know it's ImportExportTab because we passed 'Import / Export' diff --git a/apps/studio/e2e/import.test.ts b/apps/studio/e2e/import.test.ts index 2b7317347e..9e0dd6efcd 100644 --- a/apps/studio/e2e/import.test.ts +++ b/apps/studio/e2e/import.test.ts @@ -72,7 +72,7 @@ test.describe( 'Import', () => { await expect( siteContent.siteNameHeading ).toHaveText( siteName ); - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); await expect( siteContent.siteNameHeading ).toHaveText( siteName ); const frontendUrl = await settingsTab.copySiteUrlToClipboard( session.electronApp ); expect( frontendUrl ).not.toBeNull(); diff --git a/apps/studio/e2e/localization.test.ts b/apps/studio/e2e/localization.test.ts index 7260c37030..e0d228248a 100644 --- a/apps/studio/e2e/localization.test.ts +++ b/apps/studio/e2e/localization.test.ts @@ -149,9 +149,7 @@ test.describe( 'Localization', () => { await expect( siteContent.siteNameHeading ).toBeVisible( { timeout: 120_000 } ); await expect( siteContent.runningButton ).toBeAttached( { timeout: 120_000 } ); - const settingsTabButton = session.mainWindow.getByRole( 'tab', { - name: /Site Settings|サイト設定|設定/i, - } ); + const settingsTabButton = session.mainWindow.locator( '[role="tab"][id$="-settings"]' ); await settingsTabButton.click(); const copyWpAdminButton = session.mainWindow.getByTestId( 'copy-wp-admin-url' ); await expect( copyWpAdminButton ).toBeVisible(); @@ -177,7 +175,7 @@ test.describe( 'Localization', () => { } ); const siteContentEnglish = new SiteContent( session.mainWindow, siteName ); - const settingsTab = await siteContentEnglish.navigateToTab( 'Site Settings' ); + const settingsTab = await siteContentEnglish.navigateToTab( 'settings' ); await settingsTab.openDeleteSiteModal(); // Wait for the confirmation dialog to be auto-confirmed and deletion to complete diff --git a/apps/studio/e2e/page-objects/settings-tab.ts b/apps/studio/e2e/page-objects/settings-tab.ts index 0915a637c7..6cef855ef4 100644 --- a/apps/studio/e2e/page-objects/settings-tab.ts +++ b/apps/studio/e2e/page-objects/settings-tab.ts @@ -7,7 +7,7 @@ export default class SettingsTab { ) {} get locator() { - return this.page.getByRole( 'tabpanel', { name: 'Site Settings' } ); + return this.page.locator( '[role="tabpanel"][id$="-settings"]' ); } get copyWPAdminButton() { diff --git a/apps/studio/e2e/page-objects/site-content.ts b/apps/studio/e2e/page-objects/site-content.ts index 60f82836c2..75e19f2df4 100644 --- a/apps/studio/e2e/page-objects/site-content.ts +++ b/apps/studio/e2e/page-objects/site-content.ts @@ -36,30 +36,30 @@ export default class SiteContent { return this.locator.getByLabel( 'Copy site url', { exact: false } ); } - getTabButton( tabName: 'Preview' | 'Site Settings' | 'Import / Export' ) { - return this.locator.getByRole( 'tab', { name: tabName } ); + getTabButton( tab: 'preview' | 'settings' | 'import-export' ) { + return this.locator.locator( `[role="tab"][id$="-${ tab }"]` ); } - async navigateToTab( tabName: 'Site Settings' ): Promise< SettingsTab >; - async navigateToTab( tabName: 'Import / Export' ): Promise< ImportExportTab >; + async navigateToTab( tab: 'settings' ): Promise< SettingsTab >; + async navigateToTab( tab: 'import-export' ): Promise< ImportExportTab >; async navigateToTab( - tabName: 'Preview' | 'Site Settings' | 'Import / Export' + tab: 'preview' | 'settings' | 'import-export' ): Promise< SettingsTab | ImportExportTab > { - const tabButton = this.getTabButton( tabName ); + const tabButton = this.getTabButton( tab ); await tabButton.click(); - switch ( tabName ) { - case 'Preview': + switch ( tab ) { + case 'preview': throw new Error( 'Not implemented' ); - case 'Site Settings': { - const tab = new SettingsTab( this.page, this.siteName ); - await expect( tab.locator ).toBeVisible(); - return tab; + case 'settings': { + const settingsTab = new SettingsTab( this.page, this.siteName ); + await expect( settingsTab.locator ).toBeVisible(); + return settingsTab; } - case 'Import / Export': { - const tab = new ImportExportTab( this.page ); - await expect( tab.locator ).toBeVisible(); - return tab; + case 'import-export': { + const importExportTab = new ImportExportTab( this.page ); + await expect( importExportTab.locator ).toBeVisible(); + return importExportTab; } } } diff --git a/apps/studio/e2e/site-navigation.test.ts b/apps/studio/e2e/site-navigation.test.ts index 9a56392324..cc954fd290 100644 --- a/apps/studio/e2e/site-navigation.test.ts +++ b/apps/studio/e2e/site-navigation.test.ts @@ -52,7 +52,7 @@ test.describe( 'Site Navigation', () => { await expect( siteContent.siteNameHeading ).toBeVisible( { timeout: 120_000 } ); // Get site URLs for tests - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); wpAdminUrl = await settingsTab.copyWPAdminUrlToClipboard( session.electronApp ); frontendUrl = await settingsTab.copySiteUrlToClipboard( session.electronApp ); } ); diff --git a/apps/studio/e2e/sites.test.ts b/apps/studio/e2e/sites.test.ts index 1e8bda4310..d9995efa4f 100644 --- a/apps/studio/e2e/sites.test.ts +++ b/apps/studio/e2e/sites.test.ts @@ -72,7 +72,7 @@ test.describe( 'Sites', () => { // Check a WordPress site has been created expect( await pathExists( path.join( localPath, 'wp-config.php' ) ) ).toBe( true ); - await siteContent.navigateToTab( 'Settings' ); + await siteContent.navigateToTab( 'settings' ); await expect( siteContent.frontendButton ).toBeVisible(); const frontendUrl = await siteContent.frontendButton.textContent(); @@ -89,7 +89,7 @@ test.describe( 'Sites', () => { const newPhpVersion = ALLOWED_PHP_VERSIONS.find( ( v ) => v !== DEFAULT_PHP_VERSION ) || '8.2'; const siteContent = new SiteContent( session.mainWindow, DEFAULT_SITE_NAME ); - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); await settingsTab.editSiteButton.click(); await expect( settingsTab.editSiteDialog ).toBeVisible(); @@ -123,7 +123,7 @@ test.describe( 'Sites', () => { const newSiteName = 'E2E-Test-Site-Renamed'; const siteContent = new SiteContent( session.mainWindow, siteName ); - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); await settingsTab.editSiteButton.click(); await expect( settingsTab.editSiteDialog ).toBeVisible(); @@ -143,7 +143,7 @@ test.describe( 'Sites', () => { const { siteName } = await completeOnboardingWithParams(); const siteContent = new SiteContent( session.mainWindow, siteName ); - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); const wpAdminUrl = await settingsTab.copyWPAdminUrlToClipboard( session.electronApp ); const frontendUrl = await settingsTab.copySiteUrlToClipboard( session.electronApp ); @@ -165,7 +165,7 @@ test.describe( 'Sites', () => { expect( await pathExists( path.join( localPath, 'wp-config.php' ) ) ).toBe( true ); const siteContent = new SiteContent( session.mainWindow, siteName ); - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); // Playwright lacks support for interacting with native dialogs, so we mock // the dialog module to simulate the user clicking the "Delete site" @@ -191,7 +191,7 @@ test.describe( 'Sites', () => { const { siteName, localPath } = await completeOnboardingWithParams(); const siteContent = new SiteContent( session.mainWindow, siteName ); - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); // Playwright lacks support for interacting with native dialogs, so we mock // the dialog module to simulate the user clicking the "Delete site" From eb1c4f1892232b6920f390e60c97fa599bd3cf3b Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Fri, 19 Jun 2026 10:58:22 +0200 Subject: [PATCH 3/4] Fix performance metrics test --- tools/metrics/tests/site-editor.test.ts | 2 +- tools/metrics/tests/site-startup.test.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/tools/metrics/tests/site-editor.test.ts b/tools/metrics/tests/site-editor.test.ts index 77c2bdfaa1..76e99dbe45 100644 --- a/tools/metrics/tests/site-editor.test.ts +++ b/tools/metrics/tests/site-editor.test.ts @@ -47,7 +47,7 @@ test.describe( 'Site Editor Load Metrics', () => { await expect( siteContent.runningButton ).toBeAttached( { timeout: 120_000 } ); // Get the WordPress admin URL from settings - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); wpAdminUrl = await settingsTab.copyWPAdminUrlToClipboard( session.electronApp ); // Remove trailing slash if present wpAdminUrl = wpAdminUrl.replace( /\/$/, '' ); diff --git a/tools/metrics/tests/site-startup.test.ts b/tools/metrics/tests/site-startup.test.ts index 440385efb4..0289313671 100644 --- a/tools/metrics/tests/site-startup.test.ts +++ b/tools/metrics/tests/site-startup.test.ts @@ -79,7 +79,7 @@ test.describe( 'Startup Metrics', () => { // Delete the site after test await test.step( 'Delete the site', async () => { - const settingsTab = await siteContent.navigateToTab( 'Settings' ); + const settingsTab = await siteContent.navigateToTab( 'settings' ); await session.electronApp.evaluate( ( { dialog } ) => { dialog.showMessageBox = async () => { return { response: 0, checkboxChecked: true }; From cff287cd0ce97bd72801ec2a329108dba9ae57da Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Fri, 19 Jun 2026 15:10:32 +0200 Subject: [PATCH 4/4] Solve tests --- apps/studio/e2e/page-objects/import-export-tab.ts | 2 +- apps/studio/e2e/page-objects/settings-tab.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/studio/e2e/page-objects/import-export-tab.ts b/apps/studio/e2e/page-objects/import-export-tab.ts index a39b242609..ec17d0f9be 100644 --- a/apps/studio/e2e/page-objects/import-export-tab.ts +++ b/apps/studio/e2e/page-objects/import-export-tab.ts @@ -4,7 +4,7 @@ export default class ImportExportTab { constructor( private page: Page ) {} get locator() { - return this.page.getByRole( 'tabpanel', { name: 'Import / Export' } ); + return this.page.locator( '[role="tabpanel"][id$="-import-export-view"]' ); } get importDropZone() { diff --git a/apps/studio/e2e/page-objects/settings-tab.ts b/apps/studio/e2e/page-objects/settings-tab.ts index 6cef855ef4..30765813c4 100644 --- a/apps/studio/e2e/page-objects/settings-tab.ts +++ b/apps/studio/e2e/page-objects/settings-tab.ts @@ -7,7 +7,7 @@ export default class SettingsTab { ) {} get locator() { - return this.page.locator( '[role="tabpanel"][id$="-settings"]' ); + return this.page.locator( '[role="tabpanel"][id$="-settings-view"]' ); } get copyWPAdminButton() {