mirror of
https://github.com/openobserve/openobserve.git
synced 2026-11-05 00:09:35 +00:00
ktx-akshay
8fb78048ec
### **PR Type**
Tests, Enhancement
___
### **Description**
- Add robust visualize E2E tests
- Introduce dashboard helpers and verifications
- Improve page object with new locators
- Enable visualize spec in CI workflow
___
### Diagram Walkthrough
```mermaid
flowchart LR
PO["Page Object: visualise.js"] -- "new helpers, locators" --> SPEC["Tests: visualize.spec.js"]
SPEC -- "uses helpers to validate charts & dashboards" --> DASH["Dashboard flows"]
WF["CI Workflow"] -- "enable" --> SPEC
```
<details> <summary><h3> File Walkthrough</h3></summary>
<table><thead><tr><th></th><th align="left">Relevant
files</th></tr></thead><tbody><tr><td><strong>Enhancement</strong></td><td><table>
<tr>
<td>
<details>
<summary><strong>visualise.js</strong><dd><code>Page object extended
with dashboard and chart helpers</code>
</dd></summary>
<hr>
tests/ui-testing/pages/dashboardPages/visualise.js
<ul><li>Import expect from Playwright<br> <li> Add dashboard and query
editor locators<br> <li> Add helpers: fillLogsQueryEditor,
checkDashboardErrors, <br>verifyChartRenders, verifyChartTypeSelected,
addPanelToNewDashboard<br> <li> Update stream index toggle selector and
refine <br>runQueryAndWaitForCompletion</ul>
</details>
</td>
<td><a
href="https://github.com/openobserve/openobserve/pull/8135/files#diff-c14ac1db3e4aa86190d7525e8e38c410bcbbae7f46b01890e74937cc11be67e6">+140/-7</a>
</td>
</tr>
</table></td></tr><tr><td><strong>Tests</strong></td><td><table>
<tr>
<td>
<details>
<summary><strong>visualize.spec.js</strong><dd><code>Comprehensive
visualize E2E tests and assertions</code>
</dd></summary>
<hr>
tests/ui-testing/playwright-tests/dashboards/visualize.spec.js
<ul><li>Add randomized dashboard/panel naming<br> <li> Add reusable SQL
queries and stream constants<br> <li> Add new tests for large datasets,
stream persistence, chart defaults, <br>dashboard query persistence, and
error-free chart switching<br> <li> Skip flaky/legacy tests and adjust
flows to use new helpers</ul>
</details>
</td>
<td><a
href="https://github.com/openobserve/openobserve/pull/8135/files#diff-d144f23552ec150db375c89e52c3a53ede9ff3fa5dcd6092694fbe0a308d22ec">+281/-459</a></td>
</tr>
</table></td></tr><tr><td><strong>Configuration
changes</strong></td><td><table>
<tr>
<td>
<details>
<summary><strong>playwright.yml</strong><dd><code>Enable visualize E2E
spec in CI</code>
</dd></summary>
<hr>
.github/workflows/playwright.yml
- Enable dashboards/visualize.spec.js in Playwright matrix
</details>
</td>
<td><a
href="https://github.com/openobserve/openobserve/pull/8135/files#diff-7afcd2d8f7b49bda74843f209eefb7b2da45f7e7803bf2e4bd636699b76aa2d3">+1/-1</a>
</td>
</tr>
</table></td></tr></tr></tbody></table>
</details>
___
zinc-observe-ui-automation
Playwright UI Testing
Installation
npm install
Running Tests
Using Playwright Runner UI (Recommended)
cd playwright-runner
npm start
Then open http://localhost:3000 to access the test runner interface.
Using Command Line
# Run all tests
npx playwright test
# Run specific test by tag
npx playwright test -g @alertsImportExport
# Run in headed mode
npx playwright test --headed
# Run specific test file
npx playwright test Alerts/alerts-import.spec.js
Environment Configuration
Tests can be configured using:
- Playwright Runner UI - Set environment variables through the web interface
- Environment Variables - Set variables in terminal or .env file