mirror of
https://github.com/openobserve/openobserve.git
synced 2026-11-04 16:09:05 +00:00
ktx-akshay
4fef360f1d
### **PR Type**
Tests
___
### **Description**
- Add comprehensive Column Order tests for PromQL table chart
- Covers P0 critical, P1 functional, P2 edge-case scenarios
- Implement helpers for chart setup and column extraction
- Update CI workflow to include new spec
___
### Diagram Walkthrough
```mermaid
flowchart LR
A["Metrics Page"] --> B["Table Chart Setup"]
B --> C["Column Order Button"]
C --> D["Column Order Popup"]
D --> E["Reorder & Persist Tests"]
E --> F["Edge Cases Validation"]
G["CI Workflow"] --> H["Run new 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>Tests</strong></td><td><table>
<tr>
<td>
<details>
<summary><strong>metrics-table-column-order.spec.js</strong><dd><code>Comprehensive
column order tests</code>
</dd></summary>
<hr>
tests/ui-testing/playwright-tests/Metrics/metrics-table-column-order.spec.js
<ul><li>Added new test suite for column ordering feature<br> <li>
Defined setupTableChart and extractColumnName helpers<br> <li> Verified
button visibility, popup UI, and drag handles<br> <li> Tested reorder,
save, cancel, and persistence flows</ul>
</details>
</td>
<td><a
href="https://github.com/openobserve/openobserve/pull/10243/files#diff-0c32a7a918a4ff834070d063782fe263da7a4891230229579156f436474f0024">+1104/-0</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>Include new spec in CI
workflow</code>
</dd></summary>
<hr>
.github/workflows/playwright.yml
<ul><li>Added new spec to <code>run_files</code> list<br> <li> Ensures
CI runs metrics-table-column-order tests</ul>
</details>
</td>
<td><a
href="https://github.com/openobserve/openobserve/pull/10243/files#diff-7afcd2d8f7b49bda74843f209eefb7b2da45f7e7803bf2e4bd636699b76aa2d3">+1/-0</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