diff --git a/web/src/components/core/IssuesDrawer.test.tsx b/web/src/components/core/IssuesDrawer.test.tsx index 4d4c9bd195..4dfb14245a 100644 --- a/web/src/components/core/IssuesDrawer.test.tsx +++ b/web/src/components/core/IssuesDrawer.test.tsx @@ -60,7 +60,14 @@ describe("IssuesDrawer", () => { describe("when there are installation issues", () => { beforeEach(() => { mockIssuesList = new IssuesList( - [], + [ + { + description: "Registration Fake Issue", + source: 0, + severity: 0, + details: "Registration Fake Issue details", + }, + ], [ { description: "Software Fake Issue", @@ -97,6 +104,7 @@ describe("IssuesDrawer", () => { it("renders the drawer with categorized issues linking to their scope", async () => { const { user } = installerRender(); + const registrationIssues = screen.getByRole("region", { name: "Registration" }); const softwareIssues = screen.getByRole("region", { name: "Software" }); const storageIssues = screen.getByRole("region", { name: "Storage" }); const usersIssues = screen.getByRole("region", { name: "Users" }); @@ -114,6 +122,14 @@ describe("IssuesDrawer", () => { expect(usersLink).toHaveAttribute("href", "/users"); within(usersIssues).getByText("Users Fake Issue"); + // Regression test: right now, registration issues comes under product + // scope. Check that it links to registration section anyway. + const registrationLink = within(registrationIssues).getByRole("link", { + name: "Registration", + }); + expect(registrationLink).toHaveAttribute("href", "/registration"); + within(registrationIssues).getByText("Registration Fake Issue"); + // onClose should be called when user clicks on a section too for ensuring // drawer gets closed even when navigation is not needed. await user.click(usersLink); diff --git a/web/src/components/core/IssuesDrawer.tsx b/web/src/components/core/IssuesDrawer.tsx index 13d3ae31c2..8fcef222e9 100644 --- a/web/src/components/core/IssuesDrawer.tsx +++ b/web/src/components/core/IssuesDrawer.tsx @@ -68,13 +68,14 @@ const IssuesDrawer = forwardRef(({ onClose }: { onClose: () => void }, ref) => { if (issues.length === 0) return null; // FIXME: address this better or use the /product(s)? namespace instead of // /registration. + const section = scope === "product" ? "registration" : scope; const ariaLabelId = `${scope}-issues-section`; return (

- + {scopeHeaders[scope]}