chore(e2e): [release-1.8] translation support for core e2e tests (#3555) #4223

kim-tsao · 2026-02-09T18:49:40Z

Cherrypick #3555 into release-1.8. Fixversion for https://issues.redhat.com/browse/RHIDP-8463 was targeted to 1.8.1

Fixes: https://issues.redhat.com/browse/RHIDP-12116

chore(e2e): translation support for core e2e tests
added missing translations, removed homepage translations
adding test suite for running french translations
minor changes
rebase and fix
removing custom plugins
fix
fix

Description

Please explain the changes you made here.

Which issue(s) does this PR fix

Fixes #?

PR acceptance criteria

Please make sure that the following steps are complete:

GitHub Actions are completed and successful
Unit Tests are updated and passing
E2E Tests are updated and passing
Documentation is updated if necessary (requirement for new features)
Add a screenshot if the change is UX/UI related

How to test changes / Special notes to the reviewer

…3555) * chore(e2e): translation support for core e2e tests * added missing translations, removed homepage translations * adding test suite for running french translations * minor changes * rebase and fix * removing custom plugins Signed-off-by: its-mitesh-kumar <itsmiteshkumar98@gmail.com> * fix * fix --------- Signed-off-by: its-mitesh-kumar <itsmiteshkumar98@gmail.com> Co-authored-by: its-mitesh-kumar <itsmiteshkumar98@gmail.com>

rhdh-qodo-merge · 2026-02-09T18:50:22Z

PR Reviewer Guide 🔍

Here are some key observations to aid the review process:

