|
| 1 | +import { render, screen } from '@testing-library/vue' |
| 2 | +import userEvent from '@testing-library/user-event' |
| 3 | +import { beforeEach, describe, expect, it, vi } from 'vitest' |
| 4 | +import { defineComponent, h, nextTick } from 'vue' |
| 5 | +import { createI18n } from 'vue-i18n' |
| 6 | + |
| 7 | +import type { BalanceInfo } from '@/composables/billing/types' |
| 8 | + |
| 9 | +import CreditsPanel from './CreditsPanel.vue' |
| 10 | + |
| 11 | +const billingMocks = vi.hoisted(() => ({ |
| 12 | + balance: { value: null as BalanceInfo | null }, |
| 13 | + manageSubscription: vi.fn() |
| 14 | +})) |
| 15 | +vi.mock('@/composables/billing/useBillingContext', async () => { |
| 16 | + const { ref } = await import('vue') |
| 17 | + const balance = ref<BalanceInfo | null>(null) |
| 18 | + Object.defineProperty(billingMocks, 'balance', { get: () => balance }) |
| 19 | + return { |
| 20 | + useBillingContext: () => ({ |
| 21 | + balance, |
| 22 | + manageSubscription: billingMocks.manageSubscription |
| 23 | + }) |
| 24 | + } |
| 25 | +}) |
| 26 | + |
| 27 | +const refreshActivity = vi.hoisted(() => vi.fn()) |
| 28 | +vi.mock('./UsageLogsTable.vue', async () => { |
| 29 | + const { defineComponent, h } = await import('vue') |
| 30 | + return { |
| 31 | + default: defineComponent({ |
| 32 | + setup(_props, { expose }) { |
| 33 | + expose({ refresh: refreshActivity }) |
| 34 | + return () => h('div', { 'data-testid': 'usage-logs-table' }) |
| 35 | + } |
| 36 | + }) |
| 37 | + } |
| 38 | +}) |
| 39 | + |
| 40 | +vi.mock('@/platform/cloud/subscription/components/CreditsTile.vue', () => ({ |
| 41 | + default: defineComponent({ setup: () => () => h('div') }) |
| 42 | +})) |
| 43 | + |
| 44 | +vi.mock('@/platform/telemetry', () => ({ |
| 45 | + useTelemetry: () => ({ trackHelpResourceClicked: vi.fn() }) |
| 46 | +})) |
| 47 | + |
| 48 | +vi.mock('@/stores/commandStore', () => ({ |
| 49 | + useCommandStore: () => ({ execute: vi.fn() }) |
| 50 | +})) |
| 51 | + |
| 52 | +vi.mock('@/composables/useExternalLink', () => ({ |
| 53 | + useExternalLink: () => ({ |
| 54 | + buildDocsUrl: () => 'https://docs.comfy.org', |
| 55 | + docsPaths: { partnerNodesPricing: '/partner-nodes' } |
| 56 | + }) |
| 57 | +})) |
| 58 | + |
| 59 | +const i18n = createI18n({ |
| 60 | + legacy: false, |
| 61 | + locale: 'en', |
| 62 | + messages: { |
| 63 | + en: { |
| 64 | + credits: { |
| 65 | + credits: 'Credits', |
| 66 | + activity: 'Activity', |
| 67 | + invoiceHistory: 'Invoice History', |
| 68 | + faqs: 'FAQs', |
| 69 | + messageSupport: 'Message Support' |
| 70 | + }, |
| 71 | + subscription: { partnerNodesCredits: 'Partner Nodes Credits' } |
| 72 | + } |
| 73 | + } |
| 74 | +}) |
| 75 | + |
| 76 | +function makeBalance(amountMicros: number): BalanceInfo { |
| 77 | + return { |
| 78 | + amountMicros, |
| 79 | + currency: 'usd', |
| 80 | + effectiveBalanceMicros: amountMicros, |
| 81 | + prepaidBalanceMicros: 0, |
| 82 | + cloudCreditBalanceMicros: 0 |
| 83 | + } |
| 84 | +} |
| 85 | + |
| 86 | +describe('CreditsPanel', () => { |
| 87 | + beforeEach(() => { |
| 88 | + billingMocks.balance.value = null |
| 89 | + }) |
| 90 | + |
| 91 | + function renderComponent() { |
| 92 | + return render(CreditsPanel, { |
| 93 | + global: { plugins: [i18n], stubs: { Divider: true } } |
| 94 | + }) |
| 95 | + } |
| 96 | + |
| 97 | + it('opens the billing portal for the active billing rail', async () => { |
| 98 | + const user = userEvent.setup() |
| 99 | + renderComponent() |
| 100 | + |
| 101 | + await user.click(screen.getByRole('button', { name: /Invoice History/ })) |
| 102 | + |
| 103 | + expect(billingMocks.manageSubscription).toHaveBeenCalledOnce() |
| 104 | + }) |
| 105 | + |
| 106 | + it('refreshes activity on a balance change but not on first hydration', async () => { |
| 107 | + renderComponent() |
| 108 | + |
| 109 | + billingMocks.balance.value = makeBalance(5000) |
| 110 | + await nextTick() |
| 111 | + expect(refreshActivity).not.toHaveBeenCalled() |
| 112 | + |
| 113 | + billingMocks.balance.value = makeBalance(9000) |
| 114 | + await nextTick() |
| 115 | + expect(refreshActivity).toHaveBeenCalledOnce() |
| 116 | + }) |
| 117 | +}) |
0 commit comments