Remove focus on feature grid section

This commit is contained in:
adilallo
2026-05-24 16:55:07 -06:00
parent b1ad3c6203
commit 59999b8211
6 changed files with 18 additions and 37 deletions
+13 -12
View File
@@ -46,20 +46,21 @@ describe("FeatureGrid (behavioral tests)", () => {
).toBeInTheDocument();
});
it("renders all four feature cards", () => {
it("renders all four feature cards as static tiles", () => {
render(<FeatureGrid title="Test" subtitle="Test" />);
expect(screen.getByText("Decision-making")).toBeInTheDocument();
expect(screen.getByText("Values alignment")).toBeInTheDocument();
expect(screen.getByText("Membership")).toBeInTheDocument();
expect(screen.getByText("Conflict resolution")).toBeInTheDocument();
expect(
screen.getByRole("link", { name: "Decision-making support tools" }),
).toBeInTheDocument();
expect(
screen.getByRole("link", { name: "Values alignment exercises" }),
).toBeInTheDocument();
expect(
screen.getByRole("link", { name: "Membership guidance resources" }),
).toBeInTheDocument();
expect(
screen.getByRole("link", { name: "Conflict resolution tools" }),
).toBeInTheDocument();
screen.queryByRole("link", { name: "Decision-making support tools" }),
).not.toBeInTheDocument();
});
it("does not apply a focus ring to the entire grid shell", () => {
render(<FeatureGrid title="Test" subtitle="Test" />);
const shell = document.querySelector('[data-figma-node="18847-22410"]');
expect(shell?.className).not.toContain("focus-within:ring-2");
});
it("has proper accessibility attributes", () => {
+3 -16
View File
@@ -129,24 +129,11 @@ test.describe("Critical User Journeys", () => {
featureSection.locator("text=Conflict resolution"),
).toBeVisible();
// Check feature links - Mini tiles render as <a> tags with href="#..."
// There are 4 feature cards + 1 "Learn more" link = 5 total links
// We check for the specific feature card links
// Feature tiles are presentational — only the lockup "Learn more" is a link
await expect(
featureSection.locator('a[href="#decision-making"]'),
).toBeVisible();
await expect(
featureSection.locator('a[href="#values-alignment"]'),
).toBeVisible();
await expect(
featureSection.locator('a[href="#membership-guidance"]'),
).toBeVisible();
await expect(
featureSection.locator('a[href="#conflict-resolution"]'),
).toBeVisible();
// Test feature card interactions
await page.locator('a[href="#decision-making"]').click();
).toHaveCount(0);
await expect(featureSection.getByRole("link", { name: "Learn more" })).toBeVisible();
});
test("header navigation functionality", async ({ page }) => {