🎫 Ticket compliance analysis 🔶 RHIDP-8463 - Partially compliant Compliant requirements: Create a new automated test suite in the existing Playwright collection to verify locale/language switching (English as the baseline before switching). Verify localization in key areas of RHDH: global-header Verify localization in key areas of RHDH: sidebar Verify localization in key areas of RHDH: catalog Verify localization in key areas of RHDH: settings Verify localization in key areas of RHDH: extensions Ensure the suite is easily extendable for additional languages and parameterized to run with a chosen language. Non-compliant requirements: "" Requires further human verification: Validate the suite reliably switches language in the running app (not just asserting translated strings) across environments (local vs CI), and that English is confirmed as the initial baseline before switching. Confirm the new `showcase-localization-fr` project is executed in CI and is stable (no flakes due to timing/labels), including on OpenShift if applicable. Confirm adding a new language requires minimal work (e.g., only adding a locale JSON + project/env), and document/verify the workflow for contributors.
⏱️ Estimated effort to review: 4 🔵🔵🔵🔵⚪
🔒 No security concerns identified
⚡ Recommended focus areas for review Possible Issue In `analyzeAndWait`, `expect(await this.uiHelper.clickButton(...)).not.toBeVisible(...)` appears to be asserting visibility on the return value of `clickButton`, which is likely `void` (or not a Locator). This can lead to runtime failures or a no-op assertion. Consider changing the helper to return the clicked Locator, or assert on a specific UI element/state that should change after clicking (e.g., the Analyze/Next button becomes disabled/hidden, a spinner disappears, or the next step heading becomes visible). / private async analyzeAndWait(url: string): Promise<void> { await this.page.fill(CATALOG_IMPORT_COMPONENTS.componentURL, url); await expect( await this.uiHelper.clickButton( t["catalog-import"][lang]["stepInitAnalyzeUrl.nextButtonText"], ), ).not.toBeVisible({ timeout: 25_000, }); Robustness* `getCurrentLanguage()` derives the language from `process.env.LOCALE`, and many test modules compute `t`/`lang` at import time. This makes the language selection sensitive to when/where the env var is set, and can be brittle if multiple Playwright projects run in the same node process or if configuration changes happen after module load. Consider avoiding module-level `const t/lang` and instead resolving translations within test hooks or functions, or passing `lang` explicitly so it is deterministic per-project. import frRhdh from "../../../../translations/rhdh_v1.8_s3281-fr-C.json" with { type: "json" }; import frCorePlugins from "../../../../translations/core-plugins_v1.8_s3281-fr-C.json" with { type: "json" }; import frCommunityPlugins from "../../../../translations/community-plugins_v1.8_s3281-fr-C.json" with { type: "json" }; import frRhdhPlugins from "../../../../translations/rhdh-plugins__v1.8_s3281-fr-C.json" with { type: "json" }; import frMissingTranslations from "../../../../translations/test/missing-fr-translations.json" with { type: "json" }; import en from "../../../../translations/test/all-v1.8_s3281-en.json" with { type: "json" }; const fr = { ...frRhdh, ...frCorePlugins, ...frCommunityPlugins, ...frRhdhPlugins, ...frMissingTranslations, }; const locales = { en, fr }; export type Locale = keyof typeof locales; export function getCurrentLanguage(): Locale { const lang = process.env.LOCALE \|\| "en"; return lang as Locale; } export function getLocale(lang: Locale = getCurrentLanguage()) { return locales[lang] \|\| locales.en; } export function getTranslations() { const lang = getCurrentLanguage(); return getLocale(lang); }
📚 Focus areas based on broader codebase context Missing fallback The new locale loader returns raw `en`/`fr` objects without merging an English fallback per namespace/key. Any missing French keys will make lookups like `t["plugin.marketplace"][lang]["..."]` evaluate to `undefined` and potentially break selectors/assertions at runtime. Consider merging `fr` over `en` (and typing the merged shape) so every namespace has a complete `en` baseline with locale overrides. (Ref 1, Ref 3) import frRhdh from "../../../../translations/rhdh_v1.8_s3281-fr-C.json" with { type: "json" }; import frCorePlugins from "../../../../translations/core-plugins_v1.8_s3281-fr-C.json" with { type: "json" }; import frCommunityPlugins from "../../../../translations/community-plugins_v1.8_s3281-fr-C.json" with { type: "json" }; import frRhdhPlugins from "../../../../translations/rhdh-plugins__v1.8_s3281-fr-C.json" with { type: "json" }; import frMissingTranslations from "../../../../translations/test/missing-fr-translations.json" with { type: "json" }; import en from "../../../../translations/test/all-v1.8_s3281-en.json" with { type: "json" }; const fr = { ...frRhdh, ...frCorePlugins, ...frCommunityPlugins, ...frRhdhPlugins, ...frMissingTranslations, }; const locales = { en, fr }; export type Locale = keyof typeof locales; export function getCurrentLanguage(): Locale { const lang = process.env.LOCALE \|\| "en"; return lang as Locale; } export function getLocale(lang: Locale = getCurrentLanguage()) { return locales[lang] \|\| locales.en; } export function getTranslations() { const lang = getCurrentLanguage(); return getLocale(lang); } Reference reasoning: The existing localization helper builds a merged translation map by iterating all namespaces across locales and explicitly falling back to English for missing keys. It also maintains a consistent translation-file shape, preventing `undefined` lookups when a locale lacks certain namespaces or messages.
📄 References redhat-developer/rhdh/e2e-tests/playwright/e2e/localization/locale.ts [19-76] redhat-developer/rhdh/e2e-tests/playwright.config.ts [241-285] redhat-developer/rhdh/e2e-tests/playwright/e2e/localization/locale.ts [1-16] redhat-developer/rhdh/e2e-tests/playwright/e2e/localization/locale.ts [16-18] redhat-developer/rhdh/packages/app/src/translations/core-components/core-components.ts [1-12] redhat-developer/rhdh/packages/app/src/translations/core-components/core-components-en.ts [1-7] redhat-developer/rhdh/packages/app/src/translations/rhdh/index.ts [1-35] redhat-developer/rhdh/packages/app/src/translations/rhdh/fr.ts [1-23]

rhdh-qodo-merge · 2026-02-09T18:50:51Z

PR Type

Enhancement, Tests

Description

Add comprehensive translation support to core e2e tests for internationalization (i18n) testing
Implement French localization test suite with new test project configuration (showcase-localization-fr)
Replace hardcoded English strings with translation keys across 12+ e2e test files and utility modules
Add new localization module (locale.ts) to manage translation files and language selection
Create comprehensive English translation file (all-v1.8_s3281-en.json) with 1352 lines covering all core RHDH plugins
Add missing French translations (missing-fr-translations.json) for e2e test-specific strings
Add new settings page e2e test with language toggle verification in English and French
Update TypeScript and Playwright configurations to support JSON module imports and French locale testing
Add utility enhancements including new uncheckCheckbox method and improved text matching options
Change several test.skip to test.fixme() with TODO comments referencing issues

File Walkthrough

Relevant files

Enhancement

12 files

extensions.spec.ts `Add translation support for extensions e2e tests` e2e-tests/playwright/e2e/extensions.spec.ts Imported translation functions (`getTranslations`, `getCurrentLanguage`) from localization module Replaced hardcoded English strings with translation keys for UI elements (headings, buttons, labels, badges) Updated test assertions to use translated text from the `t` object with language-specific keys Changed `test.skip` to `test.fixme()` for several tests with TODO comments referencing issues Modified search and filter interactions to use translated dropdown and option names	+447/-123
default-global-header.spec.ts `Add translation support for global header e2e tests` e2e-tests/playwright/e2e/default-global-header.spec.ts Imported translation functions and initialized translation object with current language Replaced hardcoded strings with translation keys for search placeholders, menu items, and UI labels Updated locator selectors to use translated text for buttons, links, and headings Modified test assertions to verify translated content from multiple translation namespaces	+71/-21
common.ts `Add translation support for common test utilities` e2e-tests/playwright/utils/common.ts Imported translation functions and initialized translation object Replaced hardcoded strings with translation keys for sign-in, button labels, and provider messages Updated selectors and assertions to use translated text from multiple translation namespaces Modified login flow interactions to use translated button and heading text	+51/-17
extensions.ts `Add translation support for extensions page object` e2e-tests/playwright/support/pages/extensions.ts Imported translation functions and initialized translation object Replaced hardcoded heading strings in `commonHeadings` array with translation keys Updated method calls to use translated text for dropdown selections and filter operations Modified assertions to use translated labels for support type filters and badges	+32/-11
catalog-import.ts `Add translation support for catalog import page object` e2e-tests/playwright/support/pages/catalog-import.ts Imported translation functions and initialized translation object Replaced hardcoded button labels with translation keys for analyze, refresh, import, and view component actions Updated method implementations to use translated text from catalog-import namespace	+34/-7
ui-helper.ts `Add translation support and new checkbox utility method` e2e-tests/playwright/utils/ui-helper.ts Imported translation functions and initialized translation object Added new `uncheckCheckbox` method to uncheck checkboxes by aria-label Updated `goToMyProfilePage` method to use translated "My profile" link text Modified `verifyTextVisible` method to accept optional `exact` parameter for text matching	+20/-3
custom-theme.spec.ts `Add translation support for custom theme e2e tests` e2e-tests/playwright/e2e/custom-theme.spec.ts Imported translation functions and initialized translation object Replaced hardcoded button label "Hide" with translated text from quickstart plugin Updated theme setting calls to use translated theme names ("Light", "Dark") from user-settings	+18/-3
sidebar.spec.ts `Add translation support for sidebar navigation tests` e2e-tests/playwright/e2e/plugins/frontend/sidebar.spec.ts Imported translation functions and initialized translation object Replaced hardcoded menu item names with translation keys for APIs, Learning Paths, and Docs Updated sidebar navigation assertions to use translated text	+14/-4
catalog-timestamp.spec.ts `Add translation support for catalog timestamp e2e tests` e2e-tests/playwright/e2e/catalog-timestamp.spec.ts Imported translation functions and initialized translation object Replaced hardcoded sidebar and button labels with translation keys Updated test assertions to use translated text for catalog page titles and button labels	+15/-4
theme-verifier.ts `Add translation support for theme verifier utility` e2e-tests/playwright/utils/custom-theme/theme-verifier.ts Imported translation functions and initialized translation object Updated `setTheme` method to use translated "Settings" heading text Modified page navigation calls to use translated text from user-settings namespace	+14/-2
locale.ts `Add localization module for managing translations` e2e-tests/playwright/e2e/localization/locale.ts New module for managing translation files and language selection Imports French translations from multiple JSON files (rhdh, core-plugins, community-plugins, rhdh-plugins, missing translations) Imports English translations from consolidated test file Exports functions to get current language, retrieve locale data, and access translations	+32/-0
page-obj.ts `Add translation support for page object selectors` e2e-tests/playwright/support/page-objects/page-obj.ts Imported translation functions and initialized translation object Updated `SEARCH_OBJECTS_COMPONENTS` selectors to use translated search bar labels and placeholders	+10/-2

Tests

2 files

settings.spec.ts `Add new settings page e2e test with translations` e2e-tests/playwright/e2e/settings.spec.ts New test file for verifying settings page functionality with translation support Tests language toggle functionality and verifies UI elements in both English and French Uses translation keys to verify settings page content, profile card, appearance settings, and identity information Includes checkbox interactions for pin toggle functionality	+97/-0
all-v1.8_s3281-en.json `Add comprehensive English translations for core RHDH e2e tests` translations/test/all-v1.8_s3281-en.json Added comprehensive English translation file with 1352 lines covering all core RHDH plugins and components Includes translations for global header, floating action button, homepage, RBAC, adoption insights, marketplace, and quickstart plugins Provides translations for core components, user settings, catalog, scaffolder, catalog import, and search functionality Covers API documentation, catalog graph, organization management, and other essential UI elements	+1352/-0

Configuration changes

3 files

playwright.config.ts `Add French localization test project configuration` e2e-tests/playwright.config.ts Added logic to set `LOCALE` environment variable based on test project name Created new test project `showcase-localization-fr` for French language testing Configured French locale and specified test files to run for localization testing	+23/-0
package.json `Add French localization test script` e2e-tests/package.json Added new npm script `showcase-localization-fr` to run French localization tests with LOCALE environment variable	+1/-0
tsconfig.json `Enable JSON module resolution in TypeScript config` e2e-tests/tsconfig.json Added `resolveJsonModule: true` compiler option to enable importing JSON files as modules	+2/-1

Translation

1 files

missing-fr-translations.json `Add missing French translations for e2e tests` translations/test/missing-fr-translations.json New JSON file containing French translations for e2e test strings Includes translations for catalog-import-test, plugin.global-header, and plugin.marketplace namespaces Covers UI elements like buttons, labels, badges, tooltips, and alert messages	+75/-0

Additional files

1 files

locale-test.spec.ts	+0/-51

kim-tsao · 2026-02-09T20:07:50Z

/test e2e-ocp-helm

kim-tsao · 2026-02-09T21:00:54Z

/retest

kim-tsao · 2026-02-09T23:13:18Z

/retest

kim-tsao · 2026-02-10T11:39:02Z

/retest

github-actions · 2026-02-10T16:41:44Z

The image is available at:

kim-tsao · 2026-02-10T16:49:35Z

/test e2e-ocp-helm

kim-tsao · 2026-02-10T22:26:24Z

/test e2e-ocp-helm

openshift-ci · 2026-02-11T00:34:16Z

@kim-tsao: The following test failed, say /retest to rerun all failed tests or /retest-required to rerun all mandatory failed tests:

Test name	Commit	Details	Required	Rerun command
ci/prow/e2e-ocp-helm	`d332b9f`	link	true	`/test e2e-ocp-helm`

Full PR test history. Your PR dashboard.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository. I understand the commands that are listed here.

zdrapela · 2026-02-11T15:00:12Z

/lgtm

openshift-ci · 2026-02-11T15:00:22Z

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by: zdrapela
Once this PR has been reviewed and has the lgtm label, please assign kim-tsao for approval. For more information see the Code Review Process.

The full list of commands accepted by this bot can be found here.

Details

Needs approval from an approver in each of these files:

OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

openshift-ci bot requested review from psrna and zdrapela February 9, 2026 18:49

rhdh-qodo-merge bot added the Review effort 4/5 label Feb 9, 2026

rhdh-qodo-merge bot added Tests Enhancement labels Feb 9, 2026

openshift-ci bot assigned zdrapela Feb 11, 2026

openshift-ci bot added the lgtm label Feb 11, 2026

kim-tsao merged commit 75bb1f1 into redhat-developer:release-1.8 Feb 11, 2026
23 of 25 checks passed

chore(e2e): [release-1.8] translation support for core e2e tests (#3555) #4223

chore(e2e): [release-1.8] translation support for core e2e tests (#3555) #4223

Uh oh!

Conversation

kim-tsao commented Feb 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Which issue(s) does this PR fix

PR acceptance criteria

How to test changes / Special notes to the reviewer

Uh oh!

rhdh-qodo-merge bot commented Feb 9, 2026

PR Reviewer Guide 🔍

Uh oh!

rhdh-qodo-merge bot commented Feb 9, 2026

PR Type

Description

File Walkthrough

Uh oh!

kim-tsao commented Feb 9, 2026

Uh oh!

kim-tsao commented Feb 9, 2026

Uh oh!

kim-tsao commented Feb 9, 2026

Uh oh!

kim-tsao commented Feb 10, 2026

Uh oh!

github-actions bot commented Feb 10, 2026

Uh oh!

kim-tsao commented Feb 10, 2026

Uh oh!

kim-tsao commented Feb 10, 2026

Uh oh!

openshift-ci bot commented Feb 11, 2026

Uh oh!

zdrapela commented Feb 11, 2026

Uh oh!

openshift-ci bot commented Feb 11, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

kim-tsao commented Feb 9, 2026 •

edited

Loading