RI-7275 Create e2e tests for "Create Index" flow on "Vector Search" page

[valkirilov]

Description

Created an e2e test to verify the "Create Index" flow on the new "Vector Search" page:

• open the "Vector Search" page from the top navbar
• go to the "Create Index" page from the "Getting started" button
• on step 1 of the flow, select "Index Type", "Sample Dataset" and "Data Content"
• on step 2, verify the "Preview Command" interface

video.webm

Notes

• for now, the flow is simple because all the fields are disabled, but the tests are dynamic, implemented in a way that they actually click on the visual elements, so we can change them later easily.
• introduced a few additional mocks for Playwright only, necessary for a clean execution
• splitted one of the files on the FE, due to issues in the imports configuration (when using it from the playwright tests)

How the tests work

• We have page objects that define selectors for all the main elements we need to use in our tests. These page object classes also provide helper utilities that we can use in our test cases to keep them concise yet informative about what’s happening. They serve as a layer of abstraction.
• We have a setup step that initializes the environment and prepares a Redis instance suitable for our tests. Then, we open the correct page for each test case and navigate through the UI until we reach it.
• After that, we execute some test steps using the browser page helpers.

How to run the tests

You can always refer to the README, but simply running the following commands should do the trick for you

# From the root directory
yarn dev:api

# In a new tab, again from the root directory
yarn dev:ui

# In a new tab, but this time go to tests/playwright directory
yarn test:chromium:local-web vector-search/create-index

# The, check the detailed report and all the video recordings
yarn playwright show-report

[valkirilov]

There’s a weird issue with importing the FieldTypes enum when using it in the playwright tests. The enum is originally defined in the api, but we’re referencing it from the ui. For some reason, once we use it inside the tests/playwright directory, the tests can't run anymore.

It’s likely due to a misconfiguration of playwright, but I haven’t been able to resolve the issue yet. To address this, I’ve temporarily moved the problematic code outside the file. At least now, we can directly use the rest of the constants in the tests without relying on hardcoded values across different test cases.

[github-actions]

Code Coverage - Backend unit tests

St.❔	Category	Percentage	Covered / Total
🟢	Statements	92.34%	13847/14995
🟡	Branches	74.05%	4177/5641
🟢	Functions	85.86%	2131/2482
🟢	Lines	92.14%	13236/14365

Test suite run success

2951 tests passing in 286 suites.

Report generated by 🧪jest coverage report action from 0f54c1a

[github-actions]

Code Coverage - Integration Tests

Status	Category	Percentage	Covered / Total
🟢	Statements	81.55%	16231/19902
🟡	Branches	64.42%	7310/11347
🟡	Functions	70.3%	2271/3230
🟢	Lines	81.18%	15269/18807

[github-actions]

Code Coverage - Frontend unit tests

St.❔	Category	Percentage	Covered / Total
🟢	Statements	82.01%	19891/24255
🟡	Branches	67.34%	8622/12804
🟡	Functions	76.13%	5295/6955
🟢	Lines	82.43%	19472/23623

Test suite run success

5117 tests passing in 673 suites.

Report generated by 🧪jest coverage report action from 0f54c1a

[Copilot]

Pull Request Overview

This PR implements end-to-end tests for the "Create Index" flow on the Vector Search page. The tests verify the complete user journey from navigating to the Vector Search page, through the multi-step index creation wizard, to successful index creation.

• Created comprehensive e2e test suite using Playwright page object pattern
• Added module mocks to handle UI component imports in Node.js test environment
• Enhanced UI components with test identifiers for reliable test automation

Reviewed Changes

Copilot reviewed 15 out of 15 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
tests/playwright/tests/vector-search/create-index.spec.ts	Main test file implementing the create index flow test
tests/playwright/setup/module-mocks.ts	Node.js module mocks for SVG and UI dependency imports
tests/playwright/playwright.config.ts	Updated config to import module mocks
tests/playwright/pageObjects/pages/vector-search/vector-search-page.ts	Page object for Vector Search page interactions
tests/playwright/pageObjects/pages/vector-search/create-index-page.ts	Page object for Create Index wizard interactions
redisinsight/ui/src/pages/vector-search/pages/VectorSearchPage.tsx	Added test identifier
redisinsight/ui/src/pages/vector-search/pages/VectorSearchCreateIndexPage.tsx	Added test identifier
redisinsight/ui/src/pages/vector-search/create-index/steps/index.ts	Added export for data module
redisinsight/ui/src/pages/vector-search/create-index/steps/data.ts	Extracted bike index data to separate file
redisinsight/ui/src/pages/vector-search/create-index/steps/config.ts	Removed bike index data (moved to data.ts)
redisinsight/ui/src/pages/vector-search/create-index/steps/PreviewCommandDrawer.tsx	Added test identifier
redisinsight/ui/src/pages/vector-search/create-index/steps/CreateIndexStep.tsx	Added test identifier and updated import
redisinsight/ui/src/pages/vector-search/create-index/steps/CreateIndexStep.spec.tsx	Updated import path
redisinsight/ui/src/pages/vector-search/create-index/steps/AddDataStep.tsx	Added test identifiers and container structure
redisinsight/ui/src/pages/vector-search/create-index/steps/AddDataStep.spec.tsx	Updated import path

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[ArtemHoruzhenko]

lgtm