Allowing local lemonsqueezy payment skip and emulate success response
This commit is contained in:
@@ -13,6 +13,8 @@ import { Switch } from '@/components/ui/switch';
|
||||
import { Separator } from '@/components/ui/separator';
|
||||
import { useConsent, ConsentPreferences } from '@/contexts/consent';
|
||||
|
||||
const SKIP_BANNER_STORAGE_KEY = 'fotospiel.consent.skip';
|
||||
|
||||
const CookieBanner: React.FC = () => {
|
||||
const { t } = useTranslation('common');
|
||||
const {
|
||||
@@ -28,6 +30,35 @@ const CookieBanner: React.FC = () => {
|
||||
|
||||
const [draftPreferences, setDraftPreferences] = useState<ConsentPreferences>(preferences);
|
||||
|
||||
const shouldSkipBanner = useMemo(() => {
|
||||
if (typeof window === 'undefined') {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!import.meta.env.DEV) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const params = new URLSearchParams(window.location.search);
|
||||
const hasSkipParam = params.get('consent') === 'skip' || params.get('cookieBanner') === 'off';
|
||||
|
||||
if (hasSkipParam) {
|
||||
try {
|
||||
window.localStorage.setItem(SKIP_BANNER_STORAGE_KEY, '1');
|
||||
} catch (error) {
|
||||
console.warn('[Consent] Failed to persist skip flag', error);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
try {
|
||||
return window.localStorage.getItem(SKIP_BANNER_STORAGE_KEY) === '1';
|
||||
} catch (error) {
|
||||
console.warn('[Consent] Failed to read skip flag', error);
|
||||
return false;
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (isPreferencesOpen) {
|
||||
setDraftPreferences(preferences);
|
||||
@@ -51,6 +82,10 @@ const CookieBanner: React.FC = () => {
|
||||
closePreferences();
|
||||
};
|
||||
|
||||
if (shouldSkipBanner) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{showBanner && !isPreferencesOpen && (
|
||||
|
||||
@@ -0,0 +1,77 @@
|
||||
import React from 'react';
|
||||
import { describe, expect, it, beforeEach, afterEach, vi } from 'vitest';
|
||||
import { render, screen } from '@testing-library/react';
|
||||
|
||||
const consentMock = vi.fn();
|
||||
|
||||
vi.mock('@/contexts/consent', () => ({
|
||||
useConsent: () => consentMock(),
|
||||
}));
|
||||
|
||||
vi.mock('react-i18next', () => ({
|
||||
useTranslation: () => ({
|
||||
t: (key: string) => key,
|
||||
}),
|
||||
}));
|
||||
|
||||
vi.mock('@/components/ui/button', () => ({
|
||||
Button: ({ children, ...props }: { children: React.ReactNode }) => (
|
||||
<button type="button" {...props}>
|
||||
{children}
|
||||
</button>
|
||||
),
|
||||
}));
|
||||
|
||||
vi.mock('@/components/ui/dialog', () => ({
|
||||
Dialog: ({ children }: { children: React.ReactNode }) => <div>{children}</div>,
|
||||
DialogContent: ({ children }: { children: React.ReactNode }) => <div>{children}</div>,
|
||||
DialogDescription: ({ children }: { children: React.ReactNode }) => <div>{children}</div>,
|
||||
DialogFooter: ({ children }: { children: React.ReactNode }) => <div>{children}</div>,
|
||||
DialogHeader: ({ children }: { children: React.ReactNode }) => <div>{children}</div>,
|
||||
DialogTitle: ({ children }: { children: React.ReactNode }) => <div>{children}</div>,
|
||||
}));
|
||||
|
||||
vi.mock('@/components/ui/switch', () => ({
|
||||
Switch: () => <input type="checkbox" />,
|
||||
}));
|
||||
|
||||
vi.mock('@/components/ui/separator', () => ({
|
||||
Separator: () => <hr />,
|
||||
}));
|
||||
|
||||
import CookieBanner from '../CookieBanner';
|
||||
|
||||
describe('CookieBanner', () => {
|
||||
beforeEach(() => {
|
||||
consentMock.mockReturnValue({
|
||||
showBanner: true,
|
||||
acceptAll: vi.fn(),
|
||||
rejectAll: vi.fn(),
|
||||
preferences: { analytics: false, functional: true },
|
||||
savePreferences: vi.fn(),
|
||||
isPreferencesOpen: false,
|
||||
openPreferences: vi.fn(),
|
||||
closePreferences: vi.fn(),
|
||||
});
|
||||
|
||||
window.localStorage.removeItem('fotospiel.consent.skip');
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
window.localStorage.removeItem('fotospiel.consent.skip');
|
||||
});
|
||||
|
||||
it('renders the banner by default', () => {
|
||||
render(<CookieBanner />);
|
||||
|
||||
expect(screen.getByText('consent.banner.title')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('hides the banner when the dev skip flag is set', () => {
|
||||
window.localStorage.setItem('fotospiel.consent.skip', '1');
|
||||
|
||||
render(<CookieBanner />);
|
||||
|
||||
expect(screen.queryByText('consent.banner.title')).not.toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
@@ -1,8 +1,9 @@
|
||||
import React from 'react';
|
||||
import React, { useEffect } from 'react';
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
import { cleanup, render, screen } from '@testing-library/react';
|
||||
import { CheckoutWizardProvider } from '../WizardContext';
|
||||
import { CheckoutWizardProvider, useCheckoutWizard } from '../WizardContext';
|
||||
import { PaymentStep } from '../steps/PaymentStep';
|
||||
import { fireEvent, waitFor } from '@testing-library/react';
|
||||
|
||||
vi.mock('@/hooks/useAnalytics', () => ({
|
||||
useAnalytics: () => ({ trackEvent: vi.fn() }),
|
||||
@@ -14,6 +15,21 @@ const basePackage = {
|
||||
lemonsqueezy_variant_id: 'pri_test_123',
|
||||
};
|
||||
|
||||
const StepIndicator = () => {
|
||||
const { currentStep } = useCheckoutWizard();
|
||||
return <div data-testid="current-step">{currentStep}</div>;
|
||||
};
|
||||
|
||||
const AuthSeeder = () => {
|
||||
const { setAuthUser } = useCheckoutWizard();
|
||||
|
||||
useEffect(() => {
|
||||
setAuthUser({ id: 1, email: 'demo@example.com' });
|
||||
}, [setAuthUser]);
|
||||
|
||||
return null;
|
||||
};
|
||||
|
||||
describe('PaymentStep', () => {
|
||||
beforeEach(() => {
|
||||
localStorage.clear();
|
||||
@@ -21,11 +37,13 @@ describe('PaymentStep', () => {
|
||||
Setup: vi.fn(),
|
||||
Url: { Open: vi.fn() },
|
||||
};
|
||||
vi.stubGlobal('fetch', vi.fn());
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
cleanup();
|
||||
delete window.LemonSqueezy;
|
||||
vi.unstubAllGlobals();
|
||||
});
|
||||
|
||||
it('renders the payment experience without crashing', async () => {
|
||||
@@ -38,4 +56,64 @@ describe('PaymentStep', () => {
|
||||
expect(await screen.findByText('checkout.payment_step.guided_title')).toBeInTheDocument();
|
||||
expect(screen.queryByText('checkout.legal.checkbox_digital_content_label')).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('skips Lemon Squeezy payment when backend simulates checkout', async () => {
|
||||
const fetchMock = vi.mocked(fetch);
|
||||
fetchMock.mockImplementation(async (input) => {
|
||||
if (typeof input === 'string' && input.includes('/sanctum/csrf-cookie')) {
|
||||
return {
|
||||
ok: true,
|
||||
status: 204,
|
||||
redirected: false,
|
||||
url: '',
|
||||
text: async () => '',
|
||||
} as Response;
|
||||
}
|
||||
|
||||
if (typeof input === 'string' && input.includes('/lemonsqueezy/create-checkout')) {
|
||||
return {
|
||||
ok: true,
|
||||
status: 200,
|
||||
redirected: false,
|
||||
url: '',
|
||||
text: async () => JSON.stringify({
|
||||
simulated: true,
|
||||
checkout_session_id: 'session_123',
|
||||
order_id: 'order_123',
|
||||
id: 'chk_123',
|
||||
}),
|
||||
} as Response;
|
||||
}
|
||||
|
||||
return {
|
||||
ok: true,
|
||||
status: 200,
|
||||
redirected: false,
|
||||
url: '',
|
||||
text: async () => '',
|
||||
} as Response;
|
||||
});
|
||||
|
||||
render(
|
||||
<CheckoutWizardProvider
|
||||
initialPackage={basePackage}
|
||||
packageOptions={[basePackage]}
|
||||
initialStep="payment"
|
||||
>
|
||||
<AuthSeeder />
|
||||
<StepIndicator />
|
||||
<PaymentStep />
|
||||
</CheckoutWizardProvider>,
|
||||
);
|
||||
|
||||
fireEvent.click(await screen.findByRole('checkbox'));
|
||||
const ctas = await screen.findAllByText('checkout.payment_step.pay_with_lemonsqueezy');
|
||||
fireEvent.click(ctas[0]);
|
||||
|
||||
await waitFor(() => {
|
||||
expect(screen.getByTestId('current-step')).toHaveTextContent('confirmation');
|
||||
});
|
||||
|
||||
expect(window.LemonSqueezy?.Url.Open).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -465,7 +465,7 @@ export const PaymentStep: React.FC = () => {
|
||||
console.info('[Checkout] Lemon Squeezy checkout response', { status: response.status, rawBody });
|
||||
}
|
||||
|
||||
let data: { checkout_url?: string; message?: string } | null = null;
|
||||
let data: { checkout_url?: string; message?: string; simulated?: boolean; order_id?: string; checkout_id?: string; id?: string; checkout_session_id?: string } | null = null;
|
||||
try {
|
||||
data = rawBody && rawBody.trim().startsWith('{') ? JSON.parse(rawBody) : null;
|
||||
} catch (parseError) {
|
||||
@@ -473,8 +473,24 @@ export const PaymentStep: React.FC = () => {
|
||||
data = null;
|
||||
}
|
||||
|
||||
if (data && typeof (data as { checkout_session_id?: string }).checkout_session_id === 'string') {
|
||||
setCheckoutSessionId((data as { checkout_session_id?: string }).checkout_session_id ?? null);
|
||||
const checkoutSession = data?.checkout_session_id ?? null;
|
||||
if (checkoutSession && typeof checkoutSession === 'string') {
|
||||
setCheckoutSessionId(checkoutSession);
|
||||
}
|
||||
|
||||
if (data?.simulated) {
|
||||
const orderId = typeof data.order_id === 'string' ? data.order_id : null;
|
||||
const checkoutId = typeof data.checkout_id === 'string'
|
||||
? data.checkout_id
|
||||
: (typeof data.id === 'string' ? data.id : null);
|
||||
|
||||
setStatus('processing');
|
||||
setMessage(t('checkout.payment_step.processing_confirmation'));
|
||||
setInlineActive(false);
|
||||
setPendingConfirmation({ orderId, checkoutId });
|
||||
setPaymentCompleted(true);
|
||||
nextStep();
|
||||
return;
|
||||
}
|
||||
|
||||
let checkoutUrl: string | null = typeof data?.checkout_url === 'string' ? data.checkout_url : null;
|
||||
|
||||
Reference in New Issue
Block a user