complete more of the unit tests.

This commit is contained in:
Jordan Hewitt
2024-07-01 08:05:24 -07:00
parent 76fe4eb34a
commit 379f43dcd9
8 changed files with 137 additions and 76 deletions

View File

@ -1,23 +1,31 @@
import React from 'react';
import { render, fireEvent } from '@testing-library/react-native';
import { render, fireEvent, screen } from '@testing-library/react-native';
import { AreaInput } from '../AreaInput';
describe('AreaInput', () => {
it('renders correctly', () => {
const { getByPlaceholderText } = render(<AreaInput units="foot" />);
const lengthInput = getByPlaceholderText('Length');
const widthInput = getByPlaceholderText('Width');
render(<AreaInput lengthLabel='length' widthLabel='width' />);
const lengthInput = screen.getByLabelText('length');
const widthInput = screen.getByLabelText('width');
expect(lengthInput).toBeTruthy();
expect(widthInput).toBeTruthy();
});
it('calls onValueSet when a value is entered', () => {
const onValueSetMock = jest.fn();
const { getByPlaceholderText } = render(
<AreaInput units="foot" onValueSet={onValueSetMock} />
);
const lengthInput = getByPlaceholderText('Length');
const onMeasurementSetMock = jest.fn();
render(<AreaInput onMeasurementSet={onMeasurementSetMock} lengthLabel='length' widthLabel='width' defaultValue={{l: 4, w:4, u: "inch"}}/>);
const lengthInput = screen.getByLabelText('length');
const widthInput = screen.getByLabelText('width');
fireEvent.changeText(lengthInput, '10');
expect(onValueSetMock).toHaveBeenCalledTimes(1);
expect(onMeasurementSetMock).toHaveBeenCalledWith({
l: 10,
w: 4,
u: "inch"
});
fireEvent.changeText(widthInput, '10');
expect(onMeasurementSetMock).toHaveBeenCalledWith({
l: 10,
w: 10,
u: "inch"
});
});
});

View File

@ -1,17 +1,17 @@
import { render, fireEvent } from '@testing-library/react-native';
import { render, fireEvent, screen } from '@testing-library/react-native';
import { MeasurementInput } from '../MeasurementInput';
describe('MeasurementInput', () => {
it('renders correctly', () => {
const { getByPlaceholderText } = render(<MeasurementInput units="foot" defaultValue={10} />);
const input = getByPlaceholderText('Enter measurement');
render(<MeasurementInput units="foot" defaultValue={10} />);
const input = screen.getByLabelText('Enter measurement');
expect(input).toBeTruthy();
});
it('calls onValueSet when value is changed', () => {
const mockOnValueSet = jest.fn();
const { getByPlaceholderText } = render(<MeasurementInput units="foot" defaultValue={10} onValueSet={mockOnValueSet} />);
const input = getByPlaceholderText('Enter measurement');
render(<MeasurementInput units="foot" defaultValue={10} onValueSet={mockOnValueSet} />);
const input = screen.getByLabelText('Enter measurement');
fireEvent.changeText(input, '20');
expect(mockOnValueSet).toHaveBeenCalledWith({ l: 20, u: 'foot' });
});

View File

@ -1,42 +1,70 @@
import React from 'react';
import { render, fireEvent } from '@testing-library/react-native';
import { render, fireEvent, screen, act } from '@testing-library/react-native';
import { Provider } from 'react-redux';
import { store } from '@/app/store';
import ProductCalculatorSelector from '@/components/ProductCalculatorSelector';
import { renderWithProviders } from '@/lib/rendering';
import { Product } from '@/lib/product';
describe('ProductCalculatorSelector', () => {
it('renders correctly', () => {
const { getByText } = render(
<Provider store={store}>
<ProductCalculatorSelector />
</Provider>
);
expect(getByText('Please select a product')).toBeTruthy();
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(
(<ProductCalculatorSelector />),
{
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('updates price when measurement is set', () => {
const { getByTestId, getByText } = render(
<Provider store={store}>
<ProductCalculatorSelector />
</Provider>
it('a product can be selected', () => {
renderWithProviders(
(<ProductCalculatorSelector />),
{
products: [
mockLengthProduct.asObject,
mockAreaProduct.asObject,
]
}
);
// Assume there is a product with a priceFor function that returns 100
const product = {
priceFor: jest.fn().mockReturnValue(100),
};
expect(screen.getByText('Please select a product')).toBeTruthy();
const areaLabel = `${mockAreaProduct.attributes.name} (${mockAreaProduct.pricePerUnitDisplay})`;
const lengthLabel = `${mockLengthProduct.attributes.name} (${mockLengthProduct.pricePerUnitDisplay})`;
// Assume there are units for measurement
const units = ['cm', 'in'];
fireEvent.press(screen.getByText(areaLabel));
const lengthInput = screen.getByLabelText("enter length");
const widthInput = screen.getByLabelText("enter length");
expect(lengthInput).toBeTruthy();
expect(widthInput).toBeTruthy();
// Assume there is a measurement input
const measurementInput = getByTestId('measurement-input');
fireEvent.press(screen.getByText("in"));
// Simulate user input
fireEvent.changeText(measurementInput, '10');
act(() => {
fireEvent.changeText(lengthInput, "2");
fireEvent.changeText(widthInput, "4");
});
jest.advanceTimersByTime(500);
// Check if the price has been updated
expect(getByText('Price: 100')).toBeTruthy();
const price = mockAreaProduct.priceFor({l: 2, w: 4, u: "ft"});
const sPrice = price.toLocaleString(undefined, {maximumFractionDigits: 2, minimumFractionDigits: 2,});
expect(screen.getByLabelText("calculated price").find().toBeTruthy();
});
});