import { Product } from "@/lib/product"
import {ProductAttributeEditor} from "../ProductAttributeEditor"
import { area } from "enheter"
import { fireEvent, render, screen } from '@testing-library/react-native';
import React from "react";
import { emitTypingEvents } from "@testing-library/react-native/build/user-event/type/type";

describe("Product editor tests", () => {
    it("Product attributes can be deleted", async () => {
        const product = new Product(
            100,
            area("squareFoot", 4 * 7)
        );
        const onChange = jest.fn();
        const onDelete = jest.fn();
        render(
            <ProductAttributeEditor
                attributeKey="name"
                attributeValue="product"
                product={product}
                onChange={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 productName = "Fun Product";
        const product = new Product(
            100,
            area("squareFoot", 4 * 7),
            { name: productName },
        );
        const onChange = jest.fn();
        const onDelete = jest.fn();
        render(
            <ProductAttributeEditor
                attributeKey="Name"
                attributeValue="product"
                product={product}
                onChange={onChange}
                onDelete={onDelete}
            />);
        fireEvent.press(screen.getByText("product")); // Use getByText instead of findByText
        fireEvent.changeText(screen.getByLabelText("Edit Value"), "new name");
        expect(onChange).toHaveBeenCalled();
    })

})