App Router Handler Tests

packages/core/test/server-handlers.ts

@@ -11,6 +11,9 @@ interface TestEndpointResponse {
 
 export const VALID_AUTH_TOKEN = 'this is a valid auth';
 export const DRAFT_POST_ID = 57;
+export const VALID_REVALIDATE_AUTH_TOKEN = 'this is a valid revalidate auth token';
+export const REVALIDATE_PATH = '/revalidate-path';
+export const REVALIDATE_POST_ID = 57;
 
 const handlers = [
 	rest.head('http://example.com/redirect-test', (req, res) => {
@@ -348,6 +351,28 @@ const handlers = [
 
 		return res(ctx.json([]));
 	}),
+
+	rest.get('https://js1.10up.com/wp-json/headless-wp/v1/token', (req, res, ctx) => {
+		if (
+			(req.headers.has('Authorization') &&
+				req.headers.get('Authorization') === `Bearer ${VALID_REVALIDATE_AUTH_TOKEN}`) ||
+			(req.headers.has('X-HeadstartWP-Authorization') &&
+				req.headers.get('X-HeadstartWP-Authorization') ===
+					`Bearer ${VALID_REVALIDATE_AUTH_TOKEN}`)
+		) {
+			return res(ctx.json({ post_id: REVALIDATE_POST_ID, path: REVALIDATE_PATH }));
+		}
+
+		return res(
+			ctx.json({
+				code: 'rest_cannot_read',
+				message: 'Sorry, you are not allowed to do this.',
+				data: {
+					status: 401,
+				},
+			}),
+		);
+	}),
 ];
 
 export { handlers };

packages/core/test/server.ts

@@ -1,6 +1,21 @@
 import { rest } from 'msw';
 import { setupServer } from 'msw/node';
-import { handlers, VALID_AUTH_TOKEN, DRAFT_POST_ID } from './server-handlers';
+import {
+	handlers,
+	VALID_AUTH_TOKEN,
+	DRAFT_POST_ID,
+	VALID_REVALIDATE_AUTH_TOKEN,
+	REVALIDATE_PATH,
+	REVALIDATE_POST_ID,
+} from './server-handlers';
 
 const server = setupServer(...handlers);
-export { server, rest, VALID_AUTH_TOKEN, DRAFT_POST_ID };
+export {
+	server,
+	rest,
+	VALID_AUTH_TOKEN,
+	DRAFT_POST_ID,
+	VALID_REVALIDATE_AUTH_TOKEN,
+	REVALIDATE_PATH,
+	REVALIDATE_POST_ID,
+};

packages/next/jest.setup.ts

@@ -1,4 +1,4 @@
-import 'whatwg-fetch';
+import 'isomorphic-fetch';
 
 import { server } from '@headstartwp/core/test';
 

packages/next/package.json

@@ -71,7 +71,7 @@
     "node-mocks-http": "^1.14.1",
     "ts-jest": "^29.0.1",
     "typescript": "^5.4.5",
-    "whatwg-fetch": "^3.6.20",
+    "isomorphic-fetch": "^3.0.0",
     "jest-fetch-mock": "^3.0.3",
     "tsc-esm-fix": "^2.20.27",
     "@types/react": "^18",

packages/next/src/rsc/handlers/__tests__/previewRouteHandler.ts

@@ -1,8 +1,29 @@
+import nextHeaders from 'next/headers';
 import { NextRequest } from 'next/server';
-import { previewRouteHandler } from '../previewRouteHandler';
+import { setHeadstartWPConfig } from '@headstartwp/core';
+import { DRAFT_POST_ID, VALID_AUTH_TOKEN } from '@headstartwp/core/test';
+import { redirect } from 'next/navigation';
+import { COOKIE_NAME, previewRouteHandler } from '../previewRouteHandler';
+
+jest.mock('next/headers', () => ({
+	draftMode: () => ({ isEnabled: false, enable: jest.fn() }),
+	cookies: jest.fn(() => ({
+		get: jest.fn(),
+		has: jest.fn(),
+	})),
+}));
+
+const config = {
+	sourceUrl: 'https://js1.10up.com',
+	useWordPressPlugin: true,
+};
 
 describe('previewRouteHandler', () => {
-	it.skip('does not accepts POST requests', async () => {
+	beforeEach(() => {
+		setHeadstartWPConfig(config);
+	});
+
+	it('does not accepts POST requests', async () => {
 		const req = new NextRequest('http://test.com', {
 			method: 'POST',
 			body: JSON.stringify({}),
@@ -12,4 +33,186 @@ describe('previewRouteHandler', () => {
 
 		expect(res.status).toBe(401);
 	});
+
+	it('does not accepts invalid params', async () => {
+		const req = new NextRequest('http://test.com');
+
+		const res = await previewRouteHandler(req);
+
+		expect(res.status).toBe(401);
+	});
+
+	it('fails if a valid auth token is not provided', async () => {
+		const searchParams = new URLSearchParams({
+			post_id: DRAFT_POST_ID.toString(),
+			token: 'test',
+			post_type: 'post',
+		});
+
+		const req = new NextRequest(`https://js1.10up.com?${searchParams.toString()}`);
+
+		await expect(() => previewRouteHandler(req)).rejects.toThrow(
+			'Sorry, you are not allowed to view this post.',
+		);
+	});
+
+	it('works if a valid auth token is provided', async () => {
+		const searchParams = new URLSearchParams({
+			post_id: DRAFT_POST_ID.toString(),
+			token: VALID_AUTH_TOKEN.toString(),
+			post_type: 'post',
+		});
+
+		const req = new NextRequest(`https://js1.10up.com?${searchParams.toString()}`);
+
+		const previewDataPayload = JSON.stringify({
+			id: DRAFT_POST_ID,
+			postType: 'post',
+			revision: false,
+			authToken: VALID_AUTH_TOKEN,
+		});
+
+		// @ts-expect-error
+		nextHeaders.cookies.mockReturnValue({
+			set: jest.fn(),
+			get: jest.fn(() => ({ value: previewDataPayload, name: COOKIE_NAME })),
+			has: jest.fn(() => true),
+		});
+
+		await expect(() => previewRouteHandler(req)).rejects.toThrow('NEXT_REDIRECT');
+
+		expect(nextHeaders.cookies().set).toHaveBeenCalledWith(COOKIE_NAME, previewDataPayload, {
+			httpOnly: true,
+			maxAge: 300,
+			path: '/modi-qui-dignissimos-sed-assumenda-sint-iusto',
+		});
+	});
+
+	it('works for custom post types', async () => {
+		setHeadstartWPConfig({
+			...config,
+			customPostTypes: [
+				{
+					slug: 'book',
+					// reuse existing posts endpoint
+					endpoint: '/wp-json/wp/v2/posts',
+					// these should match your file-system routing
+					single: '/book',
+					archive: '/books',
+				},
+			],
+		});
+
+		const searchParams = new URLSearchParams({
+			post_id: DRAFT_POST_ID.toString(),
+			token: VALID_AUTH_TOKEN.toString(),
+			post_type: 'book',
+		});
+
+		const previewDataPayload = JSON.stringify({
+			id: DRAFT_POST_ID,
+			postType: 'book',
+			revision: false,
+			authToken: VALID_AUTH_TOKEN,
+		});
+
+		const req = new NextRequest(`https://js1.10up.com?${searchParams.toString()}`);
+
+		await expect(() => previewRouteHandler(req)).rejects.toThrow('NEXT_REDIRECT');
+		expect(nextHeaders.cookies().set).toHaveBeenCalledWith(COOKIE_NAME, previewDataPayload, {
+			httpOnly: true,
+			maxAge: 300,
+			path: '/book/modi-qui-dignissimos-sed-assumenda-sint-iusto',
+		});
+	});
+
+	it('works for custom post types with locale', async () => {
+		setHeadstartWPConfig({
+			...config,
+			customPostTypes: [
+				{
+					slug: 'book',
+					// reuse existing posts endpoint
+					endpoint: '/wp-json/wp/v2/posts',
+					// these should match your file-system routing
+					single: '/book',
+					archive: '/books',
+				},
+			],
+		});
+
+		const searchParams = new URLSearchParams({
+			post_id: DRAFT_POST_ID.toString(),
+			token: VALID_AUTH_TOKEN.toString(),
+			post_type: 'book',
+			locale: 'es',
+		});
+
+		const previewDataPayload = JSON.stringify({
+			id: DRAFT_POST_ID,
+			postType: 'book',
+			revision: false,
+			authToken: VALID_AUTH_TOKEN,
+		});
+
+		const req = new NextRequest(`https://js1.10up.com?${searchParams.toString()}`);
+
+		await expect(() => previewRouteHandler(req)).rejects.toThrow('NEXT_REDIRECT');
+
+		expect(nextHeaders.cookies().set).toHaveBeenCalledWith(COOKIE_NAME, previewDataPayload, {
+			httpOnly: true,
+			maxAge: 300,
+			path: '/es/book/modi-qui-dignissimos-sed-assumenda-sint-iusto',
+		});
+	});
+
+	it('correctly takes into account `options`', async () => {
+		const searchParams = new URLSearchParams({
+			post_id: DRAFT_POST_ID.toString(),
+			token: VALID_AUTH_TOKEN.toString(),
+			post_type: 'post',
+		});
+
+		const req = new NextRequest(`https://js1.10up.com?${searchParams.toString()}`);
+
+		const onRedirect = jest.fn(() => {
+			redirect('/');
+		});
+
+		await expect(() =>
+			previewRouteHandler(req, {
+				preparePreviewData({ previewData }) {
+					return { ...previewData, myCustomData: true };
+				},
+				getRedirectPath({ defaultRedirectPath }) {
+					return `${defaultRedirectPath}-preview=true`;
+				},
+				onRedirect,
+			}),
+		).rejects.toThrow('NEXT_REDIRECT');
+
+		expect(nextHeaders.cookies().set).toHaveBeenCalledWith(
+			COOKIE_NAME,
+			JSON.stringify({
+				id: DRAFT_POST_ID,
+				postType: 'post',
+				revision: false,
+				authToken: VALID_AUTH_TOKEN,
+				myCustomData: true,
+			}),
+			{
+				httpOnly: true,
+				maxAge: 300,
+				path: '/modi-qui-dignissimos-sed-assumenda-sint-iusto-preview=true',
+			},
+		);
+
+		expect(onRedirect).toHaveBeenCalledWith({
+			redirectPath: '/modi-qui-dignissimos-sed-assumenda-sint-iusto-preview=true',
+			post: expect.any(Object),
+			postTypeDef: expect.any(Object),
+			previewData: expect.any(Object),
+			req,
+		});
+	});
 });