+
{
+ test('feed route should return RSS feed', async ({ request }) => {
+ const response = await request.get('/feed');
+
+ expect(response.status()).toBe(200);
+ expect(response.headers()['content-type']).toContain('application/xml');
+
+ const body = await response.text();
+ expect(body).toContain('');
+ });
+
+ test('test API should work in development', async ({ request }) => {
+ // When testing in CI, we're likely in development mode
+ const response = await request.post('/api/test');
+
+ // In CI/tests, we accept either 200 (dev mode) or 403 (prod mode)
+ expect([200, 403]).toContain(response.status());
+
+ // If we got a 200, verify the response
+ if (response.status() === 200) {
+ const text = await response.text();
+ expect(text).toContain('Test entry added');
+ }
+ });
+
+ test('revalidate API requires secret', async ({ request }) => {
+ const response = await request.post('/api/revalidate');
+
+ // Should fail without proper secret
+ expect(response.status()).not.toBe(200);
+ });
+});
\ No newline at end of file
diff --git a/tests/home.spec.ts b/tests/home.spec.ts
new file mode 100644
index 0000000..85a5eb2
--- /dev/null
+++ b/tests/home.spec.ts
@@ -0,0 +1,53 @@
+/*
+ * Copyright The OpenTelemetry Authors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { test, expect } from '@playwright/test';
+
+test.describe('Homepage', () => {
+ test('should have correct title', async ({ page }) => {
+ await page.goto('/');
+ await expect(page).toHaveTitle(/OpenTelemetry Changelog/);
+ });
+
+ test('should display changelog header', async ({ page }) => {
+ await page.goto('/');
+ const header = page.locator('h1');
+ await expect(header).toBeVisible();
+ await expect(header).toHaveText(/OpenTelemetry Changelog/);
+ });
+
+ test('should show changelog entries', async ({ page }) => {
+ await page.goto('/');
+ const entries = page.locator('[data-testid="changelog-entry"]');
+
+ // Wait for entries to be loaded (adjust timeout if needed)
+ await expect(entries).toHaveCount(await entries.count(), { timeout: 5000 });
+
+ // Verify structure of at least one entry if any exist
+ if (await entries.count() > 0) {
+ const firstEntry = entries.first();
+ await expect(firstEntry.locator('.entry-title')).toBeVisible();
+ await expect(firstEntry.locator('.entry-description')).toBeVisible();
+ }
+ });
+
+ test('should have proper responsive design', async ({ page }) => {
+ // Test on mobile viewport
+ await page.setViewportSize({ width: 375, height: 667 }); // iPhone SE size
+ await page.goto('/');
+ await expect(page.locator('body')).toBeVisible();
+
+ // Take screenshot for visual comparison
+ await page.screenshot({ path: 'tests/screenshots/home-mobile.png' });
+
+ // Test on desktop viewport
+ await page.setViewportSize({ width: 1280, height: 800 });
+ await page.goto('/');
+ await expect(page.locator('body')).toBeVisible();
+
+ // Take screenshot for visual comparison
+ await page.screenshot({ path: 'tests/screenshots/home-desktop.png' });
+ });
+});
\ No newline at end of file
diff --git a/tests/visual.spec.ts b/tests/visual.spec.ts
new file mode 100644
index 0000000..c31cf12
--- /dev/null
+++ b/tests/visual.spec.ts
@@ -0,0 +1,74 @@
+/*
+ * Copyright The OpenTelemetry Authors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { test, expect } from '@playwright/test';
+
+test.describe('Visual Regression Tests', () => {
+ test('homepage visual test', async ({ page }) => {
+ await page.goto('/');
+
+ // Wait for content to be loaded
+ await page.waitForSelector('h1');
+
+ // Compare the screenshot with a reference
+ // Use updateSnapshots flag in CI to automate snapshot creation
+ await expect(page).toHaveScreenshot('homepage.png', {
+ timeout: 5000,
+ maxDiffPixelRatio: 0.05, // Allow 5% difference
+ threshold: 0.2, // More tolerant threshold for CI variations
+ });
+ });
+
+ // Test different viewport sizes
+ test('responsive design tests', async ({ page }) => {
+ // Mobile
+ await page.setViewportSize({ width: 375, height: 667 });
+ await page.goto('/');
+ await page.waitForSelector('h1');
+ await expect(page).toHaveScreenshot('homepage-mobile.png', {
+ timeout: 5000,
+ maxDiffPixelRatio: 0.05,
+ threshold: 0.2,
+ });
+
+ // Tablet
+ await page.setViewportSize({ width: 768, height: 1024 });
+ await page.goto('/');
+ await page.waitForSelector('h1');
+ await expect(page).toHaveScreenshot('homepage-tablet.png', {
+ timeout: 5000,
+ maxDiffPixelRatio: 0.05,
+ threshold: 0.2,
+ });
+
+ // Desktop
+ await page.setViewportSize({ width: 1280, height: 800 });
+ await page.goto('/');
+ await page.waitForSelector('h1');
+ await expect(page).toHaveScreenshot('homepage-desktop.png', {
+ timeout: 5000,
+ maxDiffPixelRatio: 0.05,
+ threshold: 0.2,
+ });
+ });
+
+ // Test dark mode if applicable
+ test('dark mode visual test', async ({ page }) => {
+ await page.goto('/');
+
+ // Enable dark mode if your app has a way to toggle it
+ // This is hypothetical and would need to be adjusted for your actual app
+ await page.evaluate(() => {
+ document.documentElement.classList.add('dark');
+ });
+
+ await page.waitForSelector('h1');
+ await expect(page).toHaveScreenshot('homepage-dark-mode.png', {
+ timeout: 5000,
+ maxDiffPixelRatio: 0.05,
+ threshold: 0.2,
+ });
+ });
+});
\ No newline at end of file