PliWould/components/__tests__/ProductAttributeEditor-test.tsx

import { LumberProduct, Product } from "@/lib/product";
import { ProductAttributeEditor } from "../ProductAttributeEditor";
import { fireEvent, render, screen } from "@testing-library/react-native";
import { renderWithProviders } from "@/lib/rendering";

describe("Product editor tests", () => {
  const productName = "Fun Product";
  it("Product attributes can be deleted", async () => {
    const onChange = jest.fn();
    const onDelete = jest.fn();
    renderWithProviders(
      <ProductAttributeEditor
        attributeKey="name"
        attributeValue="product"
        onChangeAttribute={onChange}
        onDelete={onDelete}
      />
    );
    expect(screen.getByLabelText("Delete Attribute")).not.toBeNull();
    fireEvent.press(await screen.getByLabelText("Delete Attribute"));
    expect(onDelete).toHaveBeenCalled();
  });
  it("Product attributes can be modified", async () => {
    const product: Product = {
      pricePerUnit: 10,
      dimensions: {
        l: 40,
        u: "ft",
      },
      type: "lumber",
    };
    const onChange = jest.fn();
    const onDelete = jest.fn();
    const onKeyChange = jest.fn();
    render(
      <ProductAttributeEditor
        attributeKey="old test key"
        attributeValue="old test value"
        onChangeAttribute={onChange}
        onDelete={onDelete}
        onChangeAttributeKey={onKeyChange}
      />
    );
    fireEvent.changeText(screen.getByLabelText("Edit Key"), "new test key");
    expect(onKeyChange).toHaveBeenCalled();
    fireEvent.changeText(screen.getByLabelText("Edit Value"), "new name");
    expect(onChange).toHaveBeenCalled();
    fireEvent.press(screen.getByLabelText("Delete Attribute"));
    expect(onDelete).toHaveBeenCalled();
  });
});