Run Prettier
CI Pipeline / test (18) (pull_request) Successful in 4m51s
CI Pipeline / test (20) (pull_request) Successful in 4m57s
CI Pipeline / e2e (chromium) (pull_request) Failing after 5m28s
CI Pipeline / e2e (firefox) (pull_request) Successful in 8m35s
CI Pipeline / e2e (webkit) (pull_request) Failing after 6m0s
CI Pipeline / visual-regression (pull_request) Failing after 5m38s
CI Pipeline / performance (pull_request) Failing after 3m53s
CI Pipeline / lint (pull_request) Successful in 5m27s
CI Pipeline / storybook (pull_request) Successful in 7m6s
CI Pipeline / build (pull_request) Successful in 6m59s
CI Pipeline / test (18) (pull_request) Successful in 4m51s
CI Pipeline / test (20) (pull_request) Successful in 4m57s
CI Pipeline / e2e (chromium) (pull_request) Failing after 5m28s
CI Pipeline / e2e (firefox) (pull_request) Successful in 8m35s
CI Pipeline / e2e (webkit) (pull_request) Failing after 6m0s
CI Pipeline / visual-regression (pull_request) Failing after 5m38s
CI Pipeline / performance (pull_request) Failing after 3m53s
CI Pipeline / lint (pull_request) Successful in 5m27s
CI Pipeline / storybook (pull_request) Successful in 7m6s
CI Pipeline / build (pull_request) Successful in 6m59s
This commit is contained in:
@@ -60,7 +60,7 @@ test.describe("Accessibility Testing", () => {
|
|||||||
focusedElements.push(
|
focusedElements.push(
|
||||||
`${elementInfo.tagName}${
|
`${elementInfo.tagName}${
|
||||||
elementInfo.role ? `[role="${elementInfo.role}"]` : ""
|
elementInfo.role ? `[role="${elementInfo.role}"]` : ""
|
||||||
}: ${elementInfo.accessibleName}`
|
}: ${elementInfo.accessibleName}`,
|
||||||
);
|
);
|
||||||
|
|
||||||
await page.keyboard.press("Tab");
|
await page.keyboard.press("Tab");
|
||||||
@@ -190,7 +190,7 @@ test.describe("Accessibility Testing", () => {
|
|||||||
test("focus indicators - visible focus", async ({ page }) => {
|
test("focus indicators - visible focus", async ({ page }) => {
|
||||||
// Test that focus indicators are visible
|
// Test that focus indicators are visible
|
||||||
const focusableElements = page.locator(
|
const focusableElements = page.locator(
|
||||||
"button, a, input, textarea, select, [tabindex]"
|
"button, a, input, textarea, select, [tabindex]",
|
||||||
);
|
);
|
||||||
const elementCount = await focusableElements.count();
|
const elementCount = await focusableElements.count();
|
||||||
|
|
||||||
|
|||||||
@@ -28,42 +28,42 @@ test.describe("Footer responsive behavior", () => {
|
|||||||
|
|
||||||
// Test navigation links
|
// Test navigation links
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole("contentinfo").getByRole("link", { name: /use cases/i })
|
page.getByRole("contentinfo").getByRole("link", { name: /use cases/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole("contentinfo").getByRole("link", { name: /learn/i })
|
page.getByRole("contentinfo").getByRole("link", { name: /learn/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole("contentinfo").getByRole("link", { name: /about/i })
|
page.getByRole("contentinfo").getByRole("link", { name: /about/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Test legal links
|
// Test legal links
|
||||||
await expect(
|
await expect(
|
||||||
page
|
page
|
||||||
.getByRole("contentinfo")
|
.getByRole("contentinfo")
|
||||||
.getByRole("link", { name: /privacy policy/i })
|
.getByRole("link", { name: /privacy policy/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page
|
page
|
||||||
.getByRole("contentinfo")
|
.getByRole("contentinfo")
|
||||||
.getByRole("link", { name: /terms of service/i })
|
.getByRole("link", { name: /terms of service/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page
|
page
|
||||||
.getByRole("contentinfo")
|
.getByRole("contentinfo")
|
||||||
.getByRole("link", { name: /cookies settings/i })
|
.getByRole("link", { name: /cookies settings/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Test social links
|
// Test social links
|
||||||
await expect(
|
await expect(
|
||||||
page
|
page
|
||||||
.getByRole("contentinfo")
|
.getByRole("contentinfo")
|
||||||
.getByRole("link", { name: /follow us on bluesky/i })
|
.getByRole("link", { name: /follow us on bluesky/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page
|
page
|
||||||
.getByRole("contentinfo")
|
.getByRole("contentinfo")
|
||||||
.getByRole("link", { name: /follow us on gitlab/i })
|
.getByRole("link", { name: /follow us on gitlab/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -20,13 +20,13 @@ test.describe("Header responsive behavior", () => {
|
|||||||
|
|
||||||
// All breakpoints should have navigation items
|
// All breakpoints should have navigation items
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole("menuitem", { name: /use cases/i })
|
page.getByRole("menuitem", { name: /use cases/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole("menuitem", { name: /learn/i })
|
page.getByRole("menuitem", { name: /learn/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole("menuitem", { name: /about/i })
|
page.getByRole("menuitem", { name: /about/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -38,14 +38,14 @@ test.describe("Header responsive behavior", () => {
|
|||||||
|
|
||||||
// All breakpoints should have login button
|
// All breakpoints should have login button
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole("menuitem", { name: /log in to your account/i })
|
page.getByRole("menuitem", { name: /log in to your account/i }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// All breakpoints should have create rule button
|
// All breakpoints should have create rule button
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole("button", {
|
page.getByRole("button", {
|
||||||
name: /create a new rule with avatar decoration/i,
|
name: /create a new rule with avatar decoration/i,
|
||||||
})
|
}),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
+40
-40
@@ -12,19 +12,19 @@ test.describe("Homepage", () => {
|
|||||||
|
|
||||||
// Check main sections are present
|
// Check main sections are present
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("h1, h2").filter({ hasText: "Collaborate" })
|
page.locator("h1, h2").filter({ hasText: "Collaborate" }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("h2").filter({ hasText: "How CommunityRule works" })
|
page.locator("h2").filter({ hasText: "How CommunityRule works" }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("h1").filter({ hasText: "We've got your back" })
|
page.locator("h1").filter({ hasText: "We've got your back" }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check key components are rendered
|
// Check key components are rendered
|
||||||
await expect(page.locator('img[alt="Hero illustration"]')).toBeVisible();
|
await expect(page.locator('img[alt="Hero illustration"]')).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=Trusted by leading cooperators")
|
page.locator("text=Trusted by leading cooperators"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(page.locator("text=Jo Freeman")).toBeVisible();
|
await expect(page.locator("text=Jo Freeman")).toBeVisible();
|
||||||
});
|
});
|
||||||
@@ -34,12 +34,12 @@ test.describe("Homepage", () => {
|
|||||||
await expect(page.locator("text=Collaborate")).toBeVisible();
|
await expect(page.locator("text=Collaborate")).toBeVisible();
|
||||||
await expect(page.locator("text=with clarity")).toBeVisible();
|
await expect(page.locator("text=with clarity")).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=Help your community make important decisions")
|
page.locator("text=Help your community make important decisions"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check CTA button
|
// Check CTA button
|
||||||
const learnButtons = page.locator(
|
const learnButtons = page.locator(
|
||||||
'button:has-text("Learn how CommunityRule works")'
|
'button:has-text("Learn how CommunityRule works")',
|
||||||
);
|
);
|
||||||
const buttonCount = await learnButtons.count();
|
const buttonCount = await learnButtons.count();
|
||||||
let visibleButton = null;
|
let visibleButton = null;
|
||||||
@@ -54,7 +54,7 @@ test.describe("Homepage", () => {
|
|||||||
|
|
||||||
if (!visibleButton) {
|
if (!visibleButton) {
|
||||||
throw new Error(
|
throw new Error(
|
||||||
'No visible "Learn how CommunityRule works" button found'
|
'No visible "Learn how CommunityRule works" button found',
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -64,14 +64,14 @@ test.describe("Homepage", () => {
|
|||||||
await visibleButton.click();
|
await visibleButton.click();
|
||||||
// Should scroll to the numbered cards section
|
// Should scroll to the numbered cards section
|
||||||
await expect(
|
await expect(
|
||||||
page.locator('h2:has-text("How CommunityRule works")')
|
page.locator('h2:has-text("How CommunityRule works")'),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
test("logo wall section displays correctly", async ({ page }) => {
|
test("logo wall section displays correctly", async ({ page }) => {
|
||||||
// Check section label
|
// Check section label
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=Trusted by leading cooperators")
|
page.locator("text=Trusted by leading cooperators"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check logos are present
|
// Check logos are present
|
||||||
@@ -95,23 +95,23 @@ test.describe("Homepage", () => {
|
|||||||
test("numbered cards section functionality", async ({ page }) => {
|
test("numbered cards section functionality", async ({ page }) => {
|
||||||
// Check section header
|
// Check section header
|
||||||
await expect(
|
await expect(
|
||||||
page.locator('h2:has-text("How CommunityRule works")')
|
page.locator('h2:has-text("How CommunityRule works")'),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=Here's a quick overview of the process")
|
page.locator("text=Here's a quick overview of the process"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check all three cards are present
|
// Check all three cards are present
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=Document how your community makes decisions")
|
page.locator("text=Document how your community makes decisions"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=Build an operating manual for a successful community")
|
page.locator("text=Build an operating manual for a successful community"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator(
|
page.locator(
|
||||||
"text=Get a link to your manual for your group to review and evolve"
|
"text=Get a link to your manual for your group to review and evolve",
|
||||||
)
|
),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check numbered indicators - target the specific numbered cards section
|
// Check numbered indicators - target the specific numbered cards section
|
||||||
@@ -119,18 +119,18 @@ test.describe("Homepage", () => {
|
|||||||
.locator("section")
|
.locator("section")
|
||||||
.filter({ has: page.locator('h2:has-text("How CommunityRule works")') });
|
.filter({ has: page.locator('h2:has-text("How CommunityRule works")') });
|
||||||
await expect(
|
await expect(
|
||||||
numberedCardsSection.locator("span").filter({ hasText: "1" }).first()
|
numberedCardsSection.locator("span").filter({ hasText: "1" }).first(),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
numberedCardsSection.locator("span").filter({ hasText: "2" }).first()
|
numberedCardsSection.locator("span").filter({ hasText: "2" }).first(),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
numberedCardsSection.locator("span").filter({ hasText: "3" }).first()
|
numberedCardsSection.locator("span").filter({ hasText: "3" }).first(),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check CTA buttons
|
// Check CTA buttons
|
||||||
const createButtons = page.locator(
|
const createButtons = page.locator(
|
||||||
'button:has-text("Create CommunityRule")'
|
'button:has-text("Create CommunityRule")',
|
||||||
);
|
);
|
||||||
const createButtonCount = await createButtons.count();
|
const createButtonCount = await createButtons.count();
|
||||||
let visibleCreateButton = null;
|
let visibleCreateButton = null;
|
||||||
@@ -148,7 +148,7 @@ test.describe("Homepage", () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
await expect(
|
await expect(
|
||||||
page.locator('button:has-text("See how it works")')
|
page.locator('button:has-text("See how it works")'),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -161,16 +161,16 @@ test.describe("Homepage", () => {
|
|||||||
|
|
||||||
// Check rule descriptions
|
// Check rule descriptions
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=Units called Circles have the ability to decide")
|
page.locator("text=Units called Circles have the ability to decide"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=Decisions that affect the group collectively")
|
page.locator("text=Decisions that affect the group collectively"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=An elected board determines policies")
|
page.locator("text=An elected board determines policies"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=All participants can propose and vote")
|
page.locator("text=All participants can propose and vote"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Test card interactions
|
// Test card interactions
|
||||||
@@ -180,19 +180,19 @@ test.describe("Homepage", () => {
|
|||||||
|
|
||||||
// Check "See all templates" button
|
// Check "See all templates" button
|
||||||
await expect(
|
await expect(
|
||||||
page.locator('button:has-text("See all templates")')
|
page.locator('button:has-text("See all templates")'),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
test("feature grid section functionality", async ({ page }) => {
|
test("feature grid section functionality", async ({ page }) => {
|
||||||
// Check section header
|
// Check section header
|
||||||
await expect(
|
await expect(
|
||||||
page.locator('h1:has-text("We\'ve got your back")')
|
page.locator('h1:has-text("We\'ve got your back")'),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator(
|
page.locator(
|
||||||
"text=Use our toolkit to improve, document, and evolve your organization"
|
"text=Use our toolkit to improve, document, and evolve your organization",
|
||||||
)
|
),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check all four feature cards - use more specific selectors to avoid conflicts
|
// Check all four feature cards - use more specific selectors to avoid conflicts
|
||||||
@@ -214,23 +214,23 @@ test.describe("Homepage", () => {
|
|||||||
test("quote block section displays correctly", async ({ page }) => {
|
test("quote block section displays correctly", async ({ page }) => {
|
||||||
// Check quote content
|
// Check quote content
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=The rules of decision-making must be open")
|
page.locator("text=The rules of decision-making must be open"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check author and source
|
// Check author and source
|
||||||
await expect(page.locator("text=Jo Freeman")).toBeVisible();
|
await expect(page.locator("text=Jo Freeman")).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=The Tyranny of Structurelessness")
|
page.locator("text=The Tyranny of Structurelessness"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check avatar
|
// Check avatar
|
||||||
await expect(
|
await expect(
|
||||||
page.locator('img[alt="Portrait of Jo Freeman"]')
|
page.locator('img[alt="Portrait of Jo Freeman"]'),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check decorative elements
|
// Check decorative elements
|
||||||
await expect(
|
await expect(
|
||||||
page.locator('[class*="pointer-events-none absolute z-0"]').first()
|
page.locator('[class*="pointer-events-none absolute z-0"]').first(),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -238,7 +238,7 @@ test.describe("Homepage", () => {
|
|||||||
// Check section content
|
// Check section content
|
||||||
await expect(page.locator("text=Still have questions?")).toBeVisible();
|
await expect(page.locator("text=Still have questions?")).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("text=Get answers from an experienced organizer")
|
page.locator("text=Get answers from an experienced organizer"),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Check CTA button (it's actually a link)
|
// Check CTA button (it's actually a link)
|
||||||
@@ -295,19 +295,19 @@ test.describe("Homepage", () => {
|
|||||||
// Test mobile viewport
|
// Test mobile viewport
|
||||||
await page.setViewportSize({ width: 375, height: 667 });
|
await page.setViewportSize({ width: 375, height: 667 });
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("h1, h2").filter({ hasText: "Collaborate" })
|
page.locator("h1, h2").filter({ hasText: "Collaborate" }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Test tablet viewport
|
// Test tablet viewport
|
||||||
await page.setViewportSize({ width: 768, height: 1024 });
|
await page.setViewportSize({ width: 768, height: 1024 });
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("h1, h2").filter({ hasText: "Collaborate" })
|
page.locator("h1, h2").filter({ hasText: "Collaborate" }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
// Test desktop viewport
|
// Test desktop viewport
|
||||||
await page.setViewportSize({ width: 1440, height: 900 });
|
await page.setViewportSize({ width: 1440, height: 900 });
|
||||||
await expect(
|
await expect(
|
||||||
page.locator("h1, h2").filter({ hasText: "Collaborate" })
|
page.locator("h1, h2").filter({ hasText: "Collaborate" }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -371,7 +371,7 @@ test.describe("Homepage", () => {
|
|||||||
test("scroll behavior and smooth scrolling", async ({ page }) => {
|
test("scroll behavior and smooth scrolling", async ({ page }) => {
|
||||||
// Test smooth scrolling to sections
|
// Test smooth scrolling to sections
|
||||||
const learnButtons = page.locator(
|
const learnButtons = page.locator(
|
||||||
'button:has-text("Learn how CommunityRule works")'
|
'button:has-text("Learn how CommunityRule works")',
|
||||||
);
|
);
|
||||||
const buttonCount = await learnButtons.count();
|
const buttonCount = await learnButtons.count();
|
||||||
let visibleButton = null;
|
let visibleButton = null;
|
||||||
@@ -386,7 +386,7 @@ test.describe("Homepage", () => {
|
|||||||
|
|
||||||
if (!visibleButton) {
|
if (!visibleButton) {
|
||||||
throw new Error(
|
throw new Error(
|
||||||
'No visible "Learn how CommunityRule works" button found'
|
'No visible "Learn how CommunityRule works" button found',
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -397,7 +397,7 @@ test.describe("Homepage", () => {
|
|||||||
|
|
||||||
// Check we're at the numbered cards section
|
// Check we're at the numbered cards section
|
||||||
await expect(
|
await expect(
|
||||||
page.locator('h2:has-text("How CommunityRule works")')
|
page.locator('h2:has-text("How CommunityRule works")'),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -415,7 +415,7 @@ test.describe("Homepage", () => {
|
|||||||
const brokenImages = await page.evaluate(() => {
|
const brokenImages = await page.evaluate(() => {
|
||||||
const imgs = document.querySelectorAll("img");
|
const imgs = document.querySelectorAll("img");
|
||||||
return Array.from(imgs).filter(
|
return Array.from(imgs).filter(
|
||||||
(img) => !img.complete || img.naturalWidth === 0
|
(img) => !img.complete || img.naturalWidth === 0,
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -65,7 +65,7 @@ test.describe("Performance Monitoring", () => {
|
|||||||
// Assert individual metrics
|
// Assert individual metrics
|
||||||
expect(result.metrics.ttfb).toBeLessThan(PERFORMANCE_BUDGETS.ttfb);
|
expect(result.metrics.ttfb).toBeLessThan(PERFORMANCE_BUDGETS.ttfb);
|
||||||
expect(result.metrics.domContentLoaded).toBeLessThan(
|
expect(result.metrics.domContentLoaded).toBeLessThan(
|
||||||
PERFORMANCE_BUDGETS.dom_content_loaded
|
PERFORMANCE_BUDGETS.dom_content_loaded,
|
||||||
);
|
);
|
||||||
expect(result.metrics.load).toBeLessThan(PERFORMANCE_BUDGETS.full_load);
|
expect(result.metrics.load).toBeLessThan(PERFORMANCE_BUDGETS.full_load);
|
||||||
|
|
||||||
@@ -121,10 +121,10 @@ test.describe("Performance Monitoring", () => {
|
|||||||
|
|
||||||
// Assert Core Web Vitals are within acceptable ranges
|
// Assert Core Web Vitals are within acceptable ranges
|
||||||
expect(coreWebVitals.lcp).toBeLessThan(
|
expect(coreWebVitals.lcp).toBeLessThan(
|
||||||
PERFORMANCE_BUDGETS.largest_contentful_paint
|
PERFORMANCE_BUDGETS.largest_contentful_paint,
|
||||||
);
|
);
|
||||||
expect(coreWebVitals.fid).toBeLessThan(
|
expect(coreWebVitals.fid).toBeLessThan(
|
||||||
PERFORMANCE_BUDGETS.first_input_delay
|
PERFORMANCE_BUDGETS.first_input_delay,
|
||||||
);
|
);
|
||||||
expect(coreWebVitals.cls).toBeLessThan(0.1); // CLS should be less than 0.1
|
expect(coreWebVitals.cls).toBeLessThan(0.1); // CLS should be less than 0.1
|
||||||
});
|
});
|
||||||
@@ -133,27 +133,24 @@ test.describe("Performance Monitoring", () => {
|
|||||||
await page.goto("/");
|
await page.goto("/");
|
||||||
|
|
||||||
// Measure header render time
|
// Measure header render time
|
||||||
const headerRenderTime = await performanceMonitor.measureComponentRender(
|
const headerRenderTime =
|
||||||
"header"
|
await performanceMonitor.measureComponentRender("header");
|
||||||
);
|
|
||||||
expect(headerRenderTime).toBeLessThan(
|
expect(headerRenderTime).toBeLessThan(
|
||||||
PERFORMANCE_BUDGETS.component_render_time
|
PERFORMANCE_BUDGETS.component_render_time,
|
||||||
);
|
);
|
||||||
|
|
||||||
// Measure footer render time
|
// Measure footer render time
|
||||||
const footerRenderTime = await performanceMonitor.measureComponentRender(
|
const footerRenderTime =
|
||||||
"footer"
|
await performanceMonitor.measureComponentRender("footer");
|
||||||
);
|
|
||||||
expect(footerRenderTime).toBeLessThan(
|
expect(footerRenderTime).toBeLessThan(
|
||||||
PERFORMANCE_BUDGETS.component_render_time
|
PERFORMANCE_BUDGETS.component_render_time,
|
||||||
);
|
);
|
||||||
|
|
||||||
// Measure main content render time
|
// Measure main content render time
|
||||||
const mainRenderTime = await performanceMonitor.measureComponentRender(
|
const mainRenderTime =
|
||||||
"main"
|
await performanceMonitor.measureComponentRender("main");
|
||||||
);
|
|
||||||
expect(mainRenderTime).toBeLessThan(
|
expect(mainRenderTime).toBeLessThan(
|
||||||
PERFORMANCE_BUDGETS.component_render_time
|
PERFORMANCE_BUDGETS.component_render_time,
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -169,7 +166,7 @@ test.describe("Performance Monitoring", () => {
|
|||||||
'button:has-text("Learn how CommunityRule works")',
|
'button:has-text("Learn how CommunityRule works")',
|
||||||
async () => {
|
async () => {
|
||||||
const learnButtons = page.locator(
|
const learnButtons = page.locator(
|
||||||
'button:has-text("Learn how CommunityRule works")'
|
'button:has-text("Learn how CommunityRule works")',
|
||||||
);
|
);
|
||||||
const buttonCount = await learnButtons.count();
|
const buttonCount = await learnButtons.count();
|
||||||
let visibleButton = null;
|
let visibleButton = null;
|
||||||
@@ -189,12 +186,12 @@ test.describe("Performance Monitoring", () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
await visibleButton.click();
|
await visibleButton.click();
|
||||||
}
|
},
|
||||||
);
|
);
|
||||||
|
|
||||||
if (buttonClickTime !== null) {
|
if (buttonClickTime !== null) {
|
||||||
expect(buttonClickTime).toBeLessThan(
|
expect(buttonClickTime).toBeLessThan(
|
||||||
PERFORMANCE_BUDGETS.interaction_time
|
PERFORMANCE_BUDGETS.interaction_time,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -221,7 +218,7 @@ test.describe("Performance Monitoring", () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
await visibleLink.click();
|
await visibleLink.click();
|
||||||
}
|
},
|
||||||
);
|
);
|
||||||
|
|
||||||
if (linkClickTime !== null) {
|
if (linkClickTime !== null) {
|
||||||
@@ -261,7 +258,7 @@ test.describe("Performance Monitoring", () => {
|
|||||||
const summary = performanceMonitor.getSummary();
|
const summary = performanceMonitor.getSummary();
|
||||||
if (summary.network_request_duration) {
|
if (summary.network_request_duration) {
|
||||||
expect(summary.network_request_duration.average).toBeLessThan(
|
expect(summary.network_request_duration.average).toBeLessThan(
|
||||||
PERFORMANCE_BUDGETS.network_request_duration
|
PERFORMANCE_BUDGETS.network_request_duration,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -304,7 +301,7 @@ test.describe("Performance Monitoring", () => {
|
|||||||
|
|
||||||
// Even under load, page should load within reasonable time
|
// Even under load, page should load within reasonable time
|
||||||
expect(result.loadTime).toBeLessThan(
|
expect(result.loadTime).toBeLessThan(
|
||||||
PERFORMANCE_BUDGETS.page_load_time * 1.5
|
PERFORMANCE_BUDGETS.page_load_time * 1.5,
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -354,7 +351,7 @@ test.describe("Performance Monitoring", () => {
|
|||||||
|
|
||||||
console.log(
|
console.log(
|
||||||
"Exported Performance Data:",
|
"Exported Performance Data:",
|
||||||
JSON.stringify(exportedData, null, 2)
|
JSON.stringify(exportedData, null, 2),
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -413,7 +410,7 @@ test.describe("Performance Regression Testing", () => {
|
|||||||
const variance =
|
const variance =
|
||||||
results.reduce(
|
results.reduce(
|
||||||
(acc, val) => acc + Math.pow(val - averageLoadTime, 2),
|
(acc, val) => acc + Math.pow(val - averageLoadTime, 2),
|
||||||
0
|
0,
|
||||||
) / results.length;
|
) / results.length;
|
||||||
|
|
||||||
// Performance should be consistent (low variance)
|
// Performance should be consistent (low variance)
|
||||||
|
|||||||
@@ -360,7 +360,7 @@ test.describe("Visual Regression Tests", () => {
|
|||||||
await page.evaluate(() => {
|
await page.evaluate(() => {
|
||||||
document.documentElement.style.setProperty(
|
document.documentElement.style.setProperty(
|
||||||
"--prefers-reduced-motion",
|
"--prefers-reduced-motion",
|
||||||
"reduce"
|
"reduce",
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user