import { render, fireEvent, screen, act, within } from '@testing-library/react-native'; import { Provider } from 'react-redux'; import ProductCalculatorSelector from '@/components/ProductCalculatorSelector'; import { renderWithProviders } from '@/lib/rendering'; import { Product } from '@/lib/product'; describe('ProductCalculatorSelector', () => { const mockAreaProduct = new Product( 100, { l: 4, w: 8, u: "ft" }, {"name": "area product"}, ); const mockLengthProduct = new Product( 100, { l: 4, u: "ft" }, {"name": "length product"}, ); it('renders correctly', () => { renderWithProviders( (), { products: [ mockAreaProduct.asObject, mockLengthProduct.asObject, ], } ) expect(screen.getByText('Please select a product')).toBeTruthy(); const label = `${mockAreaProduct.attributes.name} (${mockAreaProduct.pricePerUnitDisplay})`; expect(screen.getByText(label)).toBeTruthy(); }); it('a product can be selected', () => { renderWithProviders( (), { products: [ mockLengthProduct.asObject, mockAreaProduct.asObject, ] } ); expect(screen.getByText('Please select a product')).toBeTruthy(); const areaLabel = `${mockAreaProduct.attributes.name} (${mockAreaProduct.pricePerUnitDisplay})`; const lengthLabel = `${mockLengthProduct.attributes.name} (${mockLengthProduct.pricePerUnitDisplay})`; fireEvent.press(screen.getByText(areaLabel)); const lengthInput = screen.getByLabelText("enter length"); const widthInput = screen.getByLabelText("enter length"); expect(lengthInput).toBeTruthy(); expect(widthInput).toBeTruthy(); fireEvent.press(screen.getByText("in")); act(() => { fireEvent.changeText(lengthInput, "2"); fireEvent.changeText(widthInput, "4"); }); jest.advanceTimersByTime(3000); const price = mockAreaProduct.priceFor({l: 2, w: 4, u: "ft"}); const sPrice = price.toLocaleString(undefined, {maximumFractionDigits: 2, minimumFractionDigits: 2,}); const element = screen.getByLabelText("calculated price"); const {getByText} = within(element); expect(getByText(sPrice)).toBeTruthy(); }); });