96 lines
2.8 KiB
TypeScript
96 lines
2.8 KiB
TypeScript
import { PricingConfig } from '@/types/pricing';
|
|
import { fireEvent, render, screen } from '@testing-library/react';
|
|
import { beforeEach, describe, expect, it, vi } from 'vitest';
|
|
import { UpgradeDialog } from './upgrade-dialog';
|
|
|
|
const mocks = vi.hoisted(() => ({ captureEvent: vi.fn() }));
|
|
|
|
vi.mock('@/lib/posthog', () => ({ captureEvent: mocks.captureEvent }));
|
|
|
|
const pricing: PricingConfig = {
|
|
plans: {
|
|
monthly: {
|
|
name: 'Monthly',
|
|
price: 3.99,
|
|
original_price: null,
|
|
stripe_lookup_key: 'monthly',
|
|
billing_period: 'month',
|
|
features: [],
|
|
},
|
|
yearly: {
|
|
name: 'Annual',
|
|
price: 23.88,
|
|
original_price: 47.88,
|
|
stripe_lookup_key: 'yearly',
|
|
billing_period: 'year',
|
|
features: [],
|
|
},
|
|
},
|
|
defaultPlan: 'yearly',
|
|
bestValuePlan: 'yearly',
|
|
promo: { enabled: false, code: '', description: '', badge: '' },
|
|
currency: 'EUR',
|
|
};
|
|
|
|
vi.mock('@inertiajs/react', () => ({
|
|
usePage: () => ({ props: { pricing, locale: 'en' } }),
|
|
}));
|
|
|
|
function renderDialog() {
|
|
return render(
|
|
<UpgradeDialog
|
|
open
|
|
onOpenChange={vi.fn()}
|
|
title="Bank connections are a paid feature"
|
|
description="Subscribe to sync your bank."
|
|
source="connections"
|
|
/>,
|
|
);
|
|
}
|
|
|
|
describe('UpgradeDialog', () => {
|
|
beforeEach(() => vi.clearAllMocks());
|
|
|
|
it('renders the per-feature title and description', () => {
|
|
renderDialog();
|
|
|
|
expect(
|
|
screen.getByText('Bank connections are a paid feature'),
|
|
).toBeInTheDocument();
|
|
expect(
|
|
screen.getByText('Subscribe to sync your bank.'),
|
|
).toBeInTheDocument();
|
|
});
|
|
|
|
it('links checkout with the selected plan and the upsell source', () => {
|
|
renderDialog();
|
|
|
|
const link = screen
|
|
.getByRole('button', { name: /Upgrade to Standard Plan/ })
|
|
.closest('a');
|
|
// Default plan is the configured default (yearly), and the source rides
|
|
// along so the subscription can be attributed to this upsell point.
|
|
expect(link).toHaveAttribute(
|
|
'href',
|
|
expect.stringContaining('plan=yearly'),
|
|
);
|
|
expect(link).toHaveAttribute(
|
|
'href',
|
|
expect.stringContaining('source=connections'),
|
|
);
|
|
});
|
|
|
|
it('captures a checkout-started event tagged with the source', () => {
|
|
renderDialog();
|
|
|
|
fireEvent.click(
|
|
screen.getByRole('button', { name: /Upgrade to Standard Plan/ }),
|
|
);
|
|
|
|
expect(mocks.captureEvent).toHaveBeenCalledWith(
|
|
'upgrade_checkout_started',
|
|
{ source: 'connections', plan: 'yearly' },
|
|
);
|
|
});
|
|
});
|