test: testcases for visualization functionality #4061
Conversation
|
|
WalkthroughThe changes enhance the testing suite for a dashboard application using Playwright by adding three new test files: Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant Dashboard
participant Visualization
participant VRL
User->>Dashboard: Login
Dashboard->>User: Authenticate
User->>Dashboard: Create Dashboard
Dashboard->>User: Dashboard Created
User->>Dashboard: Apply Filters
Dashboard->>User: Update Data
User->>Visualization: View Logs
Visualization->>User: Display Logs
User->>VRL: Input VRL Function
VRL->>User: Display Results
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configuration File (
|
ktx-akshay
force-pushed
the
test/dasboard/visulization
branch
from
d66ee3d to
31f58d5
Compare
ktx-akshay
force-pushed
the
test/dasboard/visulization
branch
from
4f3124d to
ddb54e4
Compare
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 10
Outside diff range, codebase verification and nitpick comments (1)
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
7-7: Use template literals for better readability.Using template literals can improve readability when constructing strings.
- const randomDashboardName = 'Dashboard_' + Math.random().toString(36).substr(2, 9); + const randomDashboardName = `Dashboard_${Math.random().toString(36).substr(2, 9)}`;
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (4)
- .github/workflows/playwright.yml (1 hunks)
- tests/ui-testing/playwright-tests/dashboard.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/visualize.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/vrl.spec.js (1 hunks)
Additional context used
Path-based instructions (3)
tests/ui-testing/playwright-tests/visualize.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/vrl.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
Biome
tests/ui-testing/playwright-tests/visualize.spec.js
[error] 40-40: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/vrl.spec.js
[error] 50-50: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/dashboard.spec.js
[error] 50-50: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
Additional comments not posted (19)
.github/workflows/playwright.yml (1)
87-87: LGTM! New test files added to the matrix configuration.The new test files
dashboard.spec.jsandvisualize.spec.jsare correctly added to the matrix configuration for thebrowserjob.tests/ui-testing/playwright-tests/visualize.spec.js (9)
8-22: LGTM! Login function handles navigation and authentication correctly.The
loginfunction correctly navigates to the base URL, fills in the login credentials, and signs in.
24-34: LGTM! Stream selection function handles the process correctly.The
selectStreamAndStreamTypeForLogsfunction correctly handles the selection of a stream and stream type for logs.
42-53: LGTM! Query application function handles the process correctly.The
applyQueryButtonfunction correctly handles clicking the run query button and verifying the response status.
115-126: LGTM! Test case verifies log creation process correctly.The test case correctly verifies that logs are created when ingesting queries into the search field.
128-139: LGTM! Test case verifies default chart settings correctly.The test case correctly verifies that the default chart type and default X,Y axis are set to automatic field after clicking the Visualize button.
141-160: LGTM! Test case verifies data adjustment process correctly.The test case correctly verifies that editing the X-axis and Y-axis on the chart effectively adjusts the displayed data.
162-200: LGTM! Test case verifies data plotting process correctly.The test case correctly verifies that changing the chart type correctly plots the data according to the new chart type.
230-246: LGTM! Test case verifies search query behavior correctly.The test case correctly verifies that there is no reflection of changes in the search query if there is a change in the X and Y axis.
248-257: LGTM! Test case verifies visualization behavior for an empty query correctly.The test case correctly verifies the visualization behavior for an empty query.
tests/ui-testing/playwright-tests/vrl.spec.js (9)
11-31: LGTM! Login function handles navigation and authentication correctly.The
loginfunction correctly navigates to the base URL, fills in the login credentials, and signs in.
33-43: LGTM! Page loading function handles the process correctly.The
waitForDashboardPagefunction correctly waits for the dashboard page to load and verifies the response status.
52-63: LGTM! Query application function handles the process correctly.The
applyQueryButtonfunction correctly handles clicking the run query button and verifying the response status.
145-178: LGTM! Test case verifies VRL function display process correctly.The test case correctly verifies that the VRL function is displayed in the field list after it has been written.
180-217: LGTM! Test case verifies addition of multiple VRL functions correctly.The test case correctly verifies that multiple VRL functions can be successfully added.
219-253: LGTM! Test case verifies chart saving process correctly.The test case correctly verifies that the chart is successfully saved by adding the VRL function.
255-289: LGTM! Test case verifies VRL function query behavior correctly.The test case correctly verifies that the VRL function query does not vanish after changing from custom SQL mode to auto mode.
292-343: LGTM! Test case verifies error message display process correctly.The test case correctly verifies that an error message is displayed when changing the VRL function if the existing VRL function is not updated or changed.
347-379: LGTM! Test case verifies error message display process for invalid VRL function correctly.The test case correctly verifies that an error message is displayed if an invalid VRL function is added.
| test('Verify, The Chart should update when changing the chart type', async ({ page }) => { | ||
|
|
||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
|
|
||
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | ||
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | ||
| await page.getByText('e2e_automate').click(); | ||
|
|
||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | ||
|
|
||
| // await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_docker_id"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-3-w-btn"]').click(); | ||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| await page.waitForTimeout(200); | ||
|
|
||
| await page.locator('[data-test="selected-chart-area-item"]').click(); | ||
|
|
||
| await expect(page.locator('[data-test="selected-chart-area-stacked-item"]')).toBeVisible(); | ||
|
|
||
| await page.locator('[data-test="selected-chart-h-bar-item"] img').click(); | ||
| await expect(page.locator('[data-test="selected-chart-scatter-item"] img')).toBeVisible(); | ||
|
|
||
| await page.locator('[data-test="selected-chart-scatter-item"] img').click(); | ||
| await expect(page.locator('[data-test="selected-chart-gauge-item"] img')).toBeVisible(); | ||
|
|
||
| await page.locator('[data-test="selected-chart-gauge-item"] img').click(); | ||
| await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible(); | ||
|
|
||
| await page.locator('[data-test="dashboard-panel-name"]').click(); | ||
| await page.locator('[data-test="dashboard-panel-name"]').fill('Dash_01'); | ||
| await page.locator('[data-test="dashboard-panel-save"]').click(); | ||
| await page.waitForTimeout(200); | ||
| await page.locator('[data-test="dashboard-edit-panel-Dash_01-dropdown"]').click(); | ||
| await page.locator('[data-test="dashboard-delete-panel"]').click(); | ||
| await page.locator('[data-test="confirm-button"]').click(); | ||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for chart type change.
Consider adding error handling for the process of updating the chart when changing the chart type.
test('Verify, The Chart should update when changing the chart type', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page
<!-- This is an auto-generated comment by CodeRabbit -->| import { test, expect } from "@playwright/test"; | ||
| import logData from "../../ui-testing/cypress/fixtures/log.json"; | ||
| import { log } from "console"; | ||
| import logsdata from "../../test-data/logs_data.json"; | ||
| import { parseArgs } from "util"; |
There was a problem hiding this comment.
Remove unused imports.
The log and parseArgs imports are not used in the file.
- import { log } from "console";
- import { parseArgs } from "util";Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| import { test, expect } from "@playwright/test"; | |
| import logData from "../../ui-testing/cypress/fixtures/log.json"; | |
| import { log } from "console"; | |
| import logsdata from "../../test-data/logs_data.json"; | |
| import { parseArgs } from "util"; | |
| import { test, expect } from "@playwright/test"; | |
| import logData from "../../ui-testing/cypress/fixtures/log.json"; | |
| import logsdata from "../../test-data/logs_data.json"; |
| test('Verify create New Dashboard ', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | ||
|
|
||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for dashboard creation.
Consider adding error handling for the dashboard creation process to manage potential issues.
test('Verify create New Dashboard ', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 });
} catch (error) {
console.error('Dashboard creation failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('Verify create New Dashboard ', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page) | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | |
| }); | |
| test('Verify create New Dashboard ', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | |
| } catch (error) { | |
| console.error('Dashboard creation failed:', error); | |
| throw error; | |
| } | |
| }); |
| test('Verify that Delete the dashboard', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
| await page.locator('[data-test="dashboard-back-btn"]').click(); | ||
|
|
||
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]')).toBeVisible({ timeout: 30000 }); | ||
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]').click(); | ||
| await page.locator('[data-test="confirm-button"]').click(); | ||
|
|
||
|
|
||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for dashboard deletion.
Consider adding error handling for the dashboard deletion process to manage potential issues.
test('Verify that Delete the dashboard', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await page.locator('[data-test="dashboard-back-btn"]').click();
await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]')).toBeVisible({ timeout: 30000 });
await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]').click();
await page.locator('[data-test="confirm-button"]').click();
} catch (error) {
console.error('Dashboard deletion failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('Verify that Delete the dashboard', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page) | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-back-btn"]').click(); | |
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]')).toBeVisible({ timeout: 30000 }); | |
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]').click(); | |
| await page.locator('[data-test="confirm-button"]').click(); | |
| }); | |
| test('Verify that Delete the dashboard', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-back-btn"]').click(); | |
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]')).toBeVisible({ timeout: 30000 }); | |
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]').click(); | |
| await page.locator('[data-test="confirm-button"]').click(); | |
| } catch (error) { | |
| console.error('Dashboard deletion failed:', error); | |
| throw error; | |
| } | |
| }); |
| test('Verify the Duplicate the Dashboard', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | ||
|
|
||
| await page.locator('[data-test="dashboard-back-btn"]').click(); | ||
|
|
||
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]')).toBeVisible(); | ||
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]').click(); | ||
|
|
||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for dashboard duplication.
Consider adding error handling for the dashboard duplication process to manage potential issues.
test('Verify the Duplicate the Dashboard', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 });
await page.locator('[data-test="dashboard-back-btn"]').click();
await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]')).toBeVisible();
await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]').click();
} catch (error) {
console.error('Dashboard duplication failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('Verify the Duplicate the Dashboard', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page) | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | |
| await page.locator('[data-test="dashboard-back-btn"]').click(); | |
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]')).toBeVisible(); | |
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]').click(); | |
| }); | |
| test('Verify the Duplicate the Dashboard', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | |
| await page.locator('[data-test="dashboard-back-btn"]').click(); | |
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]')).toBeVisible(); | |
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]').click(); | |
| } catch (error) { | |
| console.error('Dashboard duplication failed:', error); | |
| throw error; | |
| } | |
| }); |
| test('Verify create dashboard,with add the breakDown', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page); | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 3000 }); | ||
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | ||
|
|
||
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | ||
|
|
||
| // Refine the locator for 'e2e_automate' | ||
| await page.locator('span').filter({ hasText: /^e2e_automate$/ }).click(); | ||
|
|
||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | ||
|
|
||
| await expect(page.locator('[data-test="dashboard-apply"]')).toBeVisible(); | ||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for dashboard creation with breakdown.
Consider adding error handling for the dashboard creation process with breakdown to manage potential issues.
test('Verify create dashboard,with add the breakDown', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 3000 });
await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click();
await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click();
await page.locator('span').filter({ hasText: /^e2e_automate$/ }).click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click();
await expect(page.locator('[data-test="dashboard-apply"]')).toBeVisible();
await page.locator('[data-test="dashboard-apply"]').click();
} catch (error) {
console.error('Dashboard creation with breakdown failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('Verify create dashboard,with add the breakDown', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 3000 }); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | |
| // Refine the locator for 'e2e_automate' | |
| await page.locator('span').filter({ hasText: /^e2e_automate$/ }).click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | |
| await expect(page.locator('[data-test="dashboard-apply"]')).toBeVisible(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| }); | |
| test('Verify create dashboard,with add the breakDown', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 3000 }); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | |
| await page.locator('span').filter({ hasText: /^e2e_automate$/ }).click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | |
| await expect(page.locator('[data-test="dashboard-apply"]')).toBeVisible(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| } catch (error) { | |
| console.error('Dashboard creation with breakdown failed:', error); | |
| throw error; | |
| } | |
| }); |
| async function login(page) { | ||
| await page.goto(process.env["ZO_BASE_URL"], { waitUntil: 'networkidle' }); | ||
| // await page.getByText('Login as internal user').click(); | ||
| await page | ||
| .locator('[data-cy="login-user-id"]') | ||
| .fill(process.env["ZO_ROOT_USER_EMAIL"]); | ||
|
|
||
| // wait for login api response | ||
| const waitForLogin = page.waitForResponse(response => | ||
| response.url().includes('/auth/login') && response.status() === 200 | ||
| ) | ||
|
|
||
| await page | ||
| .locator('[data-cy="login-password"]') | ||
| .fill(process.env["ZO_ROOT_USER_PASSWORD"]); | ||
| await page.locator('[data-cy="login-sign-in"]').click(); | ||
|
|
||
| await waitForLogin | ||
|
|
||
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/", { waitUntil: 'networkidle' }) | ||
| } |
There was a problem hiding this comment.
Ensure proper error handling for login.
Consider adding error handling for the login process to manage potential issues.
async function login(page) {
try {
await page.goto(process.env["ZO_BASE_URL"], { waitUntil: 'networkidle' });
await page.locator('[data-cy="login-user-id"]').fill(process.env["ZO_ROOT_USER_EMAIL"]);
const waitForLogin = page.waitForResponse(response =>
response.url().includes('/auth/login') && response.status() === 200
);
await page.locator('[data-cy="login-password"]').fill(process.env["ZO_ROOT_USER_PASSWORD"]);
await page.locator('[data-cy="login-sign-in"]').click();
await waitForLogin;
await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/", { waitUntil: 'networkidle' });
} catch (error) {
console.error('Login failed:', error);
throw error;
}
}Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| async function login(page) { | |
| await page.goto(process.env["ZO_BASE_URL"], { waitUntil: 'networkidle' }); | |
| // await page.getByText('Login as internal user').click(); | |
| await page | |
| .locator('[data-cy="login-user-id"]') | |
| .fill(process.env["ZO_ROOT_USER_EMAIL"]); | |
| // wait for login api response | |
| const waitForLogin = page.waitForResponse(response => | |
| response.url().includes('/auth/login') && response.status() === 200 | |
| ) | |
| await page | |
| .locator('[data-cy="login-password"]') | |
| .fill(process.env["ZO_ROOT_USER_PASSWORD"]); | |
| await page.locator('[data-cy="login-sign-in"]').click(); | |
| await waitForLogin | |
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/", { waitUntil: 'networkidle' }) | |
| } | |
| async function login(page) { | |
| try { | |
| await page.goto(process.env["ZO_BASE_URL"], { waitUntil: 'networkidle' }); | |
| await page.locator('[data-cy="login-user-id"]').fill(process.env["ZO_ROOT_USER_EMAIL"]); | |
| const waitForLogin = page.waitForResponse(response => | |
| response.url().includes('/auth/login') && response.status() === 200 | |
| ); | |
| await page.locator('[data-cy="login-password"]').fill(process.env["ZO_ROOT_USER_PASSWORD"]); | |
| await page.locator('[data-cy="login-sign-in"]').click(); | |
| await waitForLogin; | |
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/", { waitUntil: 'networkidle' }); | |
| } catch (error) { | |
| console.error('Login failed:', error); | |
| throw error; | |
| } | |
| } |
| test('should update the data when changing between absolute and relative time using the Kolkata time zone.', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
|
|
||
|
|
||
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | ||
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | ||
| await page.getByText('e2e_automate').click(); | ||
|
|
||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | ||
|
|
||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | ||
| await page.locator('label').filter({ hasText: 'Timezonearrow_drop_down' }).locator('i').click(); | ||
| await page.locator('[data-test="datetime-timezone-select"]').click(); | ||
|
|
||
| await page.locator('[data-test="datetime-timezone-select"]').press('Enter'); | ||
| await page.locator('[data-test="datetime-timezone-select"]').fill('calcutta'); | ||
| await page.getByText('Asia/Calcutta', { exact: true }).click(); | ||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| await page.waitForTimeout(300); | ||
|
|
||
| await expect(page.locator('[data-test="date-time-btn"]')).toBeVisible(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-absolute-tab"]').click(); | ||
| await page.locator('button').filter({ hasText: 'chevron_left' }).first().click(); | ||
|
|
||
| await page.getByRole('button', { name: '7', exact: true }).click(); | ||
|
|
||
| await page.getByRole('button', { name: '8', exact: true }).click(); | ||
|
|
||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for time zone change.
Consider adding error handling for the process of changing between absolute and relative time using the Kolkata time zone.
test('should update the data when changing between absolute and relative time using the Kolkata time zone.', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click();
await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click();
await page.getByText('e2e_automate').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click();
await page.locator('[data-test="date-time-btn"]').click();
await page.locator('[data-test="date-time-relative-3-h-btn"]').click();
await page.locator('label').filter({ hasText: 'Timezonearrow_drop_down' }).locator('i').click();
await page.locator('[data-test="datetime-timezone-select"]').click();
await page.locator('[data-test="datetime-timezone-select"]').press('Enter');
await page.locator('[data-test="datetime-timezone-select"]').fill('calcutta');
await page.getByText('Asia/Calcutta', { exact: true }).click();
await page.locator('[data-test="dashboard-apply"]').click();
await page.waitForTimeout(300);
await expect(page.locator('[data-test="date-time-btn"]')).toBeVisible();
await page.locator('[data-test="date-time-btn"]').click();
await page.locator('[data-test="date-time-absolute-tab"]').click();
await page.locator('button').filter({ hasText: 'chevron_left' }).first().click();
await page.getByRole('button', { name: '7', exact: true }).click();
await page.getByRole('button', { name: '8', exact: true }).click();
await page.locator('[data-test="dashboard-apply"]').click();
} catch (error) {
console.error('Time zone change failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('should update the data when changing between absolute and relative time using the Kolkata time zone.', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page) | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | |
| await page.getByText('e2e_automate').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Timezonearrow_drop_down' }).locator('i').click(); | |
| await page.locator('[data-test="datetime-timezone-select"]').click(); | |
| await page.locator('[data-test="datetime-timezone-select"]').press('Enter'); | |
| await page.locator('[data-test="datetime-timezone-select"]').fill('calcutta'); | |
| await page.getByText('Asia/Calcutta', { exact: true }).click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.waitForTimeout(300); | |
| await expect(page.locator('[data-test="date-time-btn"]')).toBeVisible(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-absolute-tab"]').click(); | |
| await page.locator('button').filter({ hasText: 'chevron_left' }).first().click(); | |
| await page.getByRole('button', { name: '7', exact: true }).click(); | |
| await page.getByRole('button', { name: '8', exact: true }).click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| }); | |
| test('should update the data when changing between absolute and relative time using the Kolkata time zone.', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | |
| await page.getByText('e2e_automate').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Timezonearrow_drop_down' }).locator('i').click(); | |
| await page.locator('[data-test="datetime-timezone-select"]').click(); | |
| await page.locator('[data-test="datetime-timezone-select"]').press('Enter'); | |
| await page.locator('[data-test="datetime-timezone-select"]').fill('calcutta'); | |
| await page.getByText('Asia/Calcutta', { exact: true }).click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.waitForTimeout(300); | |
| await expect(page.locator('[data-test="date-time-btn"]')).toBeVisible(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-absolute-tab"]').click(); | |
| await page.locator('button').filter({ hasText: 'chevron_left' }).first().click(); | |
| await page.getByRole('button', { name: '7', exact: true }).click(); | |
| await page.getByRole('button', { name: '8', exact: true }).click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| } catch (error) { | |
| console.error('Time zone change failed:', error); | |
| throw error; | |
| } | |
| }); |
| test('should update the chart when entering a custom SQL query.', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
|
|
||
|
|
||
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | ||
| await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click(); | ||
| await page.locator('[data-test="dashboard-customSql"]').click(); | ||
|
|
||
| // Focus on the first line of the editor | ||
| await page.locator('.view-line').first().click(); | ||
| await page.locator('[data-test="dashboard-panel-query-editor"]').getByLabel('Editor content;Press Alt+F1').fill('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | ||
|
|
||
| // Fill the custom SQL query | ||
| await page.keyboard.type('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | ||
| await page.waitForTimeout(400); | ||
|
|
||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-x_axis_1"] [data-test="dashboard-add-x-data"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-y_axis_1"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-breakdown_1"] [data-test="dashboard-add-b-data"]').click(); | ||
|
|
||
| await page.waitForTimeout(200); | ||
|
|
||
| await page.locator('[data-test="dashboard-apply"]')//.toBeVisible(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-30-m-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | ||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| await page.waitForTimeout(400); | ||
| await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible(); | ||
| await page.locator('[data-test="dashboard-panel-name"]').click(); | ||
| await page.locator('[data-test="dashboard-panel-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-panel-save"]').click(); | ||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for custom SQL query.
Consider adding error handling for the process of updating the chart with a custom SQL query.
test('should update the chart when entering a custom SQL query.', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click();
await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click();
await page.locator('[data-test="dashboard-customSql"]').click();
await page.locator('.view-line').first().click();
await page.locator('[data-test="dashboard-panel-query-editor"]').getByLabel('Editor content;Press Alt+F1').fill('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1');
await page.keyboard.type('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1');
await page.waitForTimeout(400);
await page.locator('[data-test="dashboard-apply"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-x_axis_1"] [data-test="dashboard-add-x-data"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-y_axis_1"] [data-test="dashboard-add-y-data"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-breakdown_1"] [data-test="dashboard-add-b-data"]').click();
await page.waitForTimeout(200);
await page.locator('[data-test="dashboard-apply"]');
await page.locator('[data-test="date-time-btn"]').click();
await page.locator('[data-test="date-time-relative-30-m-btn"]').click();
await page.locator('[data-test="date-time-relative-3-h-btn"]').click();
await page.locator('[data-test="dashboard-apply"]').click();
await page.waitForTimeout(400);
await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible();
await page.locator('[data-test="dashboard-panel-name"]').click();
await page.locator('[data-test="dashboard-panel-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-panel-save"]').click();
} catch (error) {
console.error('Custom SQL query update failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('should update the chart when entering a custom SQL query.', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page) | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click(); | |
| await page.locator('[data-test="dashboard-customSql"]').click(); | |
| // Focus on the first line of the editor | |
| await page.locator('.view-line').first().click(); | |
| await page.locator('[data-test="dashboard-panel-query-editor"]').getByLabel('Editor content;Press Alt+F1').fill('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | |
| // Fill the custom SQL query | |
| await page.keyboard.type('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | |
| await page.waitForTimeout(400); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-x_axis_1"] [data-test="dashboard-add-x-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-y_axis_1"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-breakdown_1"] [data-test="dashboard-add-b-data"]').click(); | |
| await page.waitForTimeout(200); | |
| await page.locator('[data-test="dashboard-apply"]')//.toBeVisible(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-30-m-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.waitForTimeout(400); | |
| await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible(); | |
| await page.locator('[data-test="dashboard-panel-name"]').click(); | |
| await page.locator('[data-test="dashboard-panel-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-panel-save"]').click(); | |
| }); | |
| test('should update the chart when entering a custom SQL query.', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click(); | |
| await page.locator('[data-test="dashboard-customSql"]').click(); | |
| // Focus on the first line of the editor | |
| await page.locator('.view-line').first().click(); | |
| await page.locator('[data-test="dashboard-panel-query-editor"]').getByLabel('Editor content;Press Alt+F1').fill('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | |
| // Fill the custom SQL query | |
| await page.keyboard.type('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | |
| await page.waitForTimeout(400); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-x_axis_1"] [data-test="dashboard-add-x-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-y_axis_1"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-breakdown_1"] [data-test="dashboard-add-b-data"]').click(); | |
| await page.waitForTimeout(200); | |
| await page.locator('[data-test="dashboard-apply"]'); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-30-m-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.waitForTimeout(400); | |
| await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible(); | |
| await page.locator('[data-test="dashboard-panel-name"]').click(); | |
| await page.locator('[data-test="dashboard-panel-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-panel-save"]').click(); | |
| } catch (error) { | |
| console.error('Custom SQL query update failed:', error); | |
| throw error; | |
| } | |
| }); |
There was a problem hiding this comment.
Actionable comments posted: 19
Outside diff range, codebase verification and nitpick comments (1)
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
1-5: Remove unused imports.The
logandparseArgsimports are not used in the file.- import { log } from "console"; - import { parseArgs } from "util";
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- tests/ui-testing/playwright-tests/dashboard.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/visualize.spec.js (1 hunks)
Additional context used
Path-based instructions (2)
tests/ui-testing/playwright-tests/visualize.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
Biome
tests/ui-testing/playwright-tests/visualize.spec.js
[error] 40-40: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/dashboard.spec.js
[error] 50-50: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
Additional comments not posted (1)
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
294-336: Ensure proper error handling for chart type change.Consider adding error handling for the process of updating the chart when changing the chart type.
test('should display the correct and updated chart when changing the chart type', async ({ page }) => { try { await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); await waitForDashboardPage(page); await page.locator('[data-test="dashboard-add"]').click(); await page.locator('[data-test="add-dashboard-name"]').click(); await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); await page.locator('[data-test="dashboard-add-submit"]').click(); await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); await page.getByText('e2e_automate').click(); await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); await page.locator('[data-test="date-time-btn"]').click(); await page.locator('[data-test="date-time-relative-3-w-btn"]').click(); await page.locator('[data-test="dashboard-apply"]').click(); await page.waitForTimeout(200); await page.locator('[data-test="selected-chart-area-item"]').click(); await expect(page.locator('[data-test="selected-chart-area-stacked-item"]')).toBeVisible(); await page.locator('[data-test="selected-chart-h-bar-item"] img').click(); await expect(page.locator('[data-test="selected-chart-scatter-item"] img')).toBeVisible(); await page.locator('[data-test="selected-chart-scatter-item"] img').click(); await expect(page.locator('[data-test="selected-chart-gauge-item"] img')).toBeVisible(); await page.locator('[data-test="selected-chart-gauge-item"] img').click(); await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible(); await page.locator('[data-test="dashboard-panel-name"]').click(); await page.locator('[data-test="dashboard-panel-name"]').fill('Dash_01'); await page.locator('[data-test="dashboard-panel-save"]').click(); await page.waitForTimeout(200); await page.locator('[data-test="dashboard-edit-panel-Dash_01-dropdown"]').click(); await page.locator('[data-test="dashboard-delete-panel"]').click(); await page.locator('[data-test="confirm-button"]').click(); </blockquote></details> </blockquote></details> </details> <!-- This is an auto-generated comment by CodeRabbit for review status -->
| test('should create logs when queries are ingested into the search field', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/logs-item"]').click(); | ||
| await page.getByLabel('SQL Mode').locator('div').nth(2).click(); | ||
| await page.waitForTimeout(1000); | ||
| await page.locator('[data-test="logs-search-index-list"]').getByText('arrow_drop_down').click(); | ||
| await page.locator('[data-test="log-search-index-list-stream-toggle-e2e_automate"] div').nth(2).click(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
|
|
||
|
|
||
| }); |
There was a problem hiding this comment.
Enhance error handling and readability in test case.
Add error handling and comments for better readability.
test('should create logs when queries are ingested into the search field', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/logs-item"]').click();
await page.getByLabel('SQL Mode').locator('div').nth(2).click();
await page.waitForTimeout(1000);
await page.locator('[data-test="logs-search-index-list"]').getByText('arrow_drop_down').click();
await page.locator('[data-test="log-search-index-list-stream-toggle-e2e_automate"] div').nth(2).click();
await page.locator('[data-test="date-time-btn"]').click();
await page.locator('[data-test="date-time-relative-6-w-btn"]').click();
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
} catch (error) {
console.error("Test case failed:", error);
}
});| test('should set the default chart type and default X and Y axes to automatic after clicking the Visualize button', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/logs-item"]').click(); | ||
| await page.locator('[data-test="logs-search-index-list"]').getByText('arrow_drop_down').click(); | ||
| await page.locator('[data-test="logs-logs-toggle"]').click(); | ||
| await page.waitForTimeout(1000); | ||
| await page.locator('[data-test="logs-visualize-toggle"]').click(); | ||
| await expect(page.locator('.q-list > div:nth-child(3)')).toBeVisible(); | ||
| await page.locator('[data-test="dashboard-x-item-_timestamp"]').click(); | ||
| await expect(page.locator('[data-test="dashboard-x-item-_timestamp"]')).toBeVisible(); | ||
| await expect(page.locator('[data-test="dashboard-y-item-_timestamp"]')).toBeVisible(); | ||
|
|
||
| }); |
There was a problem hiding this comment.
Enhance error handling and readability in test case.
Add error handling and comments for better readability.
test('should set the default chart type and default X and Y axes to automatic after clicking the Visualize button', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/logs-item"]').click();
await page.locator('[data-test="logs-search-index-list"]').getByText('arrow_drop_down').click();
await page.locator('[data-test="logs-logs-toggle"]').click();
await page.waitForTimeout(1000);
await page.locator('[data-test="logs-visualize-toggle"]').click();
await expect(page.locator('.q-list > div:nth-child(3)')).toBeVisible();
await page.locator('[data-test="dashboard-x-item-_timestamp"]').click();
await expect(page.locator('[data-test="dashboard-x-item-_timestamp"]')).toBeVisible();
await expect(page.locator('[data-test="dashboard-y-item-_timestamp"]')).toBeVisible();
} catch (error) {
console.error("Test case failed:", error);
}
});| test('should adjust the displayed data effectively when editing the X-axis and Y-axis on the chart', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="logs-visualize-toggle"]').click(); | ||
| await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click(); | ||
| await page.getByText('Chart configuration has been').click(); | ||
| await expect(page.getByText('Chart configuration has been')).toBeVisible(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await expect(page.getByText('There are some errors, please')).toBeVisible(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-x-data"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="dashboard-y-item-_timestamp-remove"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 470, | ||
| y: 13 | ||
| } | ||
| }); | ||
| }); |
There was a problem hiding this comment.
Enhance error handling and readability in test case.
Add error handling and comments for better readability.
test('should adjust the displayed data effectively when editing the X-axis and Y-axis on the chart', async ({ page }) => {
try {
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
await page.locator('[data-test="logs-visualize-toggle"]').click();
await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click();
await page.getByText('Chart configuration has been').click();
await expect(page.getByText('Chart configuration has been')).toBeVisible();
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
await expect(page.getByText('There are some errors, please')).toBeVisible();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-x-data"]').click();
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
await page.locator('[data-test="dashboard-y-item-_timestamp-remove"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-y-data"]').click();
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
await page.locator('[data-test="chart-renderer"] canvas').click({
position: { x: 470, y: 13 }
});
} catch (error) {
console.error("Test case failed:", error);
}
});| test('should correctly plot the data according to the new chart type when changing the chart type', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="logs-visualize-toggle"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubernetes_io_psp"] [data-test="dashboard-add-b-data"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('.q-list > div:nth-child(5)').click(); | ||
| await expect(page.locator('[data-test="chart-renderer"] canvas')).toBeVisible(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 457, | ||
| y: 135 | ||
| } | ||
| }); | ||
| await page.locator('.q-pa-none > .q-list > div').first().click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 590, | ||
| y: 127 | ||
| } | ||
| }); | ||
| await page.locator('.q-list > div:nth-child(2)').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 475, | ||
| y: 45 | ||
| } | ||
| }); | ||
| await page.locator('[data-test="selected-chart-h-bar-item"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 722, | ||
| y: 52 | ||
| } | ||
| }); | ||
| await page.locator('.q-list > div:nth-child(6)').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 362, | ||
| y: 30 | ||
| } | ||
| }); | ||
| await page.locator('div:nth-child(11)').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 650, | ||
| y: 85 | ||
| } | ||
| }); | ||
| await page.locator('div:nth-child(12)').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 216, | ||
| y: 53 | ||
| } | ||
| }); | ||
| await page.locator('div:nth-child(17)').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 423, | ||
| y: 127 | ||
| } | ||
| }); | ||
| }); |
There was a problem hiding this comment.
Enhance error handling and readability in test case.
Add error handling and comments for better readability.
test('should correctly plot the data according to the new chart type when changing the chart type', async ({ page }) => {
try {
await page.locator('[data-test="logs-visualize-toggle"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubernetes_io_psp"] [data-test="dashboard-add-b-data"]').click();
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
await page.locator('.q-list > div:nth-child(5)').click();
await expect(page.locator('[data-test="chart-renderer"] canvas')).toBeVisible();
await page.locator('[data-test="date-time-btn"]').click();
await page.locator('[data-test="date-time-relative-6-w-btn"]').click();
await page.locator('[data-test="chart-renderer"] canvas').click({
position: { x: 457, y: 135 }
});
await page.locator('.q-pa-none > .q-list > div').first().click();
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
await page.locator('[data-test="chart-renderer"] canvas').click({
position: { x: 590, y: 127 }
});
await page.locator('.q-list > div:nth-child(2)').click();
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
await page.locator('[data-test="chart-renderer"] canvas').click({
position: { x: 475, y: 45 }
});
await page.locator('[data-test="selected-chart-h-bar-item"]').click();
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
await page.locator('[data-test="chart-renderer"] canvas').click({
position: { x: 722, y: 52 }
});
await page.locator('.q-list > div:nth-child(6)').click();
await page.locator('[data-test="chart-renderer"] canvas').click({
position: { x: 362, y: 30 }
});
await page.locator('div:nth-child(11)').click();
await page.locator('[data-test="chart-renderer"] canvas').click({
position: { x: 650, y: 85 }
});
await page.locator('div:nth-child(12)').click();
await page.locator('[data-test="chart-renderer"] canvas').click({
position: { x: 216, y: 53 }
});
await page.locator('div:nth-child(17)').click();
await page.locator('[data-test="chart-renderer"] canvas').click({
position: { x: 423, y: 127 }
});
} catch (error) {
console.error("Test case failed:", error);
}
});| test('should not reflect changes in the search query on the logs page if a field is changed or added in the visualization', async ({ page }) => { | ||
|
|
||
| // remain to mention compare qaury | ||
|
|
||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.getByLabel('Expand "kubernetes_container_image"').click(); | ||
| await page.locator('[data-test="logs-search-subfield-add-kubernetes_container_image-058694856476\\.dkr\\.ecr\\.us-west-2\\.amazonaws\\.com\\/ziox\\:v0\\.0\\.3"] [data-test="log-search-subfield-list-equal-kubernetes_container_image-field-btn"]').click(); | ||
| await page.locator('[data-test="logs-search-subfield-add-kubernetes_container_image-sha256\\:90e0a12eae07ad3d0bbfbb73b076ba3ce6e5ad38fb93babc22fba4d19206ca6b"] [data-test="log-search-subfield-list-not-equal-kubernetes_container_image-field-btn"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="logs-visualize-toggle"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubernetes_io_psp"] [data-test="dashboard-add-b-data"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="logs-logs-toggle"]').click(); | ||
| await page.locator('[data-test="confirm-button"]').click(); | ||
| }); |
There was a problem hiding this comment.
Enhance error handling and readability in test case.
Add error handling and comments for better readability.
test('should not reflect changes in the search query on the logs page if a field is changed or added in the visualization', async ({ page }) => {
try {
await page.locator('[data-test="date-time-btn"]').click();
await page.locator('[data-test="date-time-relative-6-w-btn"]').click();
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
await page.getByLabel('Expand "kubernetes_container_image"').click();
await page.locator('[data-test="logs-search-subfield-add-kubernetes_container_image-058694856476\\.dkr\\.ecr\\.us-west-2\\.amazonaws\\.com\\/ziox\\:v0\\.0\\.3"] [data-test="log-search-subfield-list-equal-kubernetes_container_image-field-btn"]').click();
await page.locator('[data-test="logs-search-subfield-add-kubernetes_container_image-sha256\\:90e0a12eae07ad3d0bbfbb73b076ba3ce6e5ad38fb93babc22fba4d19206ca6b"] [data-test="log-search-subfield-list-not-equal-kubernetes_container_image-field-btn"]').click();
await page.locator('[data-test="logs-search-bar-refresh-btn"]').click();
await page.locator('[data-test="logs-visualize-toggle"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubernetes_io_psp"] [data-test="dashboard-add-b-data
<!-- This is an auto-generated comment by CodeRabbit -->| @@ -0,0 +1,462 @@ | |||
| import { test, expect } from "@playwright/test"; | |||
| import logData from "../cypress/fixtures/log.json"; | |||
| import { log } from "console"; | |||
There was a problem hiding this comment.
Remove unnecessary import.
The import from "console" is not used and should be removed to clean up the code.
- import { log } from "console";Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| import { log } from "console"; |
ktx-akshay
force-pushed
the
test/dasboard/visulization
branch
from
4e9c888 to
d3d7e62
Compare
There was a problem hiding this comment.
Actionable comments posted: 10
Outside diff range, codebase verification and nitpick comments (1)
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
52-63: Use configurable timeout values.Hardcoding timeout values can lead to maintenance issues. Consider using a configurable timeout value.
async function applyQueryButton(page) { // click on the run query button // Type the value of a variable into an input field const search = page.waitForResponse(logData.applyQuery); - await page.waitForTimeout(3000); + const timeout = process.env.QUERY_TIMEOUT || 3000; + await page.waitForTimeout(timeout); await page.locator("[data-test='logs-search-bar-refresh-btn']").click({ force: true, }); // get the data from the search variable await expect.poll(async () => (await search).status()).toBe(200); // await search.hits.FIXME_should("be.an", "array"); }
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (4)
- .github/workflows/playwright.yml (1 hunks)
- tests/ui-testing/playwright-tests/dashboard.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/visualize.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/vrl.spec.js (1 hunks)
Files not reviewed due to server errors (2)
- tests/ui-testing/playwright-tests/visualize.spec.js
- tests/ui-testing/playwright-tests/vrl.spec.js
Files skipped from review as they are similar to previous changes (1)
- .github/workflows/playwright.yml
Additional context used
Path-based instructions (3)
tests/ui-testing/playwright-tests/visualize.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/vrl.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
Biome
tests/ui-testing/playwright-tests/visualize.spec.js
[error] 40-40: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/vrl.spec.js
[error] 50-50: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/dashboard.spec.js
[error] 50-50: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
| test('should display the correct and updated chart when changing the chart type', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
|
|
||
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | ||
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | ||
| await page.getByText('e2e_automate').click(); | ||
|
|
||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | ||
|
|
||
| // await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_docker_id"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-3-w-btn"]').click(); | ||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| await page.waitForTimeout(200); | ||
|
|
||
| await page.locator('[data-test="selected-chart-area-item"]').click(); | ||
|
|
||
| await expect(page.locator('[data-test="selected-chart-area-stacked-item"]')).toBeVisible(); | ||
|
|
||
| await page.locator('[data-test="selected-chart-h-bar-item"] img').click(); | ||
| await expect(page.locator('[data-test="selected-chart-scatter-item"] img')).toBeVisible(); | ||
|
|
||
| await page.locator('[data-test="selected-chart-scatter-item"] img').click(); | ||
| await expect(page.locator('[data-test="selected-chart-gauge-item"] img')).toBeVisible(); | ||
|
|
||
| await page.locator('[data-test="selected-chart-gauge-item"] img').click(); | ||
| await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible(); | ||
|
|
||
| await page.locator('[data-test="dashboard-panel-name"]').click(); | ||
| await page.locator('[data-test="dashboard-panel-name"]').fill('Dash_01'); | ||
| await page.locator('[data-test="dashboard-panel-save"]').click(); | ||
| await page.waitForTimeout(200); | ||
| await page.locator('[data-test="dashboard-edit-panel-Dash_01-dropdown"]').click(); | ||
| await page.locator('[data-test="dashboard-delete-panel"]').click(); | ||
| await page.locator('[data-test="confirm-button"]').click(); | ||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for chart type change.
Consider adding error handling for the process of updating the chart when changing the chart type.
test('should display the correct and updated chart when changing the chart type', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click();
await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click();
await page.getByText('e2e_automate').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate
<!-- This is an auto-generated comment by CodeRabbit -->| test('should update the chart with the results of a custom SQL query', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
|
|
||
|
|
||
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | ||
| await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click(); | ||
| await page.locator('[data-test="dashboard-customSql"]').click(); | ||
|
|
||
| // Focus on the first line of the editor | ||
| await page.locator('.view-line').first().click(); | ||
| await page.locator('[data-test="dashboard-panel-query-editor"]').getByLabel('Editor content;Press Alt+F1').fill('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | ||
|
|
||
| // Fill the custom SQL query | ||
| await page.keyboard.type('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | ||
| await page.waitForTimeout(400); | ||
|
|
||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-x_axis_1"] [data-test="dashboard-add-x-data"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-y_axis_1"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-breakdown_1"] [data-test="dashboard-add-b-data"]').click(); | ||
|
|
||
| await page.waitForTimeout(200); | ||
|
|
||
| await page.locator('[data-test="dashboard-apply"]')//.toBeVisible(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-30-m-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | ||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| await page.waitForTimeout(400); | ||
| await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible(); | ||
| await page.locator('[data-test="dashboard-panel-name"]').click(); | ||
| await page.locator('[data-test="dashboard-panel-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-panel-save"]').click(); | ||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for custom SQL query.
Consider adding error handling for the process of updating the chart with a custom SQL query.
test('should update the chart when entering a custom SQL query.', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click();
await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click();
await page.locator('[data-test="dashboard-customSql"]').click();
await page.locator('.view-line').first().click();
await page.locator('[data-test="dashboard-panel-query-editor"]').getByLabel('Editor content;Press Alt+F1').fill('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1');
await page.keyboard.type('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1');
await page.waitForTimeout(400);
await page.locator('[data-test="dashboard-apply"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-x_axis_1"] [data-test="dashboard-add-x-data"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-y_axis_1"] [data-test="dashboard-add-y-data"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-breakdown_1"] [data-test="dashboard-add-b-data"]').click();
await page.waitForTimeout(200);
await page.locator('[data-test="dashboard-apply"]');
await page.locator('[data-test="date-time-btn"]').click();
await page.locator('[data-test="date-time-relative-30-m-btn"]').click();
await page.locator('[data-test="date-time-relative-3-h-btn"]').click();
await page.locator('[data-test="dashboard-apply"]').click();
await page.waitForTimeout(400);
await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible();
await page.locator('[data-test="dashboard-panel-name"]').click();
await page.locator('[data-test="dashboard-panel-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-panel-save"]').click();
} catch (error) {
console.error('Custom SQL query update failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('should update the chart with the results of a custom SQL query', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page) | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click(); | |
| await page.locator('[data-test="dashboard-customSql"]').click(); | |
| // Focus on the first line of the editor | |
| await page.locator('.view-line').first().click(); | |
| await page.locator('[data-test="dashboard-panel-query-editor"]').getByLabel('Editor content;Press Alt+F1').fill('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | |
| // Fill the custom SQL query | |
| await page.keyboard.type('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | |
| await page.waitForTimeout(400); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-x_axis_1"] [data-test="dashboard-add-x-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-y_axis_1"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-breakdown_1"] [data-test="dashboard-add-b-data"]').click(); | |
| await page.waitForTimeout(200); | |
| await page.locator('[data-test="dashboard-apply"]')//.toBeVisible(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-30-m-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.waitForTimeout(400); | |
| await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible(); | |
| await page.locator('[data-test="dashboard-panel-name"]').click(); | |
| await page.locator('[data-test="dashboard-panel-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-panel-save"]').click(); | |
| }); | |
| test('should update the chart with the results of a custom SQL query', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click(); | |
| await page.locator('[data-test="dashboard-customSql"]').click(); | |
| // Focus on the first line of the editor | |
| await page.locator('.view-line').first().click(); | |
| await page.locator('[data-test="dashboard-panel-query-editor"]').getByLabel('Editor content;Press Alt+F1').fill('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | |
| // Fill the custom SQL query | |
| await page.keyboard.type('SELECT histogram(_timestamp) as "x_axis_1", count(_timestamp) as "y_axis_1", kubernetes_container_name as "breakdown_1" FROM "e2e_automate" GROUP BY x_axis_1, breakdown_1'); | |
| await page.waitForTimeout(400); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-x_axis_1"] [data-test="dashboard-add-x-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-y_axis_1"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-breakdown_1"] [data-test="dashboard-add-b-data"]').click(); | |
| await page.waitForTimeout(200); | |
| await page.locator('[data-test="dashboard-apply"]')//.toBeVisible(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-30-m-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.waitForTimeout(400); | |
| await expect(page.locator('[data-test="dashboard-panel-name"]')).toBeVisible(); | |
| await page.locator('[data-test="dashboard-panel-name"]').click(); | |
| await page.locator('[data-test="dashboard-panel-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-panel-save"]').click(); | |
| } catch (error) { | |
| console.error('Custom SQL query update failed:', error); | |
| throw error; | |
| } | |
| }); |
There was a problem hiding this comment.
Actionable comments posted: 9
Outside diff range, codebase verification and nitpick comments (1)
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
3-5: Remove unused imports.The
logandparseArgsimports are not used in the file.- import { log } from "console"; - import { parseArgs } from "util";
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- tests/ui-testing/playwright-tests/dashboard.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/visualize.spec.js (1 hunks)
Additional context used
Path-based instructions (2)
tests/ui-testing/playwright-tests/visualize.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
Biome
tests/ui-testing/playwright-tests/visualize.spec.js
[error] 40-40: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/dashboard.spec.js
[error] 50-50: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
Additional comments not posted (11)
tests/ui-testing/playwright-tests/visualize.spec.js (10)
8-22: Enhance error handling and readability in login function.Add error handling, comments, and replace hardcoded timeouts with element-specific waits.
async function login(page) { try { await page.goto(process.env["ZO_BASE_URL"]); await page.waitForSelector('[data-cy="login-user-id"]'); // Fill in user ID await page.locator('[data-cy="login-user-id"]').fill(process.env["ZO_ROOT_USER_EMAIL"]); // Fill in password await page.locator('[data-cy="login-password"]').fill(process.env["ZO_ROOT_USER_PASSWORD"]); await page.locator('[data-cy="login-sign-in"]').click(); await page.waitForNavigation(); await page.goto(process.env["ZO_BASE_URL"]); } catch (error) { console.error("Login failed:", error); } }
24-34: Enhance error handling and readability in selectStreamAndStreamTypeForLogs function.Add error handling and comments for better readability.
const selectStreamAndStreamTypeForLogs = async (page, stream) => { try { await page.waitForTimeout(4000); await page.locator('[data-test="log-search-index-list-select-stream"]').click({ force: true }); // Select the stream from the dropdown await page.locator("div.q-item").getByText(`${stream}`).first().click({ force: true }); } catch (error) { console.error(`Failed to select stream ${stream}:`, error); } };
42-53: Enhance error handling and readability in applyQueryButton function.Add error handling and comments for better readability.
async function applyQueryButton(page) { try { // Wait for the query response const search = page.waitForResponse(logData.applyQuery); await page.waitForTimeout(3000); // Click on the run query button await page.locator("[data-test='logs-search-bar-refresh-btn']").click({ force: true }); // Ensure the response status is 200 await expect.poll(async () => (await search).status()).toBe(200); } catch (error) { console.error("Failed to apply query:", error); } }
61-114: Enhance error handling and readability in test.beforeEach setup.Add error handling and comments for better readability.
test.beforeEach(async ({ page }) => { console.log("running before each"); try { await login(page); await page.waitForTimeout(5000); const orgId = process.env["ORGNAME"]; const streamName = "e2e_automate"; const basicAuthCredentials = Buffer.from( `${process.env["ZO_ROOT_USER_EMAIL"]}:${process.env["ZO_ROOT_USER_PASSWORD"]}` ).toString("base64"); const headers = { Authorization: `Basic ${basicAuthCredentials}`, "Content-Type": "application/json", }; const response = await page.evaluate( async ({ url, headers, orgId, streamName, logsdata }) => { const fetchResponse = await fetch( `${url}/api/${orgId}/${streamName}/_json`, { method: "POST", headers: headers, body: JSON.stringify(logsdata), } ); return await fetchResponse.json(); }, { url: process.env.INGESTION_URL, headers: headers, orgId: orgId, streamName: streamName, logsdata: logsdata, } ); console.log(response); await page.goto(`${logData.logsUrl}?org_identifier=${process.env["ORGNAME"]}`); await page.waitForResponse("**/api/default/_search**"); await selectStreamAndStreamTypeForLogs(page, logData.Stream); await applyQueryButton(page); } catch (error) { console.error("Setup failed:", error); } });
116-128: Enhance error handling and readability in test case.Add error handling and comments for better readability.
test('should create logs when queries are ingested into the search field', async ({ page }) => { try { await page.locator('[data-test="menu-link-\\/logs-item"]').click(); await page.getByLabel('SQL Mode').locator('div').nth(2).click(); await page.waitForTimeout(1000); await page.locator('[data-test="logs-search-index-list"]').getByText('arrow_drop_down').click(); await page.locator('[data-test="log-search-index-list-stream-toggle-e2e_automate"] div').nth(2).click(); await page.locator('[data-test="date-time-btn"]').click(); await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); } catch (error) { console.error("Test case failed:", error); } });
130-142: Enhance error handling and readability in test case.Add error handling and comments for better readability.
test('should set the default chart type and default X and Y axes to automatic after clicking the Visualize button', async ({ page }) => { try { await page.locator('[data-test="menu-link-\\/logs-item"]').click(); await page.locator('[data-test="logs-search-index-list"]').getByText('arrow_drop_down').click(); await page.locator('[data-test="logs-logs-toggle"]').click(); await page.waitForTimeout(1000); await page.locator('[data-test="logs-visualize-toggle"]').click(); await expect(page.locator('.q-list > div:nth-child(3)')).toBeVisible(); await page.locator('[data-test="dashboard-x-item-_timestamp"]').click(); await expect(page.locator('[data-test="dashboard-x-item-_timestamp"]')).toBeVisible(); await expect(page.locator('[data-test="dashboard-y-item-_timestamp"]')).toBeVisible(); } catch (error) { console.error("Test case failed:", error); } });
144-164: Enhance error handling and readability in test case.Add error handling and comments for better readability.
test('should adjust the displayed data effectively when editing the X-axis and Y-axis on the chart', async ({ page }) => { try { await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await page.locator('[data-test="logs-visualize-toggle"]').click(); await page.locator('[data-test="dashboard-x-item-_timestamp-remove"]').click(); await page.getByText('Chart configuration has been').click(); await expect(page.getByText('Chart configuration has been')).toBeVisible(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await expect(page.getByText('There are some errors, please')).toBeVisible(); await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-x-data"]').click(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await page.locator('[data-test="dashboard-y-item-_timestamp-remove"]').click(); await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-y-data"]').click(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await page.locator('[data-test="chart-renderer"] canvas').click({ position: { x: 470, y: 13 } }); } catch (error) { console.error("Test case failed:", error); } });
166-233: Enhance error handling and readability in test case.Add error handling and comments for better readability.
test('should correctly plot the data according to the new chart type when changing the chart type', async ({ page }) => { try { await page.locator('[data-test="logs-visualize-toggle"]').click(); await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubernetes_io_psp"] [data-test="dashboard-add-b-data"]').click(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await page.locator('.q-list > div:nth-child(5)').click(); await expect(page.locator('[data-test="chart-renderer"] canvas')).toBeVisible(); await page.locator('[data-test="date-time-btn"]').click(); await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); await page.locator('[data-test="chart-renderer"] canvas').click({ position: { x: 457, y: 135 } }); await page.locator('.q-pa-none > .q-list > div').first().click(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await page.locator('[data-test="chart-renderer"] canvas').click({ position: { x: 590, y: 127 } }); await page.locator('.q-list > div:nth-child(2)').click(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await page.locator('[data-test="chart-renderer"] canvas').click({ position: { x: 475, y: 45 } }); await page.locator('[data-test="selected-chart-h-bar-item"]').click(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await page.locator('[data-test="chart-renderer"] canvas').click({ position: { x: 722, y: 52 } }); await page.locator('.q-list > div:nth-child(6)').click(); await page.locator('[data-test="chart-renderer"] canvas').click({ position: { x: 362, y: 30 } }); await page.locator('div:nth-child(11)').click(); await page.locator('[data-test="chart-renderer"] canvas').click({ position: { x: 650, y: 85 } }); await page.locator('div:nth-child(12)').click(); await page.locator('[data-test="chart-renderer"] canvas').click({ position: { x: 216, y: 53 } }); await page.locator('div:nth-child(17)').click(); await page.locator('[data-test="chart-renderer"] canvas').click({ position: { x: 423, y: 127 } }); } catch (error) { console.error("Test case failed:", error); } });
235-251: Enhance error handling and readability in test case.Add error handling and comments for better readability.
test('should not reflect changes in the search query on the logs page if a field is changed or added in the visualization', async ({ page }) => { try { await page.locator('[data-test="date-time-btn"]').click(); await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await page.getByLabel('Expand "kubernetes_container_image"').click(); await page.locator('[data-test="logs-search-subfield-add-kubernetes_container_image-058694856476\\.dkr\\.ecr\\.us-west-2\\.amazonaws\\.com\\/ziox\\:v0\\.0\\.3"] [data-test="log-search-subfield-list-equal-kubernetes_container_image-field-btn"]').click(); await page.locator('[data-test="logs-search-subfield-add-kubernetes_container_image-sha256\\:90e0a12eae07ad3d0bbfbb73b076ba3ce6e5ad38fb93babc22fba4d19206ca6b"] [data-test="log-search-subfield-list-not-equal-kubernetes_container_image-field-btn"]').click(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await page.locator('[data-test="logs-visualize-toggle"]').click(); await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubernetes_io_psp"] [data-test="dashboard-add-b-data"]').click(); await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); await page.locator('[data-test="logs-logs-toggle"]').click(); await page.locator('[data-test="confirm-button"]').click(); } catch (error) { console.error("Test case failed:", error); } });
253-262: Enhance error handling and readability in test case.Add error handling and comments for better
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
253-292: Ensure proper error handling for custom SQL query.Consider adding error handling for the process of updating the chart with a custom SQL query.
test('should update the chart with the results of a custom SQL query.', async ({ page }) => { try { await page.locator('[data-test="menu-link-\\/dashboards-item"]').click </blockquote></details> </blockquote></details> </details> <!-- This is an auto-generated comment by CodeRabbit for review status -->
| function removeUTFCharacters(text) { | ||
| // console.log(text, "tex"); | ||
| // Remove UTF characters using regular expression | ||
| return text.replace(/[^\x00-\x7F]/g, " "); |
There was a problem hiding this comment.
Avoid using control characters in regular expressions.
Control characters are unusual and potentially incorrect inputs. Update the regex to avoid using control characters.
function removeUTFCharacters(text) {
// Remove UTF characters using regular expression
- return text.replace(/[^\x00-\x7F]/g, " ");
+ return text.replace(/[^\u0000-\u007F]/g, " ");
}Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| function removeUTFCharacters(text) { | |
| // console.log(text, "tex"); | |
| // Remove UTF characters using regular expression | |
| return text.replace(/[^\x00-\x7F]/g, " "); | |
| function removeUTFCharacters(text) { | |
| // console.log(text, "tex"); | |
| // Remove UTF characters using regular expression | |
| return text.replace(/[^\u0000-\u007F]/g, " "); |
Tools
Biome
[error] 50-50: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
| test('should create a duplicate of the dashboard', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | ||
|
|
||
| await page.locator('[data-test="dashboard-back-btn"]').click(); | ||
|
|
||
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]')).toBeVisible(); | ||
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]').click(); | ||
|
|
||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for dashboard duplication.
Consider adding error handling for the dashboard duplication process to manage potential issues.
test('should create a duplicate of the dashboard', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 });
await page.locator('[data-test="dashboard-back-btn"]').click();
await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]')).toBeVisible();
await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]').click();
} catch (error) {
console.error('Dashboard duplication failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('should create a duplicate of the dashboard', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page) | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | |
| await page.locator('[data-test="dashboard-back-btn"]').click(); | |
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]')).toBeVisible(); | |
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]').click(); | |
| }); | |
| test('should create a duplicate of the dashboard', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | |
| await page.locator('[data-test="dashboard-back-btn"]').click(); | |
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]')).toBeVisible(); | |
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-duplicate"]').click(); | |
| } catch (error) { | |
| console.error('Dashboard duplication failed:', error); | |
| throw error; | |
| } | |
| }); |
| test('should delete the dashboard', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
| await page.locator('[data-test="dashboard-back-btn"]').click(); | ||
|
|
||
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]')).toBeVisible({ timeout: 30000 }); | ||
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]').click(); | ||
| await page.locator('[data-test="confirm-button"]').click(); | ||
|
|
||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for dashboard deletion.
Consider adding error handling for the dashboard deletion process to manage potential issues.
test('should delete the dashboard', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await page.locator('[data-test="dashboard-back-btn"]').click();
await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]')).toBeVisible({ timeout: 30000 });
await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]').click();
await page.locator('[data-test="confirm-button"]').click();
} catch (error) {
console.error('Dashboard deletion failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('should delete the dashboard', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page) | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-back-btn"]').click(); | |
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]')).toBeVisible({ timeout: 30000 }); | |
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]').click(); | |
| await page.locator('[data-test="confirm-button"]').click(); | |
| }); | |
| test('should delete the dashboard', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-back-btn"]').click(); | |
| await expect(page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]')).toBeVisible({ timeout: 30000 }); | |
| await page.getByRole('row', { name: `01 ${randomDashboardName}` }).locator('[data-test="dashboard-delete"]').click(); | |
| await page.locator('[data-test="confirm-button"]').click(); | |
| } catch (error) { | |
| console.error('Dashboard deletion failed:', error); | |
| throw error; | |
| } | |
| }); |
| async function waitForDashboardPage(page) { | ||
| const dashboardListApi = page.waitForResponse(response => | ||
| /\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200 | ||
| ) | ||
|
|
||
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**") | ||
|
|
||
| await page.waitForSelector(`text="Please wait while loading dashboards..."`, { state: 'hidden' }) | ||
| await dashboardListApi | ||
| await page.waitForTimeout(500) | ||
| } |
There was a problem hiding this comment.
Ensure proper error handling for waiting dashboard page.
Consider adding error handling for the dashboard page loading process to manage potential issues.
async function waitForDashboardPage(page) {
try {
const dashboardListApi = page.waitForResponse(response =>
/\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200
);
await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**");
await page.waitForSelector(`text="Please wait while loading dashboards..."`, { state: 'hidden' });
await dashboardListApi;
await page.waitForTimeout(500);
} catch (error) {
console.error('Dashboard page loading failed:', error);
throw error;
}
}Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| async function waitForDashboardPage(page) { | |
| const dashboardListApi = page.waitForResponse(response => | |
| /\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200 | |
| ) | |
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**") | |
| await page.waitForSelector(`text="Please wait while loading dashboards..."`, { state: 'hidden' }) | |
| await dashboardListApi | |
| await page.waitForTimeout(500) | |
| } | |
| async function waitForDashboardPage(page) { | |
| try { | |
| const dashboardListApi = page.waitForResponse(response => | |
| /\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200 | |
| ); | |
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**"); | |
| await page.waitForSelector(`text="Please wait while loading dashboards..."`, { state: 'hidden' }); | |
| await dashboardListApi; | |
| await page.waitForTimeout(500); | |
| } catch (error) { | |
| console.error('Dashboard page loading failed:', error); | |
| throw error; | |
| } | |
| } |
| async function applyQueryButton(page) { | ||
| // click on the run query button | ||
| // Type the value of a variable into an input field | ||
| const search = page.waitForResponse(logData.applyQuery); | ||
| await page.waitForTimeout(3000); | ||
| await page.locator("[data-test='logs-search-bar-refresh-btn']").click({ | ||
| force: true, | ||
| }); | ||
| // get the data from the search variable | ||
| await expect.poll(async () => (await search).status()).toBe(200); | ||
| // await search.hits.FIXME_should("be.an", "array"); | ||
| } |
There was a problem hiding this comment.
Ensure proper error handling for applying query button.
Consider adding error handling for the process of applying the query to manage potential issues.
async function applyQueryButton(page) {
try {
// click on the run query button
// Type the value of a variable into an input field
const search = page.waitForResponse(logData.applyQuery);
await page.waitForTimeout(3000);
await page.locator("[data-test='logs-search-bar-refresh-btn']").click({
force: true,
});
// get the data from the search variable
await expect.poll(async () => (await search).status()).toBe(200);
} catch (error) {
console.error('Applying query failed:', error);
throw error;
}
}Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| async function applyQueryButton(page) { | |
| // click on the run query button | |
| // Type the value of a variable into an input field | |
| const search = page.waitForResponse(logData.applyQuery); | |
| await page.waitForTimeout(3000); | |
| await page.locator("[data-test='logs-search-bar-refresh-btn']").click({ | |
| force: true, | |
| }); | |
| // get the data from the search variable | |
| await expect.poll(async () => (await search).status()).toBe(200); | |
| // await search.hits.FIXME_should("be.an", "array"); | |
| } | |
| async function applyQueryButton(page) { | |
| try { | |
| // click on the run query button | |
| // Type the value of a variable into an input field | |
| const search = page.waitForResponse(logData.applyQuery); | |
| await page.waitForTimeout(3000); | |
| await page.locator("[data-test='logs-search-bar-refresh-btn']").click({ | |
| force: true, | |
| }); | |
| // get the data from the search variable | |
| await expect.poll(async () => (await search).status()).toBe(200); | |
| } catch (error) { | |
| console.error('Applying query failed:', error); | |
| throw error; | |
| } | |
| } |
| test('should create a new dashboar', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | ||
|
|
||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for dashboard creation.
Consider adding error handling for the dashboard creation process to manage potential issues.
test('should create a new dashboard', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 });
} catch (error) {
console.error('Dashboard creation failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('should create a new dashboar', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page) | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | |
| }); | |
| test('should create a new dashboard', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 30000 }); | |
| } catch (error) { | |
| console.error('Dashboard creation failed:', error); | |
| throw error; | |
| } | |
| }); |
| async function login(page) { | ||
| await page.goto(process.env["ZO_BASE_URL"], { waitUntil: 'networkidle' }); | ||
| // await page.getByText('Login as internal user').click(); | ||
| await page | ||
| .locator('[data-cy="login-user-id"]') | ||
| .fill(process.env["ZO_ROOT_USER_EMAIL"]); | ||
|
|
||
| // wait for login api response | ||
| const waitForLogin = page.waitForResponse(response => | ||
| response.url().includes('/auth/login') && response.status() === 200 | ||
| ) | ||
|
|
||
| await page | ||
| .locator('[data-cy="login-password"]') | ||
| .fill(process.env["ZO_ROOT_USER_PASSWORD"]); | ||
| await page.locator('[data-cy="login-sign-in"]').click(); | ||
|
|
||
| await waitForLogin | ||
|
|
||
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/", { waitUntil: 'networkidle' }) | ||
| } |
There was a problem hiding this comment.
Ensure proper error handling for login.
Consider adding error handling for the login process to manage potential issues.
async function login(page) {
try {
await page.goto(process.env["ZO_BASE_URL"], { waitUntil: 'networkidle' });
await page.locator('[data-cy="login-user-id"]').fill(process.env["ZO_ROOT_USER_EMAIL"]);
const waitForLogin = page.waitForResponse(response =>
response.url().includes('/auth/login') && response.status() === 200
);
await page.locator('[data-cy="login-password"]').fill(process.env["ZO_ROOT_USER_PASSWORD"]);
await page.locator('[data-cy="login-sign-in"]').click();
await waitForLogin;
await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/", { waitUntil: 'networkidle' });
} catch (error) {
console.error('Login failed:', error);
throw error;
}
}Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| async function login(page) { | |
| await page.goto(process.env["ZO_BASE_URL"], { waitUntil: 'networkidle' }); | |
| // await page.getByText('Login as internal user').click(); | |
| await page | |
| .locator('[data-cy="login-user-id"]') | |
| .fill(process.env["ZO_ROOT_USER_EMAIL"]); | |
| // wait for login api response | |
| const waitForLogin = page.waitForResponse(response => | |
| response.url().includes('/auth/login') && response.status() === 200 | |
| ) | |
| await page | |
| .locator('[data-cy="login-password"]') | |
| .fill(process.env["ZO_ROOT_USER_PASSWORD"]); | |
| await page.locator('[data-cy="login-sign-in"]').click(); | |
| await waitForLogin | |
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/", { waitUntil: 'networkidle' }) | |
| } | |
| async function login(page) { | |
| try { | |
| await page.goto(process.env["ZO_BASE_URL"], { waitUntil: 'networkidle' }); | |
| await page.locator('[data-cy="login-user-id"]').fill(process.env["ZO_ROOT_USER_EMAIL"]); | |
| const waitForLogin = page.waitForResponse(response => | |
| response.url().includes('/auth/login') && response.status() === 200 | |
| ); | |
| await page.locator('[data-cy="login-password"]').fill(process.env["ZO_ROOT_USER_PASSWORD"]); | |
| await page.locator('[data-cy="login-sign-in"]').click(); | |
| await waitForLogin; | |
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/", { waitUntil: 'networkidle' }); | |
| } catch (error) { | |
| console.error('Login failed:', error); | |
| throw error; | |
| } | |
| } |
| test('should create a dashboard and add the breakdown', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page); | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 3000 }); | ||
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | ||
|
|
||
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | ||
|
|
||
| // Refine the locator for 'e2e_automate' | ||
| await page.locator('span').filter({ hasText: /^e2e_automate$/ }).click(); | ||
|
|
||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | ||
|
|
||
| await expect(page.locator('[data-test="dashboard-apply"]')).toBeVisible(); | ||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| }); |
There was a problem hiding this comment.
Ensure proper error handling for dashboard creation with breakdown.
Consider adding error handling for the dashboard creation process with breakdown to manage potential issues.
test('should create a dashboard and add the breakdown', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 3000 });
await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click();
await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click();
await page.locator('span').filter({ hasText: /^e2e_automate$/ }).click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click();
await expect(page.locator('[data-test="dashboard-apply"]')).toBeVisible();
await page.locator('[data-test="dashboard-apply"]').click();
} catch (error) {
console.error('Dashboard creation with breakdown failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('should create a dashboard and add the breakdown', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 3000 }); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | |
| // Refine the locator for 'e2e_automate' | |
| await page.locator('span').filter({ hasText: /^e2e_automate$/ }).click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | |
| await expect(page.locator('[data-test="dashboard-apply"]')).toBeVisible(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| }); | |
| test('should create a dashboard and add the breakdown', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText('Dashboard added successfully.')).toBeVisible({ timeout: 3000 }); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | |
| await page.locator('span').filter({ hasText: /^e2e_automate$/ }).click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | |
| await expect(page.locator('[data-test="dashboard-apply"]')).toBeVisible(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| } catch (error) { | |
| console.error('Dashboard creation with breakdown failed:', error); | |
| throw error; | |
| } | |
| }); |
| test('should update the data when changing the time between both absolute and relative time using the Kolkata time zone.', async ({ page }) => { | ||
|
|
||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page) | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
|
|
||
|
|
||
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | ||
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | ||
| await page.getByText('e2e_automate').click(); | ||
|
|
||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | ||
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | ||
|
|
||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | ||
| await page.locator('label').filter({ hasText: 'Timezonearrow_drop_down' }).locator('i').click(); | ||
| await page.locator('[data-test="datetime-timezone-select"]').click(); | ||
|
|
||
| await page.locator('[data-test="datetime-timezone-select"]').press('Enter'); | ||
| await page.locator('[data-test="datetime-timezone-select"]').fill('calcutta'); | ||
| await page.getByText('Asia/Calcutta', { exact: true }).click(); | ||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| await page.waitForTimeout(300); | ||
|
|
||
| await expect(page.locator('[data-test="date-time-btn"]')).toBeVisible(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-absolute-tab"]').click(); | ||
| await page.locator('button').filter({ hasText: 'chevron_left' }).first().click(); | ||
|
|
||
| await page.getByRole('button', { name: '7', exact: true }).click(); | ||
|
|
||
| await page.getByRole('button', { name: '8', exact: true }).click(); | ||
|
|
||
| await page.locator('[data-test="dashboard-apply"]').click(); |
There was a problem hiding this comment.
Ensure proper error handling for time zone change.
Consider adding error handling for the process of changing between absolute and relative time using the Kolkata time zone.
test('should update the data when changing the time between both absolute and relative time using the Kolkata time zone.', async ({ page }) => {
try {
await page.locator('[data-test="menu-link-\\/dashboards-item"]').click();
await waitForDashboardPage(page);
await page.locator('[data-test="dashboard-add"]').click();
await page.locator('[data-test="add-dashboard-name"]').click();
await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName);
await page.locator('[data-test="dashboard-add-submit"]').click();
await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click();
await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click();
await page.getByText('e2e_automate').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click();
await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click();
await page.locator('[data-test="date-time-btn"]').click();
await page.locator('[data-test="date-time-relative-3-h-btn"]').click();
await page.locator('label').filter({ hasText: 'Timezonearrow_drop_down' }).locator('i').click();
await page.locator('[data-test="datetime-timezone-select"]').click();
await page.locator('[data-test="datetime-timezone-select"]').press('Enter');
await page.locator('[data-test="datetime-timezone-select"]').fill('calcutta');
await page.getByText('Asia/Calcutta', { exact: true }).click();
await page.locator('[data-test="dashboard-apply"]').click();
await page.waitForTimeout(300);
await expect(page.locator('[data-test="date-time-btn"]')).toBeVisible();
await page.locator('[data-test="date-time-btn"]').click();
await page.locator('[data-test="date-time-absolute-tab"]').click();
await page.locator('button').filter({ hasText: 'chevron_left' }).first().click();
await page.getByRole('button', { name: '7', exact: true }).click();
await page.getByRole('button', { name: '8', exact: true }).click();
await page.locator('[data-test="dashboard-apply"]').click();
} catch (error) {
console.error('Time zone change failed:', error);
throw error;
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('should update the data when changing the time between both absolute and relative time using the Kolkata time zone.', async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page) | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | |
| await page.getByText('e2e_automate').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Timezonearrow_drop_down' }).locator('i').click(); | |
| await page.locator('[data-test="datetime-timezone-select"]').click(); | |
| await page.locator('[data-test="datetime-timezone-select"]').press('Enter'); | |
| await page.locator('[data-test="datetime-timezone-select"]').fill('calcutta'); | |
| await page.getByText('Asia/Calcutta', { exact: true }).click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.waitForTimeout(300); | |
| await expect(page.locator('[data-test="date-time-btn"]')).toBeVisible(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-absolute-tab"]').click(); | |
| await page.locator('button').filter({ hasText: 'chevron_left' }).first().click(); | |
| await page.getByRole('button', { name: '7', exact: true }).click(); | |
| await page.getByRole('button', { name: '8', exact: true }).click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| test('should update the data when changing the time between both absolute and relative time using the Kolkata time zone.', async ({ page }) => { | |
| try { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page.locator('[data-test="dashboard-if-no-panel-add-panel-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Streamarrow_drop_down' }).locator('i').click(); | |
| await page.getByText('e2e_automate').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_hash"] [data-test="dashboard-add-y-data"]').click(); | |
| await page.locator('[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]').click(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-3-h-btn"]').click(); | |
| await page.locator('label').filter({ hasText: 'Timezonearrow_drop_down' }).locator('i').click(); | |
| await page.locator('[data-test="datetime-timezone-select"]').click(); | |
| await page.locator('[data-test="datetime-timezone-select"]').press('Enter'); | |
| await page.locator('[data-test="datetime-timezone-select"]').fill('calcutta'); | |
| await page.getByText('Asia/Calcutta', { exact: true }).click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| await page.waitForTimeout(300); | |
| await expect(page.locator('[data-test="date-time-btn"]')).toBeVisible(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-absolute-tab"]').click(); | |
| await page.locator('button').filter({ hasText: 'chevron_left' }).first().click(); | |
| await page.getByRole('button', { name: '7', exact: true }).click(); | |
| await page.getByRole('button', { name: '8', exact: true }).click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| } catch (error) { | |
| console.error('Time zone change failed:', error); | |
| throw error; | |
| } | |
| }); |
There was a problem hiding this comment.
Actionable comments posted: 11
Outside diff range, codebase verification and nitpick comments (2)
tests/ui-testing/playwright-tests/dashboard.spec.js (2)
14-14: Remove commented-out code.The commented-out code should be removed to maintain code cleanliness.
- // await page.getByText('Login as internal user').click();
19-19: Remove commented-out code.The commented-out code should be removed to maintain code cleanliness.
- // wait for login api response
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- tests/ui-testing/playwright-tests/dashboard.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/visualize.spec.js (1 hunks)
Additional context used
Path-based instructions (2)
tests/ui-testing/playwright-tests/visualize.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
Biome
tests/ui-testing/playwright-tests/visualize.spec.js
[error] 40-40: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/dashboard.spec.js
[error] 57-57: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
Additional comments not posted (4)
tests/ui-testing/playwright-tests/dashboard.spec.js (4)
37-50: LGTM!The
waitForDashboardPagefunction is well-implemented.
148-160: LGTM!The test case
should create a new dashboardis well-structured.
162-183: LGTM!The test case
should delete the dashboardis well-structured.
185-209: LGTM!The test case
should create a duplicate of the dashboardis well-structured.
ktx-akshay
force-pushed
the
test/dasboard/visulization
branch
from
db642ae to
d2120df
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (4)
- .github/workflows/playwright.yml (1 hunks)
- tests/ui-testing/playwright-tests/dashboard.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/visualize.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/vrl.spec.js (1 hunks)
Files not reviewed due to server errors (2)
- tests/ui-testing/playwright-tests/visualize.spec.js
- tests/ui-testing/playwright-tests/vrl.spec.js
Files skipped from review as they are similar to previous changes (1)
- .github/workflows/playwright.yml
Additional context used
Path-based instructions (3)
tests/ui-testing/playwright-tests/visualize.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/vrl.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
Biome
tests/ui-testing/playwright-tests/visualize.spec.js
[error] 40-40: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/vrl.spec.js
[error] 50-50: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/dashboard.spec.js
[error] 57-57: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
Additional comments not posted (14)
tests/ui-testing/playwright-tests/dashboard.spec.js (14)
3-5: Remove unused imports.The
logandparseArgsimports are not used in the file.- import { log } from "console"; - import { parseArgs } from "util";
14-14: Remove commented-out code.The commented-out line is not needed and should be removed to keep the code clean.
- // await page.getByText('Login as internal user').click();
37-50: LGTM!The function
waitForDashboardPageperforms the expected actions and looks good.
148-160: LGTM!The test case
should create a new dashboardperforms the expected actions and looks good.
162-183: LGTM!The test case
should delete the dashboardperforms the expected actions and looks good.
185-209: LGTM!The test case
should create a duplicate of the dashboardperforms the expected actions and looks good.
211-252: LGTM!The test case
should create a dashboard and add the breakdownperforms the expected actions and looks good.
254-318: LGTM!The test case
should update the data when changing the time between both absolute and relative time using the Kolkata time zoneperforms the expected actions and looks good.
320-388: LGTM!The test case
should update the chart with the results of a custom SQL queryperforms the expected actions and looks good.
390-459: LGTM!The test case
should display the correct and updated chart when changing the chart typeperforms the expected actions and looks good.
461-550: LGTM!The test case
should navigate to another dashboard using the DrillDown featureperforms the expected actions and looks good.
730-813: LGTM!The test case
should dynamically update the filtered data when applying the dynamic filter on the dashboardperforms the expected actions and looks good.
1846-1906: LGTM!The test case
should correctly handle and display string and numeric values when no value replacement occursperforms the expected actions and looks good.
54-57: Fix the regular expression to avoid control characters.The regular expression contains control characters, which can be problematic.
- return text.replace(/[^\x00-\x7F]/g, " "); + return text.replace(/[^\u0000-\u007F]/g, " ");Tools
Biome
[error] 57-57: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
|
|
||
|
|
||
|
|
||
|
|
There was a problem hiding this comment.
remove these additional lines
There was a problem hiding this comment.
Actionable comments posted: 18
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (3)
- tests/ui-testing/playwright-tests/dashboard.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/visualize.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/vrl.spec.js (1 hunks)
Additional context used
Path-based instructions (3)
tests/ui-testing/playwright-tests/visualize.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/vrl.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
Biome
tests/ui-testing/playwright-tests/visualize.spec.js
[error] 39-39: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/vrl.spec.js
[error] 56-56: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/dashboard.spec.js
[error] 55-55: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
Additional comments not posted (4)
tests/ui-testing/playwright-tests/dashboard.spec.js (2)
57-68: LGTM!The function correctly waits for a response and checks its status.
10-33: LGTM!The function correctly handles the login process, including filling in credentials and waiting for the login response.
tests/ui-testing/playwright-tests/visualize.spec.js (1)
157-190: Replace hardcoded timeouts with element-specific waits.Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(1000); + await page.waitForSelector('[data-test="logs-visualize-toggle"]');Likely invalid or redundant comment.
tests/ui-testing/playwright-tests/vrl.spec.js (1)
11-34: Replace hardcoded timeouts with element-specific waits.Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(1000); + await page.waitForSelector('[data-cy="login-user-id"]');Likely invalid or redundant comment.
| function removeUTFCharacters(text) { | ||
| // console.log(text, "tex"); | ||
| // Remove UTF characters using regular expression | ||
| return text.replace(/[^\x00-\x7F]/g, " "); |
There was a problem hiding this comment.
Fix the regular expression to avoid control characters.
The regular expression contains control characters, which can be problematic.
- return text.replace(/[^\x00-\x7F]/g, " ");
+ return text.replace(/[^\u0000-\u007F]/g, " ");Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| return text.replace(/[^\x00-\x7F]/g, " "); | |
| return text.replace(/[^\u0000-\u007F]/g, " "); |
Tools
Biome
[error] 55-55: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
| test("should handle an empty query in visualization without displaying an error.", async ({ | ||
| page, | ||
| }) => { | ||
| await page.locator(".view-line").first().click(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="logs-visualize-toggle"]').click(); | ||
| await expect(page.locator(".view-line").first()).toBeVisible(); | ||
| await expect( | ||
| page.locator('[data-test="dashboard-x-item-_timestamp"]') | ||
| ).toBeVisible(); | ||
| await expect( | ||
| page.locator('[data-test="dashboard-y-item-_timestamp"]') | ||
| ).toBeVisible(); | ||
| }); |
There was a problem hiding this comment.
Replace hardcoded timeouts with element-specific waits.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(1000);
+ await page.waitForSelector('[data-test="logs-visualize-toggle"]');Committable suggestion was skipped due to low confidence.
| test("should correctly plot the data according to the new chart type when changing the chart type", async ({ | ||
| page, | ||
| }) => { | ||
| await page.locator('[data-test="logs-visualize-toggle"]').click(); | ||
| await page | ||
| .locator( | ||
| '[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubernetes_io_psp"] [data-test="dashboard-add-b-data"]' | ||
| ) | ||
| .click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator(".q-list > div:nth-child(5)").click(); | ||
| await expect( | ||
| page.locator('[data-test="chart-renderer"] canvas') | ||
| ).toBeVisible(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 457, | ||
| y: 135, | ||
| }, | ||
| }); | ||
| await page.locator(".q-pa-none > .q-list > div").first().click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 590, | ||
| y: 127, | ||
| }, | ||
| }); | ||
| await page.locator(".q-list > div:nth-child(2)").click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 475, | ||
| y: 45, | ||
| }, | ||
| }); | ||
| await page.locator('[data-test="selected-chart-h-bar-item"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 722, | ||
| y: 52, | ||
| }, | ||
| }); | ||
| await page.locator(".q-list > div:nth-child(6)").click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 362, | ||
| y: 30, | ||
| }, | ||
| }); | ||
| await page.locator("div:nth-child(11)").click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 650, | ||
| y: 85, | ||
| }, | ||
| }); | ||
| await page.locator("div:nth-child(12)").click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 216, | ||
| y: 53, | ||
| }, | ||
| }); | ||
| await page.locator("div:nth-child(17)").click(); | ||
| await page.locator('[data-test="chart-renderer"] canvas').click({ | ||
| position: { | ||
| x: 423, | ||
| y: 127, | ||
| }, | ||
| }); | ||
| }); |
There was a problem hiding this comment.
Replace hardcoded timeouts with element-specific waits.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(1000);
+ await page.waitForSelector('[data-test="logs-visualize-toggle"]');Committable suggestion was skipped due to low confidence.
| test("should not update the query on the logs page when switching between logs and visualization, even if changes are made in any field in the visualization", async ({ | ||
| page, | ||
| }) => { | ||
| // Chart should not reflect changes made to X or Y axis. | ||
|
|
||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.getByLabel('Expand "kubernetes_container_hash"').click(); | ||
| await page | ||
| .locator( | ||
| '[data-test="logs-search-subfield-add-kubernetes_container_hash-058694856476\\.dkr\\.ecr\\.us-west-2\\.amazonaws\\.com\\/ziox\\@sha256\\:3dbbb0dc1eab2d5a3b3e4a75fd87d194e8095c92d7b2b62e7cdbd07020f54589"] [data-test="log-search-subfield-list-equal-kubernetes_container_hash-field-btn"]' | ||
| ) | ||
| .click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="logs-visualize-toggle"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
|
|
||
| let exceptionBefore = null; | ||
| let exceptionAfter = null; | ||
|
|
||
| // try and catch block for compare tow field. | ||
|
|
||
| try { | ||
| await expect( | ||
| page.locator( | ||
| '[data-test="dashboard-filter-item-kubernetes_container_hash"]' | ||
| ) | ||
| ).toBeVisible(); | ||
| } catch (e) { | ||
| exceptionBefore = e; | ||
| } | ||
|
|
||
| await page | ||
| .locator( | ||
| '[data-test="dashboard-filter-item-kubernetes_container_hash-remove"]' | ||
| ) | ||
| .click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="logs-logs-toggle"]').click(); | ||
| await page.locator('[data-test="confirm-button"]').click(); | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| await page.locator('[data-test="logs-visualize-toggle"]').click(); | ||
|
|
||
| try { | ||
| await expect( | ||
| page.locator( | ||
| '[data-test="dashboard-filter-item-kubernetes_container_hash"]' | ||
| ) | ||
| ).toBeVisible(); | ||
| } catch (e) { | ||
| exceptionAfter = e; | ||
| } | ||
|
|
||
| expect(exceptionBefore).toBe(exceptionAfter); | ||
|
|
||
| // Perform an additional refresh to ensure consistency | ||
| await page.locator('[data-test="logs-search-bar-refresh-btn"]').click(); | ||
| }); |
There was a problem hiding this comment.
Replace hardcoded timeouts with element-specific waits.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(1000);
+ await page.waitForSelector('[data-test="logs-visualize-toggle"]');Committable suggestion was skipped due to low confidence.
| const selectStreamAndStreamTypeForLogs = async (page, stream) => { | ||
| await page.waitForTimeout(4000); | ||
| await page | ||
| .locator('[data-test="log-search-index-list-select-stream"]') | ||
| .click({ force: true }); | ||
| await page | ||
| .locator("div.q-item") | ||
| .getByText(`${stream}`) | ||
| .first() | ||
| .click({ force: true }); | ||
| }; |
There was a problem hiding this comment.
Replace hardcoded timeout with element-specific wait.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(4000);
+ await page.waitForSelector('[data-test="log-search-index-list-select-stream"]');Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const selectStreamAndStreamTypeForLogs = async (page, stream) => { | |
| await page.waitForTimeout(4000); | |
| await page | |
| .locator('[data-test="log-search-index-list-select-stream"]') | |
| .click({ force: true }); | |
| await page | |
| .locator("div.q-item") | |
| .getByText(`${stream}`) | |
| .first() | |
| .click({ force: true }); | |
| }; | |
| const selectStreamAndStreamTypeForLogs = async (page, stream) => { | |
| await page.waitForSelector('[data-test="log-search-index-list-select-stream"]'); | |
| await page | |
| .locator('[data-test="log-search-index-list-select-stream"]') | |
| .click({ force: true }); | |
| await page | |
| .locator("div.q-item") | |
| .getByText(`${stream}`) | |
| .first() | |
| .click({ force: true }); | |
| }; |
| function removeUTFCharacters(text) { | ||
| // console.log(text, "tex"); | ||
| // Remove UTF characters using regular expression | ||
| return text.replace(/[^\x00-\x7F]/g, " "); | ||
| } |
There was a problem hiding this comment.
Fix regular expression to remove unexpected control character.
The regular expression contains an unexpected control character and should be corrected.
- return text.replace(/[^\x00-\x7F]/g, " ");
+ return text.replace(/[^\x20-\x7E]/g, " ");Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| function removeUTFCharacters(text) { | |
| // console.log(text, "tex"); | |
| // Remove UTF characters using regular expression | |
| return text.replace(/[^\x00-\x7F]/g, " "); | |
| } | |
| function removeUTFCharacters(text) { | |
| // console.log(text, "tex"); | |
| // Remove UTF characters using regular expression | |
| return text.replace(/[^\x20-\x7E]/g, " "); | |
| } |
Tools
Biome
[error] 56-56: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
| async function applyQueryButton(page) { | ||
| // click on the run query button | ||
| // Type the value of a variable into an input field | ||
| const search = page.waitForResponse(logData.applyQuery); | ||
| await page.waitForTimeout(3000); | ||
| await page.locator("[data-test='logs-search-bar-refresh-btn']").click({ | ||
| force: true, | ||
| }); | ||
| // get the data from the search variable | ||
| await expect.poll(async () => (await search).status()).toBe(200); | ||
| // await search.hits.FIXME_should("be.an", "array"); | ||
| } |
There was a problem hiding this comment.
Replace hardcoded timeout with element-specific wait.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(3000);
+ await page.waitForSelector("[data-test='logs-search-bar-refresh-btn']");Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| async function applyQueryButton(page) { | |
| // click on the run query button | |
| // Type the value of a variable into an input field | |
| const search = page.waitForResponse(logData.applyQuery); | |
| await page.waitForTimeout(3000); | |
| await page.locator("[data-test='logs-search-bar-refresh-btn']").click({ | |
| force: true, | |
| }); | |
| // get the data from the search variable | |
| await expect.poll(async () => (await search).status()).toBe(200); | |
| // await search.hits.FIXME_should("be.an", "array"); | |
| } | |
| async function applyQueryButton(page) { | |
| // click on the run query button | |
| // Type the value of a variable into an input field | |
| const search = page.waitForResponse(logData.applyQuery); | |
| await page.waitForSelector("[data-test='logs-search-bar-refresh-btn']"); | |
| await page.locator("[data-test='logs-search-bar-refresh-btn']").click({ | |
| force: true, | |
| }); | |
| // get the data from the search variable | |
| await expect.poll(async () => (await search).status()).toBe(200); | |
| // await search.hits.FIXME_should("be.an", "array"); | |
| } |
| async function waitForDashboardPage(page) { | ||
| const dashboardListApi = page.waitForResponse( | ||
| (response) => | ||
| /\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200 | ||
| ); | ||
|
|
||
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**"); | ||
|
|
||
| await page.waitForSelector(`text="Please wait while loading dashboards..."`, { | ||
| state: "hidden", | ||
| }); | ||
| await dashboardListApi; | ||
| await page.waitForTimeout(500); | ||
| } |
There was a problem hiding this comment.
Replace hardcoded timeout with element-specific wait.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(500);
+ await page.waitForSelector('text="Please wait while loading dashboards..."', { state: "hidden" });Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| async function waitForDashboardPage(page) { | |
| const dashboardListApi = page.waitForResponse( | |
| (response) => | |
| /\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200 | |
| ); | |
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**"); | |
| await page.waitForSelector(`text="Please wait while loading dashboards..."`, { | |
| state: "hidden", | |
| }); | |
| await dashboardListApi; | |
| await page.waitForTimeout(500); | |
| } | |
| async function waitForDashboardPage(page) { | |
| const dashboardListApi = page.waitForResponse( | |
| (response) => | |
| /\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200 | |
| ); | |
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**"); | |
| await page.waitForSelector(`text="Please wait while loading dashboards..."`, { | |
| state: "hidden", | |
| }); | |
| await dashboardListApi; | |
| await page.waitForSelector('text="Please wait while loading dashboards..."', { state: "hidden" }); | |
| } |
| test.beforeEach(async ({ page }) => { | ||
| await login(page); | ||
|
|
||
| // just to make sure org is set | ||
| const orgNavigation = page.goto( | ||
| `${logData.logsUrl}?org_identifier=${process.env["ORGNAME"]}` | ||
| ); | ||
|
|
||
| // ("ingests logs via API", () => { | ||
| const orgId = process.env["ORGNAME"]; | ||
| const streamName = "e2e_automate"; | ||
| const basicAuthCredentials = Buffer.from( | ||
| `${process.env["ZO_ROOT_USER_EMAIL"]}:${process.env["ZO_ROOT_USER_PASSWORD"]}` | ||
| ).toString("base64"); | ||
|
|
||
| const headers = { | ||
| Authorization: `Basic ${basicAuthCredentials}`, | ||
| "Content-Type": "application/json", | ||
| }; | ||
|
|
||
| // const logsdata = {}; // Fill this with your actual data | ||
|
|
||
| const fetchResponse = await fetch( | ||
| `${process.env.INGESTION_URL}/api/${orgId}/${streamName}/_json`, | ||
| { | ||
| method: "POST", | ||
| headers: headers, | ||
| body: JSON.stringify(logsdata), | ||
| } | ||
| ); | ||
| const response = await fetchResponse.json(); | ||
|
|
||
| await orgNavigation; | ||
|
|
||
| // Making a POST request using fetch API | ||
| // const response = await page.evaluate( | ||
| // async ({ url, headers, orgId, streamName, logsdata }) => { | ||
| // const fetchResponse = await fetch( | ||
| // `${url}/api/${orgId}/${streamName}/_json`, | ||
| // { | ||
| // method: "POST", | ||
| // headers: headers, | ||
| // body: JSON.stringify(logsdata), | ||
| // } | ||
| // ); | ||
| // return await fetchResponse.json(); | ||
| // }, | ||
| // { | ||
| // url: process.env.INGESTION_URL, | ||
| // headers: headers, | ||
| // orgId: orgId, | ||
| // streamName: streamName, | ||
| // logsdata: logsdata, | ||
| // } | ||
| // ); | ||
|
|
||
| console.log(response); | ||
| // }); | ||
| // const allorgs = page.waitForResponse("**/api/default/organizations**"); | ||
| // const functions = page.waitForResponse("**/api/default/functions**"); | ||
| // await page.goto( | ||
| // `${logData.logsUrl}?org_identifier=${process.env["ORGNAME"]}` | ||
| // ); | ||
| // const allsearch = page.waitForResponse("**/api/default/_search**"); | ||
| // await selectStreamAndStreamTypeForLogs(page, logData.Stream); | ||
| // await applyQueryButton(page); | ||
| // const streams = page.waitForResponse("**/api/default/streams**"); | ||
| }); |
There was a problem hiding this comment.
Add error handling in beforeEach setup.
Add error handling for better reliability.
test.beforeEach(async ({ page }) => {
try {
await login(page);
const orgNavigation = page.goto(
`${logData.logsUrl}?org_identifier=${process.env["ORGNAME"]}`
);
const orgId = process.env["ORGNAME"];
const streamName = "e2e_automate";
const basicAuthCredentials = Buffer.from(
`${process.env["ZO_ROOT_USER_EMAIL"]}:${process.env["ZO_ROOT_USER_PASSWORD"]}`
).toString("base64");
const headers = {
Authorization: `Basic ${basicAuthCredentials}`,
"Content-Type": "application/json",
};
const fetchResponse = await fetch(
`${process.env.INGESTION_URL}/api/${orgId}/${streamName}/_json`,
{
method: "POST",
headers: headers,
body: JSON.stringify(logsdata),
}
);
const response = await fetchResponse.json();
await orgNavigation;
console.log(response);
} catch (error) {
console.error("Setup failed:", error);
}
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test.beforeEach(async ({ page }) => { | |
| await login(page); | |
| // just to make sure org is set | |
| const orgNavigation = page.goto( | |
| `${logData.logsUrl}?org_identifier=${process.env["ORGNAME"]}` | |
| ); | |
| // ("ingests logs via API", () => { | |
| const orgId = process.env["ORGNAME"]; | |
| const streamName = "e2e_automate"; | |
| const basicAuthCredentials = Buffer.from( | |
| `${process.env["ZO_ROOT_USER_EMAIL"]}:${process.env["ZO_ROOT_USER_PASSWORD"]}` | |
| ).toString("base64"); | |
| const headers = { | |
| Authorization: `Basic ${basicAuthCredentials}`, | |
| "Content-Type": "application/json", | |
| }; | |
| // const logsdata = {}; // Fill this with your actual data | |
| const fetchResponse = await fetch( | |
| `${process.env.INGESTION_URL}/api/${orgId}/${streamName}/_json`, | |
| { | |
| method: "POST", | |
| headers: headers, | |
| body: JSON.stringify(logsdata), | |
| } | |
| ); | |
| const response = await fetchResponse.json(); | |
| await orgNavigation; | |
| // Making a POST request using fetch API | |
| // const response = await page.evaluate( | |
| // async ({ url, headers, orgId, streamName, logsdata }) => { | |
| // const fetchResponse = await fetch( | |
| // `${url}/api/${orgId}/${streamName}/_json`, | |
| // { | |
| // method: "POST", | |
| // headers: headers, | |
| // body: JSON.stringify(logsdata), | |
| // } | |
| // ); | |
| // return await fetchResponse.json(); | |
| // }, | |
| // { | |
| // url: process.env.INGESTION_URL, | |
| // headers: headers, | |
| // orgId: orgId, | |
| // streamName: streamName, | |
| // logsdata: logsdata, | |
| // } | |
| // ); | |
| console.log(response); | |
| // }); | |
| // const allorgs = page.waitForResponse("**/api/default/organizations**"); | |
| // const functions = page.waitForResponse("**/api/default/functions**"); | |
| // await page.goto( | |
| // `${logData.logsUrl}?org_identifier=${process.env["ORGNAME"]}` | |
| // ); | |
| // const allsearch = page.waitForResponse("**/api/default/_search**"); | |
| // await selectStreamAndStreamTypeForLogs(page, logData.Stream); | |
| // await applyQueryButton(page); | |
| // const streams = page.waitForResponse("**/api/default/streams**"); | |
| }); | |
| test.beforeEach(async ({ page }) => { | |
| try { | |
| await login(page); | |
| // just to make sure org is set | |
| const orgNavigation = page.goto( | |
| `${logData.logsUrl}?org_identifier=${process.env["ORGNAME"]}` | |
| ); | |
| // ("ingests logs via API", () => { | |
| const orgId = process.env["ORGNAME"]; | |
| const streamName = "e2e_automate"; | |
| const basicAuthCredentials = Buffer.from( | |
| `${process.env["ZO_ROOT_USER_EMAIL"]}:${process.env["ZO_ROOT_USER_PASSWORD"]}` | |
| ).toString("base64"); | |
| const headers = { | |
| Authorization: `Basic ${basicAuthCredentials}`, | |
| "Content-Type": "application/json", | |
| }; | |
| // const logsdata = {}; // Fill this with your actual data | |
| const fetchResponse = await fetch( | |
| `${process.env.INGESTION_URL}/api/${orgId}/${streamName}/_json`, | |
| { | |
| method: "POST", | |
| headers: headers, | |
| body: JSON.stringify(logsdata), | |
| } | |
| ); | |
| const response = await fetchResponse.json(); | |
| await orgNavigation; | |
| // Making a POST request using fetch API | |
| // const response = await page.evaluate( | |
| // async ({ url, headers, orgId, streamName, logsdata }) => { | |
| // const fetchResponse = await fetch( | |
| // `${url}/api/${orgId}/${streamName}/_json`, | |
| // { | |
| // method: "POST", | |
| // headers: headers, | |
| // body: JSON.stringify(logsdata), | |
| // } | |
| // ); | |
| // return await fetchResponse.json(); | |
| // }, | |
| // { | |
| // url: process.env.INGESTION_URL, | |
| // headers: headers, | |
| // orgId: orgId, | |
| // streamName: streamName, | |
| // logsdata: logsdata, | |
| // } | |
| // ); | |
| console.log(response); | |
| // }); | |
| // const allorgs = page.waitForResponse("**/api/default/organizations**"); | |
| // const functions = page.waitForResponse("**/api/default/functions**"); | |
| // await page.goto( | |
| // `${logData.logsUrl}?org_identifier=${process.env["ORGNAME"]}` | |
| // ); | |
| // const allsearch = page.waitForResponse("**/api/default/_search**"); | |
| // await selectStreamAndStreamTypeForLogs(page, logData.Stream); | |
| // await applyQueryButton(page); | |
| // const streams = page.waitForResponse("**/api/default/streams**"); | |
| } catch (error) { | |
| console.error("Setup failed:", error); | |
| } | |
| }); |
| test("should display the VRL function in the field list after it has been written.", async ({ | ||
| page, | ||
| }) => { | ||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page); | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page | ||
| .locator('[data-test="add-dashboard-name"]') | ||
| .fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
|
|
||
| await page | ||
| .locator('[data-test="dashboard-if-no-panel-add-panel-btn"]') | ||
| .click(); | ||
| await page | ||
| .locator("label") | ||
| .filter({ hasText: "Streamarrow_drop_down" }) | ||
| .locator("i") | ||
| .click(); | ||
| await page.getByText("e2e_automate").click(); | ||
| await page | ||
| .locator( | ||
| '[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubectl_kubernetes_io_default_container"] [data-test="dashboard-add-y-data"]' | ||
| ) | ||
| .click(); | ||
| await page | ||
| .locator( | ||
| '[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubernetes_io_psp"] [data-test="dashboard-add-b-data"]' | ||
| ) | ||
| .click(); | ||
| await page.locator('[data-test="date-time-btn"]').click(); | ||
| await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); | ||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| // await page.getByText('arrow_rightQueryAutoPromQLCustom SQL').click(); | ||
| await page | ||
| .locator('[data-test="logs-search-bar-show-query-toggle-btn"] img') | ||
| .click(); | ||
|
|
||
| // await page.locator('#fnEditor > .monaco-editor > .overflow-guard > div:nth-child(2) > .lines-content > .view-lines').click(); | ||
| await page | ||
| .locator('[data-test="dashboard-vrl-function-editor"]') | ||
| .getByLabel("Editor content;Press Alt+F1") | ||
| .fill(".vrl=123"); | ||
| await page.waitForTimeout(3000); | ||
|
|
||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
| const locator = page.locator( | ||
| '[data-test="field-list-item-logs-e2e_automate-vrl"]' | ||
| ); | ||
|
|
||
| // Get the locator and ensure it is visible | ||
| await page | ||
| .locator('[data-test="field-list-item-logs-e2e_automate-vrl"]') | ||
| .waitFor({ state: "visible" }); | ||
| }); |
There was a problem hiding this comment.
Replace hardcoded timeout with element-specific wait.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(3000);
+ await page.waitForSelector('[data-test="dashboard-apply"]');Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test("should display the VRL function in the field list after it has been written.", async ({ | |
| page, | |
| }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page | |
| .locator('[data-test="add-dashboard-name"]') | |
| .fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page | |
| .locator('[data-test="dashboard-if-no-panel-add-panel-btn"]') | |
| .click(); | |
| await page | |
| .locator("label") | |
| .filter({ hasText: "Streamarrow_drop_down" }) | |
| .locator("i") | |
| .click(); | |
| await page.getByText("e2e_automate").click(); | |
| await page | |
| .locator( | |
| '[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubectl_kubernetes_io_default_container"] [data-test="dashboard-add-y-data"]' | |
| ) | |
| .click(); | |
| await page | |
| .locator( | |
| '[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubernetes_io_psp"] [data-test="dashboard-add-b-data"]' | |
| ) | |
| .click(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| // await page.getByText('arrow_rightQueryAutoPromQLCustom SQL').click(); | |
| await page | |
| .locator('[data-test="logs-search-bar-show-query-toggle-btn"] img') | |
| .click(); | |
| // await page.locator('#fnEditor > .monaco-editor > .overflow-guard > div:nth-child(2) > .lines-content > .view-lines').click(); | |
| await page | |
| .locator('[data-test="dashboard-vrl-function-editor"]') | |
| .getByLabel("Editor content;Press Alt+F1") | |
| .fill(".vrl=123"); | |
| await page.waitForTimeout(3000); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| const locator = page.locator( | |
| '[data-test="field-list-item-logs-e2e_automate-vrl"]' | |
| ); | |
| // Get the locator and ensure it is visible | |
| await page | |
| .locator('[data-test="field-list-item-logs-e2e_automate-vrl"]') | |
| .waitFor({ state: "visible" }); | |
| }); | |
| test("should display the VRL function in the field list after it has been written.", async ({ | |
| page, | |
| }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page | |
| .locator('[data-test="add-dashboard-name"]') | |
| .fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await page | |
| .locator('[data-test="dashboard-if-no-panel-add-panel-btn"]') | |
| .click(); | |
| await page | |
| .locator("label") | |
| .filter({ hasText: "Streamarrow_drop_down" }) | |
| .locator("i") | |
| .click(); | |
| await page.getByText("e2e_automate").click(); | |
| await page | |
| .locator( | |
| '[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubectl_kubernetes_io_default_container"] [data-test="dashboard-add-y-data"]' | |
| ) | |
| .click(); | |
| await page | |
| .locator( | |
| '[data-test="field-list-item-logs-e2e_automate-kubernetes_annotations_kubernetes_io_psp"] [data-test="dashboard-add-b-data"]' | |
| ) | |
| .click(); | |
| await page.locator('[data-test="date-time-btn"]').click(); | |
| await page.locator('[data-test="date-time-relative-6-w-btn"]').click(); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| // await page.getByText('arrow_rightQueryAutoPromQLCustom SQL').click(); | |
| await page | |
| .locator('[data-test="logs-search-bar-show-query-toggle-btn"] img') | |
| .click(); | |
| // await page.locator('#fnEditor > .monaco-editor > .overflow-guard > div:nth-child(2) > .lines-content > .view-lines').click(); | |
| await page | |
| .locator('[data-test="dashboard-vrl-function-editor"]') | |
| .getByLabel("Editor content;Press Alt+F1") | |
| .fill(".vrl=123"); | |
| await page.waitForSelector('[data-test="dashboard-apply"]'); | |
| await page.locator('[data-test="dashboard-apply"]').click(); | |
| const locator = page.locator( | |
| '[data-test="field-list-item-logs-e2e_automate-vrl"]' | |
| ); | |
| // Get the locator and ensure it is visible | |
| await page | |
| .locator('[data-test="field-list-item-logs-e2e_automate-vrl"]') | |
| .waitFor({ state: "visible" }); | |
| }); |
There was a problem hiding this comment.
Actionable comments posted: 49
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (4)
- .github/workflows/playwright.yml (1 hunks)
- tests/ui-testing/playwright-tests/dashboard.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/visualize.spec.js (1 hunks)
- tests/ui-testing/playwright-tests/vrl.spec.js (1 hunks)
Files skipped from review as they are similar to previous changes (1)
- .github/workflows/playwright.yml
Additional context used
Path-based instructions (3)
tests/ui-testing/playwright-tests/visualize.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/vrl.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
Pattern
**/*.js: You are a smart javascript/typescript pull request reviewer.
You are going to review all the javascript/typescript files.
Be concise, and add a brief explanation to your suggestionsMake sure the responses are not too verbose and keep the suggestions to the point i.e. actionable.
Biome
tests/ui-testing/playwright-tests/visualize.spec.js
[error] 39-39: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/vrl.spec.js
[error] 56-56: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
tests/ui-testing/playwright-tests/dashboard.spec.js
[error] 55-55: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
Additional comments not posted (2)
tests/ui-testing/playwright-tests/dashboard.spec.js (1)
1-3: Optimize imports.Consider consolidating the imports from the same module.
- import logData from "../../ui-testing/cypress/fixtures/log.json"; - import logsdata from "../../test-data/logs_data.json"; + import logData from "../../ui-testing/cypress/fixtures/log.json"; + import logsdata from "../../test-data/logs_data.json";Likely invalid or redundant comment.
tests/ui-testing/playwright-tests/visualize.spec.js (1)
245-245: Replace hardcoded timeout with element-specific wait.Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(2000); + await page.waitForSelector('[data-test="logs-search-bar-refresh-btn"]');Likely invalid or redundant comment.
| test.beforeEach(async ({ page }) => { | ||
| console.log("running before each"); | ||
| await login(page); | ||
|
|
||
| // just to make sure org is set | ||
| const orgNavigation = page.goto( | ||
| `${logData.logsUrl}?org_identifier=${process.env["ORGNAME"]}` | ||
| ); | ||
|
|
||
| // ("ingests logs via API", () => { | ||
| const orgId = process.env["ORGNAME"]; | ||
| const streamName = "e2e_automate"; | ||
| const basicAuthCredentials = Buffer.from( | ||
| `${process.env["ZO_ROOT_USER_EMAIL"]}:${process.env["ZO_ROOT_USER_PASSWORD"]}` | ||
| ).toString("base64"); | ||
|
|
||
| const headers = { | ||
| Authorization: `Basic ${basicAuthCredentials}`, | ||
| "Content-Type": "application/json", | ||
| }; | ||
|
|
||
| // const logsdata = {}; // Fill this with your actual data | ||
|
|
||
| const fetchResponse = await fetch( | ||
| `${process.env.INGESTION_URL}/api/${orgId}/${streamName}/_json`, | ||
| { | ||
| method: "POST", | ||
| headers: headers, | ||
| body: JSON.stringify(logsdata), | ||
| } | ||
| ); | ||
| const response = await fetchResponse.json(); | ||
|
|
||
| await orgNavigation; | ||
|
|
||
| // Making a POST request using fetch API | ||
| // const response = await page.evaluate( | ||
| // async ({ url, headers, orgId, streamName, logsdata }) => { | ||
| // const fetchResponse = await fetch( | ||
| // `${url}/api/${orgId}/${streamName}/_json`, | ||
| // { | ||
| // method: "POST", | ||
| // headers: headers, | ||
| // body: JSON.stringify(logsdata), | ||
| // } | ||
| // ); | ||
| // return await fetchResponse.json(); | ||
| // }, | ||
| // { | ||
| // url: process.env.INGESTION_URL, | ||
| // headers: headers, | ||
| // orgId: orgId, | ||
| // streamName: streamName, | ||
| // logsdata: logsdata, | ||
| // } | ||
| // ); | ||
|
|
||
| console.log(response); | ||
| // }); | ||
| // const allorgs = page.waitForResponse("**/api/default/organizations**"); | ||
| // const functions = page.waitForResponse("**/api/default/functions**"); | ||
| // await page.goto( | ||
| // `${logData.logsUrl}?org_identifier=${process.env["ORGNAME"]}` | ||
| // ); | ||
| // const allsearch = page.waitForResponse("**/api/default/_search**"); | ||
| // await selectStreamAndStreamTypeForLogs(page, logData.Stream); | ||
| // await applyQueryButton(page); | ||
| // const streams = page.waitForResponse("**/api/default/streams**"); | ||
| }); |
There was a problem hiding this comment.
Remove commented-out code.
The commented-out code in the test.beforeEach block should be removed to improve readability.
- // let logData;
- // tebefore(async function () {
- // // logData("log");
- // // const data = page;
- // // logData = data;
- // // console.log("--logData--", logData);
- // });Committable suggestion was skipped due to low confidence.
| test("should redirect to the list of dashboard pages when discarding changes", async ({ | ||
| page, | ||
| }) => { | ||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page); | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page | ||
| .locator('[data-test="add-dashboard-name"]') | ||
| .fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
|
|
||
| await page | ||
| .locator('[data-test="dashboard-if-no-panel-add-panel-btn"]') | ||
| .click(); | ||
| await page | ||
| .locator("label") | ||
| .filter({ hasText: "Streamarrow_drop_down" }) | ||
| .locator("i") | ||
| .click(); | ||
| await page.getByText("e2e_automate").click(); | ||
|
|
||
| await page | ||
| .locator( | ||
| '[data-test="field-list-item-logs-e2e_automate-kubernetes_container_image"] [data-test="dashboard-add-b-data"]' | ||
| ) | ||
| .click(); | ||
| await page | ||
| .locator( | ||
| '[data-test="field-list-item-logs-e2e_automate-kubernetes_docker_id"] [data-test="dashboard-add-y-data"]' | ||
| ) | ||
| .click(); | ||
| await page.locator('[data-test="dashboard-apply"]').click(); | ||
|
|
||
| page.once("dialog", (dialog) => { | ||
| console.log(`Dialog message: ${dialog.message()}`); | ||
| dialog.dismiss().catch(() => {}); | ||
| }); | ||
| await page.locator('[data-test="dashboard-panel-discard"]').click(); | ||
|
|
||
| // await expect(page.getByText('Start by adding your first')).toBeVisible(); | ||
| }); |
There was a problem hiding this comment.
Add assertion to verify redirection after discarding changes.
Consider adding an assertion to verify that the user was redirected to the list of dashboard pages after discarding changes.
+ await expect(page.getByText("Redirected to dashboard list successfully.")).toBeVisible({ timeout: 30000 });Committable suggestion was skipped due to low confidence.
| test.describe("dashboard UI testcases", () => { | ||
| // let logData; | ||
| function removeUTFCharacters(text) { | ||
| // console.log(text, "tex"); | ||
| // Remove UTF characters using regular expression | ||
| return text.replace(/[^\x00-\x7F]/g, " "); | ||
| } |
There was a problem hiding this comment.
Fix the regular expression to avoid control characters.
The regular expression contains control characters, which can be problematic.
- return text.replace(/[^\x00-\x7F]/g, " ");
+ return text.replace(/[^\u0000-\u007F]/g, " ");Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test.describe("dashboard UI testcases", () => { | |
| // let logData; | |
| function removeUTFCharacters(text) { | |
| // console.log(text, "tex"); | |
| // Remove UTF characters using regular expression | |
| return text.replace(/[^\x00-\x7F]/g, " "); | |
| } | |
| test.describe("dashboard UI testcases", () => { | |
| // let logData; | |
| function removeUTFCharacters(text) { | |
| // console.log(text, "tex"); | |
| // Remove UTF characters using regular expression | |
| return text.replace(/[^\u0000-\u007F]/g, " "); | |
| } |
Tools
Biome
[error] 55-55: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
| test("should create a new dashboar", async ({ page }) => { | ||
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | ||
| await waitForDashboardPage(page); | ||
| await page.locator('[data-test="dashboard-add"]').click(); | ||
| await page.locator('[data-test="add-dashboard-name"]').click(); | ||
| await page | ||
| .locator('[data-test="add-dashboard-name"]') | ||
| .fill(randomDashboardName); | ||
| await page.locator('[data-test="dashboard-add-submit"]').click(); | ||
| await expect(page.getByText("Dashboard added successfully.")).toBeVisible({ | ||
| timeout: 30000, | ||
| }); | ||
| }); |
There was a problem hiding this comment.
Fix typo in test name.
The test name contains a typo ("dashboar" instead of "dashboard").
- test("should create a new dashboar", async ({ page }) => {
+ test("should create a new dashboard", async ({ page }) => {Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test("should create a new dashboar", async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page | |
| .locator('[data-test="add-dashboard-name"]') | |
| .fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText("Dashboard added successfully.")).toBeVisible({ | |
| timeout: 30000, | |
| }); | |
| }); | |
| test("should create a new dashboard", async ({ page }) => { | |
| await page.locator('[data-test="menu-link-\\/dashboards-item"]').click(); | |
| await waitForDashboardPage(page); | |
| await page.locator('[data-test="dashboard-add"]').click(); | |
| await page.locator('[data-test="add-dashboard-name"]').click(); | |
| await page | |
| .locator('[data-test="add-dashboard-name"]') | |
| .fill(randomDashboardName); | |
| await page.locator('[data-test="dashboard-add-submit"]').click(); | |
| await expect(page.getByText("Dashboard added successfully.")).toBeVisible({ | |
| timeout: 30000, | |
| }); | |
| }); |
| async function waitForDashboardPage(page) { | ||
| const dashboardListApi = page.waitForResponse( | ||
| (response) => | ||
| /\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200 | ||
| ); | ||
|
|
||
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**"); | ||
|
|
||
| await page.waitForSelector(`text="Please wait while loading dashboards..."`, { | ||
| state: "hidden", | ||
| }); | ||
| await dashboardListApi; | ||
| await page.waitForTimeout(500); | ||
| } |
There was a problem hiding this comment.
Enhance waitForDashboardPage function with error handling.
The waitForDashboardPage function lacks error handling. Consider adding try-catch blocks to handle potential errors during the waiting process.
+ async function waitForDashboardPage(page) {
+ try {
const dashboardListApi = page.waitForResponse((response) => /\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200);
await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**");
await page.waitForSelector(`text="Please wait while loading dashboards..."`, { state: "hidden" });
await dashboardListApi;
await page.waitForTimeout(500);
+ } catch (error) {
+ console.error("Waiting for dashboard page failed:", error);
+ }
+ }Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| async function waitForDashboardPage(page) { | |
| const dashboardListApi = page.waitForResponse( | |
| (response) => | |
| /\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200 | |
| ); | |
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**"); | |
| await page.waitForSelector(`text="Please wait while loading dashboards..."`, { | |
| state: "hidden", | |
| }); | |
| await dashboardListApi; | |
| await page.waitForTimeout(500); | |
| } | |
| async function waitForDashboardPage(page) { | |
| try { | |
| const dashboardListApi = page.waitForResponse( | |
| (response) => | |
| /\/api\/.+\/dashboards/.test(response.url()) && response.status() === 200 | |
| ); | |
| await page.waitForURL(process.env["ZO_BASE_URL"] + "/web/dashboards**"); | |
| await page.waitForSelector(`text="Please wait while loading dashboards..."`, { | |
| state: "hidden", | |
| }); | |
| await dashboardListApi; | |
| await page.waitForTimeout(500); | |
| } catch (error) { | |
| console.error("Waiting for dashboard page failed:", error); | |
| } | |
| } |
| .fill( | ||
| ".percentage , err=.histogram *.kubernetes_annotations_kubectl_kubernetes_io_default_container/ 100" | ||
| ); | ||
| await page.waitForTimeout(3000); |
There was a problem hiding this comment.
Replace hardcoded timeout with element-specific wait.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(3000);
+ await page.waitForSelector('[data-test="dashboard-apply"]');Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| await page.waitForTimeout(3000); | |
| await page.waitForSelector('[data-test="dashboard-apply"]'); |
| function removeUTFCharacters(text) { | ||
| // console.log(text, "tex"); | ||
| // Remove UTF characters using regular expression | ||
| return text.replace(/[^\x00-\x7F]/g, " "); |
There was a problem hiding this comment.
Fix regular expression to remove unexpected control character.
The regular expression contains an unexpected control character and should be corrected.
- return text.replace(/[^\x00-\x7F]/g, " ");
+ return text.replace(/[^\x20-\x7E]/g, " ");Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| return text.replace(/[^\x00-\x7F]/g, " "); | |
| return text.replace(/[^\x20-\x7E]/g, " "); |
Tools
Biome
[error] 56-56: Unexpected control character(s) in regular expression: \x00
Control characters are unusual and potentially incorrect inputs, so they are disallowed.
(lint/suspicious/noControlCharactersInRegex)
| state: "hidden", | ||
| }); | ||
| await dashboardListApi; | ||
| await page.waitForTimeout(500); |
There was a problem hiding this comment.
Replace hardcoded timeout with element-specific wait.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(500);
+ await page.waitForSelector('text="Please wait while loading dashboards..."', { state: "hidden" });Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| await page.waitForTimeout(500); | |
| await page.waitForSelector('text="Please wait while loading dashboards..."', { state: "hidden" }); |
| // click on the run query button | ||
| // Type the value of a variable into an input field | ||
| const search = page.waitForResponse(logData.applyQuery); | ||
| await page.waitForTimeout(3000); |
There was a problem hiding this comment.
Replace hardcoded timeout with element-specific wait.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(3000);
+ await page.waitForSelector("[data-test='logs-search-bar-refresh-btn']");Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| await page.waitForTimeout(3000); | |
| await page.waitForSelector("[data-test='logs-search-bar-refresh-btn']"); |
|
|
||
| //await page.locator('[data-test="dashboard-vrl-function-editor"]').getByLabel('Editor content;Press Alt+F1').fill('.percenteage1 ,err = .kubernetes_annotations_kubectl_kubernetes_io_default_container * .kubernetes_container_hash / 100\ .percenteage2 ,err = .kubernetes_annotations_kubectl_kubernetes_io_default_container / .kubernetes_container_hash * 100 \n'); | ||
|
|
||
| await page.waitForTimeout(2000); |
There was a problem hiding this comment.
Replace hardcoded timeout with element-specific wait.
Hardcoded timeouts can lead to flaky tests. Use element-specific waits for better reliability.
- await page.waitForTimeout(2000);
+ await page.waitForSelector('[data-test="dashboard-apply"]');Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| await page.waitForTimeout(2000); | |
| await page.waitForSelector('[data-test="dashboard-apply"]'); |
<!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Expanded automated testing coverage by adding new UI test files for dashboard management and logging visualization functionalities. - Enhanced dashboard UI tests now cover creating, modifying, duplicating, and applying filters to dashboards. - Introduced tests for verifying user interactions with logging visualizations, including error handling and data persistence. - Added tests for Virtual Reference Language (VRL) features within the dashboard, validating function applications and error handling. - **Bug Fixes** - Improved error handling in UI tests to ensure that invalid inputs trigger appropriate error messages. - **Tests** - Comprehensive test cases implemented for various user interactions across new features, ensuring functionality works as intended. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
Summary by CodeRabbit
New Features
Bug Fixes
Tests