Fix flaky phpMyAdmin test

Author: JanJakes

packages/playground/website/playwright/e2e/website-ui.spec.ts

@@ -450,18 +450,30 @@ test.describe('Database panel', () => {
 		await expect(newPage.locator('body')).toContainText('phpMyAdmin');
 		await expect(newPage.locator('body')).toContainText('wp_posts');
 
+		/*
+		 * Before navigating to a page in phpMyAdmin, we need to wait for jQuery
+		 * to be ready to prevent clicking a link before listeners are attached.
+		 * This prevents flaky tests (mainly in Firefox).
+		 */
+		const waitForAjaxHandlers = async () =>
+			newPage.waitForFunction(
+				() => (window as any)?.jQuery?.isReady ?? false
+			);
+
 		// Browse the "wp_posts" table
 		const wpPostsRow = newPage
 			.locator('tr')
 			.filter({ hasText: 'wp_posts' })
 			.first();
 		await expect(wpPostsRow).toBeVisible({ timeout: 10000 });
+		await waitForAjaxHandlers();
 		await wpPostsRow.getByRole('link', { name: 'Browse' }).click();
 		await newPage.waitForLoadState();
 		const pmaRows = newPage.locator('table.table_results tbody tr');
 		await expect(pmaRows.first()).toContainText('Welcome to WordPress.');
 
 		// Click "edit" on a row
+		await waitForAjaxHandlers();
 		await pmaRows
 			.first()
 			.getByRole('link', { name: 'Edit' })