Adapt UI regression automated tests to the redesigned Che Dashboard

[svor]

Is your task related to a problem? Please describe

The Che Dashboard UI has been significantly redesigned with PatternFly 6 and introduced via PR:
eclipse-che/che-dashboard#1452

As a result, existing UI automated tests no longer fully align with the current dashboard structure, user flows, and UI elements. Some tests are failing due to outdated selectors, while others may pass without properly validating the new behavior.

This issue tracks the work required to adapt and update the existing UI regression automated tests so they pass correctly.

Describe the solution you'd like

• Wait until fix: Dashboard accessibility improvements (keyboard, Skip to Content, Label in Name, Name/Role/Value) che-dashboard#1464 is merged into the Dashboard re-design with PatternFly 6 che-dashboard#1452
• Apply UI changes introduced in PR Dashboard re-design with PatternFly 6 che-dashboard#1452
• Identify impacted UI automated tests
• Update selectors, locators, and page objects to match the new UI
• Use redesigned User Dashboard container image which patched to have Dev Spaces samples to run the automated tests (including functional-tests, ds-miscellaneous-tests, factory pipelines) against the latest released Dev Spaces and ensure there is no regression.
• Ensure Happy path PR check is passing in che-code, che-dashboard and Eclipse Che repo
• The tests should not depend on whether Eclipse Che opened with a light or dark theme.

E2E test list to check

Check new Dashboard UI with Eclipse Che and Dev Spaces

• EmptyWorkspace
• SmokeTest
• Factory

Check new Dashboard UI with Dev Spaces

• Quarkus
• ExtensionActivationTest
• StartWorkspaceUsingVSCodeDesktopSshEditor (manual check -> run-vscode-ssh-editor-test.log)
• CreateWorkspaceWithExistingNameFromEmptyWorkspaceSample
• RecommendedExtensions
• DevConsoleIntegration
• PredefinedNamespace
• VsixInstallationDisable
• WorkspaceWithParent
• Documentation
• FactoryWithGitRepoOptions
• SshUrlNoOauthPatFactory
• CreateWorkspaceWithExistingNameFromGitUrl
• KubedockPodmanTest
• NoSetupRepoFactory
• RefusedOAuthFactory
• WorkspaceIdleTimeout
• WorkspaceRunTimeout
• RevokeOauth (manual check -> run-revoke-oauth-test.log)
• UserSecretsInWorkspace
• VsixInstallationDisableTest
• CustomOpenVSXRegistry (manual check)

[dmytro-ndp]

What to change in E2E typescript tests (Assisted-by Claude Code)

PatternFly 6 uses CSS class prefixes pf-v6-c-* instead of pf-c-*, which directly impacts E2E test selectors that use CSS
classes.

Summary: Estimated Changes Required

Category	Files Affected	Effort Level
CSS Class Selector Updates	2 files	Low-Medium
Potential UI Toggle Handling	1-2 files	Medium
Total Estimated Changes	~3-4 files	Low-Medium

---

Detailed Findings

1. CSS Class Selectors That WILL Break (High Priority)

The following E2E test files use PatternFly 5 CSS classes that will change in PF6:

tests-library/WorkspaceHandlingTests.ts (lines 26-28)

// Current (PF5):
private static WORKSPACE_STATUS: By = By.xpath('//*/span[@class="pf-c-label__content"]');
private static WORKSPACE_ALERT_TITLE: By = By.xpath('//h4[@class="pf-c-alert__title"]');
private static WORKSPACE_ALERT_DESCRIPTION: By = By.xpath('//*/div[@class="pf-c-alert__description"]');

// Required (PF6):
private static WORKSPACE_STATUS: By = By.xpath('//*/span[@class="pf-v6-c-label__content"]');
private static WORKSPACE_ALERT_TITLE: By = By.xpath('//h4[@class="pf-v6-c-alert__title"]');
private static WORKSPACE_ALERT_DESCRIPTION: By = By.xpath('//*/div[@class="pf-v6-c-alert__description"]');

pageobjects/dashboard/UserPreferences.ts (line 46)

// Current (PF5):
private static readonly ADD_SSH_KEYS_BUTTON: By = By.css('.pf-c-button.pf-m-primary');

// Required (PF6):
private static readonly ADD_SSH_KEYS_BUTTON: By = By.css('.pf-v6-c-button.pf-m-primary');

2. Selectors That Are SAFE (No Changes Needed)

  Most E2E test selectors use stable attributes that remain unchanged:
  ┌───────────────┬──────────────────────────────────────────────────────┬──────────────┐
  │ Selector Type │                       Examples                       │    Status    │
  ├───────────────┼──────────────────────────────────────────────────────┼──────────────┤
  │ data-testid   │ workspace-status-indicator, step-title, loader-alert │ ✅ Unchanged │
  ├───────────────┼──────────────────────────────────────────────────────┼──────────────┤
  │ aria-label    │ About Menu, Actions, Close Dialog                    │ ✅ Unchanged │
  ├───────────────┼──────────────────────────────────────────────────────┼──────────────┤
  │ id attributes │ page-sidebar, git-repo-url, create-and-open-button   │ ✅ Unchanged │
  ├───────────────┼──────────────────────────────────────────────────────┼──────────────┤
  │ Text content  │ "Workspaces (", "Create Workspace", "Logout"         │ ✅ Unchanged │
  └───────────────┴──────────────────────────────────────────────────────┴──────────────┘

3. UI Toggle Feature Consideration

  The PR mentions a UI toggle allowing users to switch between old and new dashboard interfaces:

  "A UI toggle allows users to switch between the current and new dashboard interface"

  This may require:
  - Test setup to ensure the new (PF6) UI is active
  - Or conditional selectors that work with both UIs during transition period

  ---
  Recommended Changes

  Immediate Changes (4 locators in 2 files)
  ┌───────────────────────────┬─────────────────────────────┬──────────────────────────────────────────────────────┐
  │           File            │           Locator           │                        Change                        │
  ├───────────────────────────┼─────────────────────────────┼──────────────────────────────────────────────────────┤
  │ WorkspaceHandlingTests.ts │ WORKSPACE_STATUS            │ pf-c-label__content → pf-v6-c-label__content         │
  ├───────────────────────────┼─────────────────────────────┼──────────────────────────────────────────────────────┤
  │ WorkspaceHandlingTests.ts │ WORKSPACE_ALERT_TITLE       │ pf-c-alert__title → pf-v6-c-alert__title             │
  ├───────────────────────────┼─────────────────────────────┼──────────────────────────────────────────────────────┤
  │ WorkspaceHandlingTests.ts │ WORKSPACE_ALERT_DESCRIPTION │ pf-c-alert__description → pf-v6-c-alert__description │
  ├───────────────────────────┼─────────────────────────────┼──────────────────────────────────────────────────────┤
  │ UserPreferences.ts        │ ADD_SSH_KEYS_BUTTON         │ .pf-c-button → .pf-v6-c-button                       │
  └───────────────────────────┴─────────────────────────────┴──────────────────────────────────────────────────────┘
  Optional Enhancement

  Consider using contains(@class, 'label__content') instead of exact class matches to be more resilient to future PatternFly version
  changes:

  // More resilient approach:
  private static WORKSPACE_STATUS: By = By.xpath('//*/span[contains(@class, "label__content")]');

---

Conclusion

The impact is relatively low because the E2E tests predominantly use stable selectors (data-testid, aria-label, id, text content)
rather than CSS classes. This is good test design practice that has minimized the migration effort.