import React from 'react';
import { screen } from '@testing-library/react';
import { renderInAppContext } from '@theorchard/suite-testing';
import * as productQuery from 'src/apollo/queries/product-search';
import ContractTermProductName from 'src/components/contract-detail/contract-term-product-name';

describe('<ContractTermProductName>', () => {
    const mockProduct = { productByUpc: { productName: 'Some Name' } };

    afterEach(jest.restoreAllMocks);

    beforeEach(() => {
        jest.spyOn(productQuery, 'useProductByUpc').mockReturnValue({
            // @ts-expect-error fixture type doesn't exactly match
            data: mockProduct,
            getProductByUpc: jest.fn().mockReturnValue(mockProduct),
            loading: false,
        });
    });

    const props = { productUpc: '192562992500' };
    const render = () =>
        renderInAppContext(<ContractTermProductName {...props} />);

    it('renders', () => {
        const { container } = render();
        expect(container).toBeDefined();
    });

    it('renders product name', () => {
        render();
        expect(screen.getByText('Some Name')).toBeDefined();
        expect(screen.getByText('192562992500')).toBeDefined();
    });
});