Files
openobserve/tests/ui-testing
ktx-akshay 89cc402d64 test: add dashboard visualize test cases (#8303)
### **PR Type**
Tests, Enhancement


___

### **Description**
- Add visualize error message test

- Add quick mode toggle verification

- Use enhanced base fixtures for tests

- Enable visualize spec in CI workflow


___

### Diagram Walkthrough


```mermaid
flowchart LR
  Tests["Visualize tests updated"] -- "use" --> Fixtures["Enhanced base fixtures"]
  Tests -- "verify" --> ErrorMsg["Aggregation alias error message"]
  Tests -- "verify" --> QuickMode["Quick mode toggle true"]
  CI["Playwright workflow"] -- "enable" --> VisualizeSpec["visualize.spec.js run"]
```



<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>Add helper to verify
quick mode toggle</code>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; </dd></summary>
<hr>

tests/ui-testing/pages/dashboardPages/visualise.js

<ul><li>Add quick mode toggle verification helper<br> <li> Check
aria-checked and CSS class</ul>


</details>


  </td>
<td><a
href="https://github.com/openobserve/openobserve/pull/8303/files#diff-c14ac1db3e4aa86190d7525e8e38c410bcbbae7f46b01890e74937cc11be67e6">+37/-0</a>&nbsp;
&nbsp; </td>

</tr>

<tr>
  <td>
    <details>
<summary><strong>page-manager.js</strong><dd><code>Export PageManager
default for imports</code>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; </dd></summary>
<hr>

tests/ui-testing/pages/page-manager.js

- Export PageManager as default


</details>


  </td>
<td><a
href="https://github.com/openobserve/openobserve/pull/8303/files#diff-565eab8b3c767ae50c9d05e591621d14f66b81af84d6b5ea6efe136c1c3933df">+1/-1</a>&nbsp;
&nbsp; &nbsp; </td>

</tr>
</table></td></tr><tr><td><strong>Tests</strong></td><td><table>
<tr>
  <td>
    <details>
<summary><strong>visualize.spec.js</strong><dd><code>Extend visualize
e2e tests and base setup</code>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
</dd></summary>
<hr>

tests/ui-testing/playwright-tests/dashboards/visualize.spec.js

<ul><li>Switch to enhanced base fixtures<br> <li> Add test for
aggregation alias error<br> <li> Add test for quick mode toggle true<br>
<li> Improve navigation and waits</ul>


</details>


  </td>
<td><a
href="https://github.com/openobserve/openobserve/pull/8303/files#diff-d144f23552ec150db375c89e52c3a53ede9ff3fa5dcd6092694fbe0a308d22ec">+79/-8</a>&nbsp;
&nbsp; </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 spec
in CI</code>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; </dd></summary>
<hr>

.github/workflows/playwright.yml

- Enable visualize.spec.js in workflow run list


</details>


  </td>
<td><a
href="https://github.com/openobserve/openobserve/pull/8303/files#diff-7afcd2d8f7b49bda74843f209eefb7b2da45f7e7803bf2e4bd636699b76aa2d3">+1/-1</a>&nbsp;
&nbsp; &nbsp; </td>

</tr>
</table></td></tr></tr></tbody></table>

</details>

___
2025-09-06 17:40:07 +05:30
..
2024-11-13 15:13:36 +05:30

zinc-observe-ui-automation

Playwright UI Testing

Installation

npm install

Running Tests

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:

  1. Playwright Runner UI - Set environment variables through the web interface
  2. Environment Variables - Set variables in terminal or .env file