Use Caddy to rewrite origin

jonatansberg · jonatansberg · commit b8a256348499 · 2025-12-01T09:51:51.000+01:00
diff --git a/docker/dev-gateway/Caddyfile b/docker/dev-gateway/Caddyfile
@@ -25,6 +25,7 @@
     handle /ghost/api/* {
         reverse_proxy {env.GHOST_BACKEND} {
             header_up Host {host}
+            header_up Origin http://localhost:2368
             header_up X-Real-IP {remote_host}
             header_up X-Forwarded-For {remote_host}
 
@@ -145,6 +146,7 @@
     handle {
         reverse_proxy {env.GHOST_BACKEND} {
             header_up Host {host}
+            header_up Origin http://localhost:2368
             header_up X-Real-IP {remote_host}
             header_up X-Forwarded-For {remote_host}
 
@@ -162,6 +164,7 @@
             rewrite * {http.request.orig_uri.path}
             reverse_proxy {env.GHOST_BACKEND} {
                 header_up Host {host}
+                header_up Origin http://localhost:2368
                 header_up X-Forwarded-Proto https
             }
         }
diff --git a/e2e/helpers/pages/admin/settings/sections/staff-section.ts b/e2e/helpers/pages/admin/settings/sections/staff-section.ts
@@ -63,9 +63,6 @@ export class StaffSection extends BasePage {
         // Submit the invitation
         await this.inviteModal.getByRole('button', {name: 'Send invitation'}).click();
 
-        // Wait for success toast
-        await this.page.getByTestId('toast-success').waitFor({state: 'visible'});
-
         // Wait for modal to close
         await this.inviteModal.waitFor({state: 'hidden'});
     }
diff --git a/e2e/helpers/pages/admin/signup-page.ts b/e2e/helpers/pages/admin/signup-page.ts
@@ -48,3 +48,4 @@ export class SignupPage extends AdminPage {
     }
 }
 
+
diff --git a/e2e/helpers/playwright/context-with-route.ts b/e2e/helpers/playwright/context-with-route.ts
@@ -1,53 +1,30 @@
-import {Browser, BrowserContext} from '@playwright/test';
-import * as path from 'path';
 import * as fs from 'fs';
-
-/**
- * Base URL used by Playwright for all test contexts. Requests to this hostname
- * are routed to the actual Ghost backend instance (localhost:{port}) via route interception.
- */
-export const PLAYWRIGHT_BASE_URL = 'http://ghost.test:2368';
+import * as path from 'path';
+import {Browser, BrowserContext} from '@playwright/test';
 
 const AUTH_STATE_DIR = path.join(process.cwd(), 'e2e', 'data', 'state', 'auth');
 
 /**
- * Creates a browser context with route interception to map ghost.test:2368
- * to localhost:{port} while preserving the Origin header for Ghost's CSRF protection.
+ * Creates a browser context using the backend URL directly. Caddy proxy handles
+ * Origin header rewriting for CSRF protection, so no route interception needed.
+ * Also creates a separate APIRequestContext that uses the actual backend URL for direct HTTP requests.
  */
 export async function createContextWithRoute(
     browser: Browser,
     backendURL: string,
     options?: {role?: string}
 ): Promise<BrowserContext> {
-    const port = new URL(backendURL).port;
     const storageState = options?.role ? path.join(AUTH_STATE_DIR, `${options.role}.json`) : undefined;
     
     if (storageState && !fs.existsSync(storageState)) {
         throw new Error(`Storage state file not found: ${storageState}. Run global setup first.`);
     }
     
-    const context = await browser.newContext({
-        baseURL: PLAYWRIGHT_BASE_URL,
-        storageState,
-        extraHTTPHeaders: {
-            Origin: PLAYWRIGHT_BASE_URL
-        }
+    // Context for page navigation - uses backend URL directly
+    // Caddy proxy handles Origin header rewriting
+    return await browser.newContext({
+        baseURL: backendURL,
+        storageState
     });
-    
-    await context.route('**/*', async (route) => {
-        const url = new URL(route.request().url());
-        if (url.hostname === 'ghost.test') {
-            url.hostname = 'localhost';
-            url.port = port;
-            const headers = route.request().headers();
-            // Preserve Origin header to match what was used during authentication
-            headers['Origin'] = PLAYWRIGHT_BASE_URL;
-            await route.continue({url: url.toString(), headers});
-        } else {
-            await route.continue();
-        }
-    });
-    
-    return context;
 }
 
diff --git a/e2e/helpers/playwright/fixture.ts b/e2e/helpers/playwright/fixture.ts
@@ -3,16 +3,11 @@ import {AnalyticsOverviewPage} from '@/admin-pages';
 import {Browser, BrowserContext, Page, TestInfo, test as base} from '@playwright/test';
 import {GhostInstance, getEnvironmentManager} from '@/helpers/environment';
 import {SettingsService} from '@/helpers/services/settings/settings-service';
-import {createContextWithRoute} from '@/helpers/playwright/context-with-route';
 import {User} from '@/data-factory';
-import * as fs from 'fs';
-import * as path from 'path';
+import {createContextWithRoute} from '@/helpers/playwright/context-with-route';
 
 const debug = baseDebug('e2e:ghost-fixture');
 
-const AUTH_STATE_DIR = path.join(process.cwd(), 'e2e', 'data', 'state', 'auth');
-const USERS_STATE_FILE = path.join(process.cwd(), 'e2e', 'data', 'state', 'users.json');
-
 export interface GhostConfig {
     memberWelcomeEmailSendInstantly: string;
     memberWelcomeEmailTestInbox: string;
@@ -52,7 +47,6 @@ async function setupNewAuthenticatedPage(browser: Browser, backendURL: string, r
     });
     
     const page = await context.newPage();
-    debug('Authenticated page created using saved storageState with host aliasing');
 
     return {page, context};
 }
@@ -100,18 +94,12 @@ export const test = base.extend<GhostInstanceFixture>({
         await use(ghostInstance.baseUrl);
     },
 
-    // Load owner user credentials from saved state (backward compatibility)
     ghostAccountOwner: async ({}, use) => {
-        if (!fs.existsSync(USERS_STATE_FILE)) {
-            throw new Error(`User credentials file not found: ${USERS_STATE_FILE}. Run global setup first.`);
-        }
-
-        const credentials = JSON.parse(fs.readFileSync(USERS_STATE_FILE, 'utf-8'));
         const owner: User = {
-            name: credentials.owner.name,
-            email: credentials.owner.email,
-            password: credentials.owner.password,
-            blogTitle: credentials.owner.blogTitle
+            name: 'Test Owner',
+            email: 'owner@ghost.org',
+            password: 'test@123@test',
+            blogTitle: 'Test Blog'
         };
         await use(owner);
     },
diff --git a/e2e/tests/global.setup.ts b/e2e/tests/global.setup.ts
@@ -1,20 +1,22 @@
-import {getEnvironmentManager} from '@/helpers/environment';
-import {test as setup, expect} from '@playwright/test';
+import * as path from 'path';
+import {AnalyticsOverviewPage} from '@/admin-pages';
+import {MailPit} from '@/helpers/services/email/mail-pit';
 import {SettingsPage} from '@/helpers/pages';
-import {loginToGetAuthenticatedSession} from '@/helpers/playwright/flows/login';
+import {SignupPage} from '@/helpers/pages/admin/signup-page';
 import {createContextWithRoute} from '@/helpers/playwright/context-with-route';
-import {MailPit} from '@/helpers/services/email/mail-pit';
+import {ensureDir} from '@/helpers/utils/ensure-dir';
+import {expect, test as setup} from '@playwright/test';
 import {extractInvitationLink} from '@/helpers/services/email/utils';
-import {SignupPage} from '@/helpers/pages/admin/signup-page';
+import {getEnvironmentManager} from '@/helpers/environment';
+import {loginToGetAuthenticatedSession} from '@/helpers/playwright/flows/login';
 import {setupUser} from '@/helpers/utils/setup-user';
-import * as path from 'path';
-import {ensureDir} from '@/helpers/utils/ensure-dir';
 
 const AUTH_STATE_DIR = path.join(process.cwd(), 'e2e', 'data', 'state', 'auth');
 const PASSWORD = 'test@123@test';
 
+setup.describe.configure({mode: 'serial'});
 // Setup environment first
-setup('environment setup', async () => {
+setup('setup environment', async () => {
     const manager = await getEnvironmentManager();
     const result = await manager.globalSetup();
     
@@ -29,7 +31,7 @@ setup('environment setup', async () => {
 });
 
 // Setup owner user
-setup('setup owner user', async ({browser}) => {
+setup('create owner user', async ({browser}) => {
     const backendURL = process.env.E2E_BASE_URL!;
     const ownerEmail = 'owner@ghost.org';
 
@@ -50,32 +52,33 @@ setup('setup owner user', async ({browser}) => {
     await context.close();
 });
 
-// Invite and onboard staff members using parameterized tests
 const staffRoles: Array<{role: 'administrator' | 'editor' | 'author' | 'contributor'; name: string; email: string}> = [
     {role: 'administrator', name: 'Test Administrator', email: 'administrator@ghost.org'},
     {role: 'editor', name: 'Test Editor', email: 'editor@ghost.org'},
     {role: 'author', name: 'Test Author', email: 'author@ghost.org'},
     {role: 'contributor', name: 'Test Contributor', email: 'contributor@ghost.org'}
 ];
+setup(`invite staff users`, async ({browser}) => {
+    const backendURL = process.env.E2E_BASE_URL!;
+    
+    const context = await createContextWithRoute(browser, backendURL, {
+        role: 'owner'
+    });
 
-for (const {role, name, email} of staffRoles) {
-    setup(`invite ${role}`, async ({browser}) => {
-        const backendURL = process.env.E2E_BASE_URL!;
-        
-        const context = await createContextWithRoute(browser, backendURL, {
-            role: 'owner'
-        });
-
-        const page = await context.newPage();
-        const settingsPage = new SettingsPage(page);
-        await settingsPage.goto();
-        await settingsPage.staffSection.goto();
+    const page = await context.newPage();
+    const settingsPage = new SettingsPage(page);
+    await settingsPage.goto();
+    await settingsPage.staffSection.goto();
 
+    for (const {role, email} of staffRoles) {
         await settingsPage.staffSection.inviteUser(email, role);
-        await context.close();
-    });
+    }
+    
+    await context.close();
+});
 
-    setup(`complete ${role} signup`, async ({browser}) => {
+for (const {role, name, email} of staffRoles) {
+    setup(`create ${role} user`, async ({browser}) => {
         const backendURL = process.env.E2E_BASE_URL!;
         const emailClient = new MailPit();
 
@@ -85,37 +88,34 @@ for (const {role, name, email} of staffRoles) {
         const emailMessage = await emailClient.getMessageDetailed(messages[0]);
         const invitationLink = extractInvitationLink(emailMessage.HTML || emailMessage.Text);
 
-        let signupUrl = invitationLink.startsWith('http') 
+        // Extract the path from the invitation link and use consistent baseURL
+        const invitationUrl = new URL(invitationLink.startsWith('http') 
             ? invitationLink 
-            : `${backendURL}${invitationLink}`;
-        signupUrl = signupUrl.replace(/\/ghost\/signup\//, '/ghost/#/signup/');
+            : `${backendURL}${invitationLink}`);
+        const signupPath = invitationUrl.pathname.replace(/\/ghost\/signup\//, '/ghost/#/signup/');
 
         const context = await createContextWithRoute(browser, backendURL);
         const page = await context.newPage();
         
-        await page.goto(signupUrl);
+        // Use relative path so it goes through our route interception
+        await page.goto(signupPath);
         const signupPage = new SignupPage(page);
         await signupPage.nameField.waitFor({state: 'visible'});
 
-        await signupPage.completeSignup(name, PASSWORD);
-        await context.close();
-    });
-
-    setup(`authenticate ${role}`, async ({browser}) => {
-        const backendURL = process.env.E2E_BASE_URL!;
-
-        const context = await createContextWithRoute(browser, backendURL);
-        const page = await context.newPage();
+        await signupPage.nameField.fill(name);
+        await signupPage.emailField.fill(email);
+        await signupPage.passwordField.fill(PASSWORD);
+        await signupPage.submitButton.click();
 
-        await loginToGetAuthenticatedSession(page, email, PASSWORD);
+        await page.waitForURL(/\/ghost\/#\/(analytics|posts|site)/);
         
         await context.storageState({path: path.join(AUTH_STATE_DIR, `${role}.json`)});
         await context.close();
     });
 }
 
 // Create database snapshot after all users are onboarded
-setup('create database snapshot', async () => {
+setup('save database snapshot', async () => {
     const manager = await getEnvironmentManager();
     if ('createSnapshot' in manager && typeof manager.createSnapshot === 'function') {
         await manager.createSnapshot();

Original file line number	Diff line number	Diff line change
`@@ -63,9 +63,6 @@ export class StaffSection extends BasePage {`
`63`	`63`	`// Submit the invitation`
`64`	`64`	`await this.inviteModal.getByRole('button', {name: 'Send invitation'}).click();`
`65`	`65`
`66`		`- // Wait for success toast`
`67`		`- await this.page.getByTestId('toast-success').waitFor({state: 'visible'});`
`68`		`-`
`69`	`66`	`// Wait for modal to close`
`70`	`67`	`await this.inviteModal.waitFor({state: 'hidden'});`
`71`	`68`	`}`
Original file line number	Diff line number	Diff line change
`@@ -48,3 +48,4 @@ export class SignupPage extends AdminPage {`
`48`	`48`	`}`
`49`	`49`	`}`
`50`	`50`
	`51`	`+`