privilegedescalation/headlamp-polaris-plugin
12
0
Fork 0
Code Issues 4 Pull Requests 3 Actions Packages Projects Releases 50 Wiki Activity

fix(e2e): use client-side routing for settings navigation

Browse Source 
The PluginSettings component reads the plugin registry once on mount
and never re-renders when new plugins register. Using page.goto() for
the settings URL re-initializes the SPA, causing PluginSettings to
mount before async plugin scripts finish calling registerPluginSettings().

Replace page.goto() with pushState + popstate to do client-side routing.
This preserves the already-loaded plugin registrations from the main
page, so PluginSettings sees the plugin immediately on mount.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
Gandalf the Greybeard
2026-03-17 22:42:41 +00:00
parent 4844e9667d
commit 1161fbcc4d
1 changed files with 14 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
e2e/settings.spec.ts
+14 -6
View File
@@ -2,10 +2,12 @@ import { test, expect, Page } from '@playwright/test';
/** Navigate to the Polaris plugin settings page and wait for settings to render. */
async function goToPolarisSettings(page: Page) {
// Load the main page first so Headlamp fetches the plugin list and stores
// it in localStorage (headlampPluginSettings). The PluginSettings component
// initializes its state from localStorage on mount, so the data must already
// be there before we navigate to the settings page.
// Load the main page first so all plugin scripts execute and call
// registerPluginSettings(). Headlamp loads plugins asynchronously — the
// PluginSettings component reads the plugin registry once on mount and
// never re-renders when new plugins register. A full page.goto() to the
// settings URL would re-initialize the SPA, causing PluginSettings to
// mount before plugin scripts finish executing.
await page.goto('/');
const sidebar = page.getByRole('navigation', { name: 'Navigation' });
await expect(sidebar).toBeVisible({ timeout: 15_000 });
@@ -13,8 +15,14 @@ async function goToPolarisSettings(page: Page) {
timeout: 15_000,
});
// Now navigate to plugin settings — localStorage has the plugin list
await page.goto('/c/main/settings/plugins');
// Navigate to plugin settings via client-side routing (pushState + popstate)
// instead of page.goto(). This preserves the already-loaded plugin scripts
// and their registerPluginSettings() registrations. React Router's history
// listener picks up the popstate event and re-renders with the new route.
await page.evaluate(() => {
window.history.pushState({}, '', '/c/main/settings/plugins');
window.dispatchEvent(new PopStateEvent('popstate', { state: {} }));
});
// Find and click the Polaris plugin entry to open its settings
const pluginEntry = page.locator('text=headlamp-polaris').first();