packages/components/containers/payments/PaymentVerificationImage.spec.tsx

   1 import { render } from '@testing-library/react';
   2
   3 import { PAYMENT_METHOD_TYPES } from '@proton/payments';
   4 import type { CardPayment, PaypalPayment } from '@proton/payments';
   5
   6 import PaymentVerificationImage from './PaymentVerificationImage';
   7
   8 describe('PaymentVerificationImage', () => {
   9     it.each([PAYMENT_METHOD_TYPES.PAYPAL, PAYMENT_METHOD_TYPES.PAYPAL_CREDIT])(
  10         'should render paypal image. Payment method: %s',
  11         (Type) => {
  12             const payment: PaypalPayment = {
  13                 Type: Type as any,
  14             };
  15
  16             const { getByAltText } = render(<PaymentVerificationImage payment={payment} type={Type as any} />);
  17
  18             expect(getByAltText('PayPal')).toBeDefined();
  19         }
  20     );
  21
  22     it('should render Paypal if payment object is empty but the type is defined', () => {
  23         const { getByAltText } = render(<PaymentVerificationImage payment={{}} type={PAYMENT_METHOD_TYPES.PAYPAL} />);
  24
  25         expect(getByAltText('PayPal')).toBeDefined();
  26     });
  27
  28     it('should render image for the respective credit card', () => {
  29         const payment: CardPayment = {
  30             Type: PAYMENT_METHOD_TYPES.CARD,
  31             Details: {
  32                 Number: '4242424242424242',
  33             } as any,
  34         };
  35
  36         const { getByAltText } = render(
  37             <PaymentVerificationImage payment={payment} type={PAYMENT_METHOD_TYPES.CARD} />
  38         );
  39
  40         expect(getByAltText('Visa')).toBeDefined();
  41     });
  42
  43     it('should render nothing if payment is empty and type is card', () => {
  44         const { container } = render(<PaymentVerificationImage payment={{}} type={PAYMENT_METHOD_TYPES.CARD} />);
  45
  46         expect(container).toBeEmptyDOMElement();
  47     });
  48 });