Fix: Ensure Accurate Detection of WordPress Previews via URL Query Pa…

…rameters (#1911)

* fix(WordPressTemplate): fix issue when is-preview check is too greedy

* chore(changeset): add changeset

.changeset/heavy-rats-enjoy.md

@@ -0,0 +1,5 @@
+---
+'@faustwp/core': patch
+---
+
+Bug: Fixes issue with review detection via query string is too greedy and catches non WP previews

packages/faustwp-core/src/components/WordPressTemplate.tsx

@@ -15,6 +15,7 @@ import { useAuth } from '../hooks/useAuth.js';
 import { SEED_QUERY, SeedNode } from '../queries/seedQuery.js';
 import { FaustContext, FaustQueries } from '../store/FaustContext.js';
 import { getQueryParam } from '../utils/convert.js';
+import { isWordPressPreview } from '../utils/isWordPressPreview.js';
 
 export type FaustProps = {
   __SEED_NODE__?: SeedNode | null;
@@ -204,9 +205,8 @@ export function WordPressTemplate(props: WordPressTemplateProps) {
       return;
     }
 
-    setIsPreview(window.location.search.includes('preview=true'));
+    setIsPreview(isWordPressPreview(window.location.search));
   }, []);
-
   /**
    * If we are on a preview route and there is no authenticated user, redirect
    * them to the login page

packages/faustwp-core/src/utils/isWordPressPreview.ts

@@ -0,0 +1,5 @@
+// Helper function to check if the URL is a WordPress preview
+export function isWordPressPreview(search: string) {
+  const params = new URLSearchParams(search);
+  return params.has('preview') && params.get('preview') === 'true';
+}

packages/faustwp-core/tests/components/WordPressTemplate.test.tsx

@@ -27,56 +27,6 @@ describe('<WordPressTemplate />', () => {
     );
   });
 
-  test('Properly determines whether or not the given URL is a preview or not', async () => {
-    const getConfigSpy = jest.spyOn(getConfig, 'getConfig').mockReturnValue({
-      templates: {},
-    });
-
-    const useAuthSpy = jest.spyOn(useAuth, 'useAuth').mockReturnValue({
-      isAuthenticated: false,
-      isReady: true,
-      loginUrl: null,
-    });
-
-    delete (window as any).location;
-    window.location = new URL('http://localhost:3000') as any as Location;
-
-    const stringIncludesSpy = jest.spyOn(String.prototype, 'includes');
-
-    await act(async () => {
-      render(
-        <WordPressTemplate.WordPressTemplate
-          __SEED_NODE__={{ databaseId: '1' }}
-          __TEMPLATE_QUERY_DATA__={{ fakeData: true }}
-        />,
-      );
-    });
-
-    expect(window.location.search.includes).toHaveBeenLastCalledWith(
-      'preview=true',
-    );
-    expect(window.location.search.includes).toReturnWith(false);
-
-    delete (window as any).location;
-    window.location = new URL(
-      'http://localhost:3000?preview=true&p=40',
-    ) as any as Location;
-
-    await act(async () => {
-      render(
-        <WordPressTemplate.WordPressTemplate
-          __SEED_NODE__={{ databaseId: '1' }}
-          __TEMPLATE_QUERY_DATA__={{ fakeData: true }}
-        />,
-      );
-    });
-
-    expect(window.location.search.includes).toHaveBeenLastCalledWith(
-      'preview=true',
-    );
-    expect(window.location.search.includes).toReturnWith(true);
-  });
-
   test('Properly redirects to login URL on preview route with no logged in user', async () => {
     const getConfigSpy = jest.spyOn(getConfig, 'getConfig').mockReturnValue({
       templates: {},

packages/faustwp-core/tests/utils/isWordPressPreview.test.ts

@@ -0,0 +1,23 @@
+import { isWordPressPreview } from '../../src/utils/isWordPressPreview';
+
+describe('isWordPressPreview', () => {
+  it('returns true if the search string contains preview=true', () => {
+    expect(isWordPressPreview('?preview=true')).toBe(true);
+    expect(isWordPressPreview('?foo=bar&preview=true')).toBe(true);
+  });
+
+  it('returns false if the search string does not contain preview=true', () => {
+    expect(isWordPressPreview('?preview=false')).toBe(false);
+    expect(isWordPressPreview('?foo=bar')).toBe(false);
+    expect(isWordPressPreview('?otpreview=true')).toBe(false);
+  });
+
+  it('returns false if the search string is empty', () => {
+    expect(isWordPressPreview('')).toBe(false);
+  });
+
+  it('returns false if the preview parameter is not exactly true', () => {
+    expect(isWordPressPreview('?preview=1')).toBe(false);
+    expect(isWordPressPreview('?preview=yes')).toBe(false);
+  });
+});