diff --git a/frontend/playwright/ui/visual-specs/visual-dashboard.spec.js b/frontend/playwright/ui/visual-specs/visual-dashboard.spec.js index 932ebb7061..4fa236a8b6 100644 --- a/frontend/playwright/ui/visual-specs/visual-dashboard.spec.js +++ b/frontend/playwright/ui/visual-specs/visual-dashboard.spec.js @@ -947,3 +947,54 @@ test.describe("Context notification", () => { await expect(warning).toHaveScreenshot(shot); }); }); + +test.describe("Download report", () => { + test("Error page and feedback page links", async ({ page }) => { + const shot = { maxDiffPixelRatio: 0, threshold: 0 }; + await DashboardPage.mockConfigFlags(page, [ + "disable-onboarding", + "enable-user-feedback", + ]); + const dashboardPage = new DashboardPage(page); + await dashboardPage.setupDashboardFull(); + await page.route("**/api/main/methods/get-projects?*", (route) => + route.fulfill({ + status: 500, + contentType: "application/transit+json", + body: '["^ ","~:type","~:server-error","~:code","~:unexpected"]', + }), + ); + await page.goto( + `/?screen=dashboard-recent&team-id=${DashboardPage.anyTeamId}`, + ); + + const errorLink = page.getByText("Download report.txt", { exact: true }); + await expect(errorLink).toBeVisible(); + await page.mouse.move(10, 10); + await expect(errorLink).toHaveScreenshot(shot); + await errorLink.hover(); + await expect(errorLink).toHaveScreenshot(shot); + + const errorDownload = page.waitForEvent("download"); + await errorLink.focus(); + await page.keyboard.press("Enter"); + expect((await errorDownload).suggestedFilename()).toBe("report.txt"); + + await page.getByRole("button", { name: "Contact support" }).click(); + const feedbackLink = page.getByText("Download report.txt", { + exact: true, + }); + await expect(page.getByText("Send")).toBeVisible(); + await page.mouse.move(10, 700); + await expect(feedbackLink).toHaveScreenshot(shot); + await feedbackLink.hover(); + await expect(feedbackLink).toHaveScreenshot(shot); + + const feedbackDownload = page.waitForEvent("download"); + await feedbackLink.focus(); + await page.keyboard.press("Enter"); + expect((await feedbackDownload).suggestedFilename()).toBe("report.txt"); + // The button is in the feedback form: Enter must not send it. + await expect(page.getByText("Send", { exact: true })).toBeVisible(); + }); +}); diff --git a/frontend/src/app/main/ui/settings/feedback.cljs b/frontend/src/app/main/ui/settings/feedback.cljs index b5a1a88373..70ed8999d8 100644 --- a/frontend/src/app/main/ui/settings/feedback.cljs +++ b/frontend/src/app/main/ui/settings/feedback.cljs @@ -131,7 +131,9 @@ :show-success? true}] (when report - [:a {:class (stl/css :link :download-button) :on-click on-download} + [:button {:type "button" + :class (stl/css :link :download-button) + :on-click on-download} (tr "labels.download" "report.txt")])] [:> fm/submit-button* diff --git a/frontend/src/app/main/ui/settings/feedback.scss b/frontend/src/app/main/ui/settings/feedback.scss index aee1490e20..d38c897861 100644 --- a/frontend/src/app/main/ui/settings/feedback.scss +++ b/frontend/src/app/main/ui/settings/feedback.scss @@ -81,5 +81,11 @@ display: inline-block; min-inline-size: $sz-160; text-align: center; + background: none; + cursor: pointer; + + &:hover { + text-decoration: underline; + } } } diff --git a/frontend/src/app/main/ui/static.cljs b/frontend/src/app/main/ui/static.cljs index b801e379c2..ff3b460028 100644 --- a/frontend/src/app/main/ui/static.cljs +++ b/frontend/src/app/main/ui/static.cljs @@ -429,7 +429,10 @@ [:p {:class (stl/css :desc-text)} (tr "labels.internal-error.desc-message-second")]] (when (some? report) - [:a {:class (stl/css :download-link) :on-click on-download} (tr "labels.download" "report.txt")]) + [:button {:type "button" + :class (stl/css :download-link) + :on-click on-download} + (tr "labels.download" "report.txt")]) [:div {:class (stl/css :buttons-container)} [:> button* {:variant "secondary" diff --git a/frontend/src/app/main/ui/static.scss b/frontend/src/app/main/ui/static.scss index 3f1b7c81a9..d53ae93f87 100644 --- a/frontend/src/app/main/ui/static.scss +++ b/frontend/src/app/main/ui/static.scss @@ -208,6 +208,14 @@ color: var(--color-foreground-primary); text-transform: lowercase; + background: none; + border: none; + padding: 0; + cursor: pointer; + + &:hover { + text-decoration: underline; + } } .sign-info {