Refactor dashboard and query analytics tests for improved readability#852
Refactor dashboard and query analytics tests for improved readability#852travagliad wants to merge 3 commits intomainfrom
Conversation
…rafana.helper; robust route match + JSON headers; keep upgrade modal mock
| export async function suppressTour(page: Page): Promise<void> { | ||
| await page.route('**/v1/users/me**', async (route) => { | ||
| await route.fulfill({ | ||
| status: 200, | ||
| headers: { 'content-type': 'application/json' }, | ||
| body: JSON.stringify({ | ||
| user_id: 1, | ||
| product_tour_completed: true, | ||
| alerting_tour_completed: true, | ||
| snoozed_pmm_version: '3.2.0', | ||
| }), | ||
| }); | ||
| }); | ||
| } | ||
|
|
||
| static getToken(username = 'admin', password = process.env.ADMIN_PASSWORD || 'admin') { | ||
| return Buffer.from(`${username}:${password}`).toString('base64'); | ||
| } | ||
| export async function suppressUpgradeNotification(page: Page): Promise<void> { | ||
| await page.route('**/v1/server/updates?force=**', (route) => | ||
| route.fulfill({ | ||
| status: 200, | ||
| body: JSON.stringify({ | ||
| installed: {}, | ||
| last_check: new Date().toISOString(), | ||
| latest: {}, | ||
| update_available: false, | ||
| }), | ||
| }), | ||
| ); |
There was a problem hiding this comment.
I decided to move the suppress to grafana.helper.ts because it looks to me it serves the only purpose of navigating the UI and I thought it was the most appropriate file to be inserted too, please validate.
| async open(dashboardUrl: string, params: BuildUrlParameters) { | ||
| await super.open(dashboardUrl, params); | ||
| await this.loadAllPanels(); | ||
| } | ||
|
|
There was a problem hiding this comment.
This page (Dashboard), requires "loadAllPanels" after opening it, while QAN do not, it has it's own wait that I haven't touched, so I did this method overload to cover this case specifically (and not moving loadAllPanels to base.page.ts
If we decide to use loadAllPanels across all pages in PMM, I think we should move it to base.page.ts for less repetition so we won't need to overload open in every page we create.
| @@ -1,24 +1,54 @@ | |||
| import { Page } from '@playwright/test'; | |||
|
|
|||
| export default class GrafanaHelper { | |||
There was a problem hiding this comment.
Why are we removing class? It will get messy as previous JS tests.
There was a problem hiding this comment.
This is the result of not having class:
import { authorize, suppressTour, suppressUpgradeNotification } from '@helpers/grafana.helper';
...
loginUI: async ({ page }, use) => {
await suppressTour(page);
await suppressUpgradeNotification(page);
await authorize(page);
await use();
},
api: async ({ page, request }, use) => {
const inventoryApi = new Api(page, request);
await authorize(page);
await use(inventoryApi);
},
And this is using class:
import GrafanaHelper from '@helpers/grafana.helper';
...
loginUI: async ({ page }, use) => {
const grafanaHelper = new GrafanaHelper(page);
await grafanaHelper.suppressTour(page);
await grafanaHelper.suppressUpgradeNotification(page);
await grafanaHelper.authorize(page);
await use();
},
api: async ({ page, request }, use) => {
const grafanaHelper = new GrafanaHelper(page);
const inventoryApi = new Api(page, request);
await grafanaHelper.authorize(page);
await use(inventoryApi);
},
This is basically the only difference, I just thought the second was more readable but it's more of a style I think, we can use both if you think this is worsening the code complexity
There was a problem hiding this comment.
Important to note that using fixtures, the grafanaHelper should be only used in here (unless specific test cases that we want to unauthorize and reauthorize). So this loginUI fixture being used inside the other fixtures make spec files more clean (no beforeEach and stuff)
2 participants
Refactor the Grafana helper functions for better modularity and reusability. Suppress unnecessary tours during authorization and improve route matching in tests. Update tests to utilize the new helper methods for opening dashboards and verifying metrics.