mirror of
https://github.com/openobserve/openobserve.git
synced 2026-11-04 00:08:55 +00:00
Sai Nikhil
244c9547a7
### **User description** This PR covers the issues mentioned in #8692 ___ ### **PR Type** Bug fix ___ ### **Description** - Restore zoom controls in pipeline UI - Remove redundant back button in editor - Set default zoom level to 0.8 ___ ### Diagram Walkthrough ```mermaid flowchart LR Editor["PipelineEditor.vue header"] -- "remove back button, adjust padding" --> UI["Cleaner editor UI"] View["PipelineView.vue"] -- "add Controls & styles" --> ZoomControls["Zoom/Fit UI restored"] Flow["PipelineFlow.vue"] -- "default zoom 0.8" --> Viewport["Improved initial viewport"] ``` <details> <summary><h3> File Walkthrough</h3></summary> <table><thead><tr><th></th><th align="left">Relevant files</th></tr></thead><tbody><tr><td><strong>Bug fix</strong></td><td><table> <tr> <td> <details> <summary><strong>PipelineEditor.vue</strong><dd><code>Remove redundant back button from editor header</code> </dd></summary> <hr> web/src/components/pipeline/PipelineEditor.vue <ul><li>Remove left-side back button container<br> <li> Add left padding class to header container</ul> </details> </td> <td><a href="https://github.com/openobserve/openobserve/pull/8714/files#diff-68c21f647336067eb79737ce9aca2d49632f2fa1c0878bcfdae55607e3473a15">+1/-15</a> </td> </tr> <tr> <td> <details> <summary><strong>PipelineFlow.vue</strong><dd><code>Set pipeline default zoom to 0.8</code> </dd></summary> <hr> web/src/plugins/pipelines/PipelineFlow.vue - Adjust default viewport zoom from 1.5 to 0.8 </details> </td> <td><a href="https://github.com/openobserve/openobserve/pull/8714/files#diff-9c7475a54f0c895dd49eb0c5b53fe0a76ceff0520f667a9cb065b364557ced50">+1/-1</a> </td> </tr> </table></td></tr><tr><td><strong>Enhancement</strong></td><td><table> <tr> <td> <details> <summary><strong>PipelineView.vue</strong><dd><code>Reintroduce Vue Flow controls for zoom/fit</code> </dd></summary> <hr> web/src/components/pipeline/PipelineView.vue <ul><li>Import Controls and ControlButton from @vue-flow/controls<br> <li> Import controls stylesheet<br> <li> Register Controls and ControlButton as components</ul> </details> </td> <td><a href="https://github.com/openobserve/openobserve/pull/8714/files#diff-a71732cf7f8ee768e21f7eb2bf9eeed4ac67ba8221cca2e8d347d8acb27d4471">+3/-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