root/sase.tr
1
0
Fork 0
Code Issues 5 Pull Requests 3 Actions 2 Packages Projects Releases Wiki Activity

feat(FN-252): fix 2 failing Popular badge tests — FeatureMatrix uses aria-label, not visible text
Some checks failed
Sync dev → Gitea / Mirror dev to Gitea (push) Has been cancelled
Details

Browse Source 
Commits merged:
- fix(FN-252): fix 2 failing Popular badge tests — FeatureMatrix uses aria-label, not visible text

Files changed:
.../subscription/__tests__/index.test.tsx          | 26 ++++++++--------------
 1 file changed, 9 insertions(+), 17 deletions(-)

Fusion-Task-Id: FN-252
This commit is contained in:
Fusion
2026-05-12 20:42:15 +00:00
parent 441be751c7
commit 396049a77a
1 changed files with 9 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
apps/web/src/routes/dashboard/subscription/__tests__/index.test.tsx
View File

@@ -337,23 +337,19 @@ describe("rendering", () => {
describe("popular plan visual dominance (P0-2)", () => {
it("brand2 (popular) card has stronger visual styling", () => {
renderPage();
// Two "subscription.popular" elements: one in plan card, one in FeatureMatrix
const popularBadges = screen.getAllByText("subscription.popular");
expect(popularBadges.length).toBe(2);
// Card badge has text-xs (not text-[10px] like FeatureMatrix)
const cardBadge = popularBadges.find(
(el) => el.className.includes("text-xs") && !el.className.includes("text-[10px]"),
)!;
// Popular badge only appears on the plan card (FeatureMatrix uses aria-label only)
const cardBadge = screen.getByText("subscription.popular");
expect(cardBadge.className).toContain("text-xs");
// The popular badge is inside a <Badge> element; walk up to the Card
const popularCard = cardBadge.closest('[class*="rounded-xl"]');
expect(popularCard).toBeTruthy();
expect(popularCard?.className).toContain("shadow-xl");
});
it("only one plan card has popular badge (2 total with FeatureMatrix)", () => {
it("only one plan card has popular badge", () => {
renderPage();
// 2 total: plan card + FeatureMatrix table header
expect(screen.getAllByText("subscription.popular").length).toBe(2);
// Only plan card renders the popular badge (FeatureMatrix uses aria-label only)
expect(screen.getAllByText("subscription.popular").length).toBe(1);
});
});
@@ -850,13 +846,9 @@ describe("accessibility", () => {
it("popular plan is distinguishable beyond color", () => {
renderPage();
// Two "subscription.popular" elements: plan card badge + FeatureMatrix badge
const popularBadges = screen.getAllByText("subscription.popular");
expect(popularBadges.length).toBeGreaterThanOrEqual(1);
// Card badge has text-xs (not text-[10px] like FeatureMatrix)
const cardBadge = popularBadges.find(
(el) => el.className.includes("text-xs") && !el.className.includes("text-[10px]"),
)!;
// Popular badge only appears on the plan card (FeatureMatrix uses aria-label only)
const cardBadge = screen.getByText("subscription.popular");
expect(cardBadge.className).toContain("text-xs");
const popularCard = cardBadge.closest('[class*="ring-2"]');
expect(popularCard).toBeTruthy();
});