Add Playwright Test for Sign in with GitHub

test/e2e/login-authenticated.e2e.test.js

@@ -0,0 +1,108 @@
+const { test, expect } = require('@playwright/test');
+const { chromium } = require('@playwright/test');
+const path = require('path');
+const fs = require('fs');
+
+// This test requires GitHub OAuth to be properly configured in .env file
+test.describe('GitHub OAuth Login', () => {
+  let browser;
+  let context;
+  let page;
+  const authFile = path.join(__dirname, '../.auth/user.json');
+
+  test.beforeAll(async () => {
+    // Check if we have stored authentication state
+    if (fs.existsSync(authFile)) {
+      // Use existing auth state
+      browser = await chromium.launch();
+      context = await browser.newContext({ storageState: authFile });
+      page = await context.newPage();
+    } else {
+      // Set up new authentication
+      browser = await chromium.launch({ headless: false });
+      context = await browser.newContext();
+      page = await context.newPage();
+
+      // Navigate to login page
+      await page.goto('/login');
+
+      // Click GitHub login button
+      const [popup] = await Promise.all([
+        page.waitForEvent('popup'),
+        page.click('a[href*="/auth/github"]')
+      ]);
+
+      // Wait for GitHub login page to load
+      await popup.waitForLoadState('domcontentloaded');
+
+      // Check if we're on GitHub's login page
+      if (await popup.title().includes('GitHub')) {
+        // Only proceed with login if GITHUB_USER and GITHUB_PASSWORD are set
+        if (process.env.GITHUB_USER && process.env.GITHUB_PASSWORD) {
+          // Fill in GitHub credentials
+          await popup.fill('input[name="login"]', process.env.GITHUB_USER);
+          await popup.fill('input[name="password"]', process.env.GITHUB_PASSWORD);
+          await popup.click('input[type="submit"]');
+
+          // Handle GitHub's OAuth authorization if needed
+          try {
+            await popup.waitForSelector('button[type="submit"]', { timeout: 5000 });
+            await popup.click('button[type="submit"]');
+          } catch (e) {
+            // Authorization might not be needed if already authorized
+            console.log('No authorization page or already authorized');
+          }
+
+          // Wait for navigation to complete after login
+          await page.waitForURL('**/account');
+
+          // Save authentication state
+          await page.context().storageState({ path: authFile });
+        } else {
+          console.warn('GitHub credentials not provided. Tests requiring authentication will be skipped.');
+          await browser.close();
+          return;
+        }
+      } else {
+        console.warn('Not on GitHub login page. Check your OAuth configuration.');
+        await browser.close();
+        return;
+      }
+    }
+  });
+
+  test.afterAll(async () => {
+    await browser.close();
+  });
+
+  test('should be logged in with GitHub', async () => {
+    // Skip test if we couldn't authenticate
+    test.skip(!fs.existsSync(authFile), 'Authentication file not found. Skipping test.');
+
+    // Navigate to account page to verify login
+    await page.goto('/account');
+
+    // Verify we're on the account page
+    await expect(page).toHaveTitle(/Account Management/);
+
+    // Verify GitHub account is linked
+    const githubLink = page.locator('a[href*="/account/unlink/github"]');
+    await expect(githubLink).toBeVisible();
+    await expect(githubLink).toContainText('Unlink your GitHub account');
+  });
+
+  test('should be able to access GitHub API page', async () => {
+    // Skip test if we couldn't authenticate
+    test.skip(!fs.existsSync(authFile), 'Authentication file not found. Skipping test.');
+
+    // Navigate to GitHub API page
+    await page.goto('/api/github');
+
+    // Verify page loads correctly
+    await expect(page).toHaveTitle(/GitHub API/);
+
+    // Check for GitHub API content (this will vary based on your implementation)
+    const repoContent = page.locator('.card-body.text-dark.bg-white');
+    await expect(repoContent.first()).toBeVisible();
+  });
+});