fix: use redirect: "manual"

Author: angeloashmore

src/PrismicPreviewClient.tsx

@@ -43,15 +43,17 @@ export function PrismicPreviewClient(props: PrismicPreviewClientProps): null {
 		if (hasCookieForRepository && !isDraftMode) {
 			console.log("starting preview link");
 
-			// We check for `res.redirected` rather than `res.ok`
-			// since the update preview endpoint may redirect to a
-			// 404 page. As long as it redirects, we know the
-			// endpoint exists and at least attempted to set preview
-			// data.
+			// We check `opaqueredirect` because we don't care if
+			// the redirect was successful or not. As long as it
+			// redirects, we know the endpoint exists and draft mode
+			// is active.
 			globalThis
-				.fetch(updatePreviewURL, { signal: controller.signal })
+				.fetch(updatePreviewURL, {
+					redirect: "manual",
+					signal: controller.signal,
+				})
 				.then((res) => {
-					if (!res.redirected) {
+					if (res.type !== "opaqueredirect") {
 						console.error(
 							`[<PrismicPreview>] Failed to start the preview using "${updatePreviewURL}". Does it exist?`,
 						);

src/pages/PrismicPreview.tsx

@@ -101,14 +101,16 @@ export function PrismicPreview(props: PrismicPreviewProps): JSX.Element {
 		}
 
 		function start() {
-			// We check for `res.redirected` rather than `res.ok`
-			// since the update preview endpoint may redirect to a
-			// 404 page. As long as it redirects, we know the
-			// endpoint exists and at least attempted to set preview
-			// data.
-			fetch(router.basePath + updatePreviewURL, { signal: controller.signal })
+			// We check `opaqueredirect` because we don't care if
+			// the redirect was successful or not. As long as it
+			// redirects, we know the endpoint exists and at least
+			// attempted to set preview data.
+			fetch(router.basePath + updatePreviewURL, {
+				redirect: "manual",
+				signal: controller.signal,
+			})
 				.then((res) => {
-					if (!res.redirected) {
+					if (res.type !== "opaqueredirect") {
 						console.error(
 							`[<PrismicPreview>] Failed to start or update the preview using "${updatePreviewURL}". Does it exist?`,
 						);

tests/previews.spec.ts

@@ -83,7 +83,7 @@ test("supports custom update endpoint", async ({ appPage, repo, pageDoc }) => {
 		pageDoc,
 		content({ payload: "foo" }),
 	);
-	await appPage.preview(updatedDocument);
+	await repo.createPreviewSession(updatedDocument);
 	await appPage.goToDocument(updatedDocument, "/with-custom-preview-endpoints");
 	await expect(appPage.payload).toContainText("foo", { timeout: 30000 });
 	await expect(appPage.toolbar).toHaveCount(1);
@@ -96,7 +96,7 @@ test("supports custom exit endpoint", async ({ appPage, repo, pageDoc }) => {
 		pageDoc,
 		content({ payload: "foo" }),
 	);
-	await appPage.preview(updatedDocument);
+	await repo.createPreviewSession(updatedDocument);
 	await appPage.goToDocument(updatedDocument, "/with-custom-preview-endpoints");
 	await expect(appPage.payload).toContainText("foo", { timeout: 30000 });
 	await expect(appPage.toolbar).toHaveCount(1);