attempt to fix unit tests.

components/__tests__/ProductAttributeEditor-test.tsx

@@ -0,0 +1,27 @@
+import { Product } from "@/lib/product"
+import ProductAttributeEditor from "../ProductAttributeEditor"
+import { renderWithProviders } from "./util"
+import { area } from "enheter"
+import {screen} from '@testing-library/react-native';
+import React from "react";
+
+describe("Product editor tests", () => {
+    it("Product attributes render", () => {
+        const product = new Product(
+            100,
+            area("squareFoot", 4 * 7)
+        );
+        const onChange = jest.fn();
+        const onDelete = jest.fn();
+        renderWithProviders(
+        <ProductAttributeEditor
+            key="Name"
+            value="product"
+            product={product}
+            onChange={onChange}
+            onDelete={onDelete}
+        />);
+        expect(screen.findByLabelText("Delete Attribute")).not.toBeNull();
+
+    })
+})

components/__tests__/util.tsx

@@ -0,0 +1,41 @@
+import { RenderOptions, render } from "@testing-library/react-native";
+import { PropsWithChildren, ReactElement } from "react";
+import { Provider } from "react-redux";
+import { setupStore, RootState } from "@/app/store";
+import { Price, Product } from "@/lib/product";
+import { area, length } from "enheter";
+
+export interface ExtendedRenderOptions extends Omit<RenderOptions, 'queries'> {
+    preloadedState?: Partial<RootState>;
+    store?: any; // TODO
+}
+
+const basicState = {
+    products: [
+        new Product(20.00, length("foot", 5), {name: "Track"}),
+        new Product(20.00, area("squareFoot", 5), {name: "Shelf"}),
+    ]
+}
+
+export function renderWithProviders(
+    ui: ReactElement,
+    preloadedState = basicState,
+    extendedRenderOptions: ExtendedRenderOptions = {},
+) {
+    const {
+        // Automatically create a store instance if no store was passed in
+        store = setupStore(preloadedState as Partial<RootState>),
+        ...renderOptions
+    } = extendedRenderOptions;
+
+    const Wrapper = ({ children }: PropsWithChildren) => (
+        <Provider store={store}>{children}</Provider>
+    );
+
+    // Return an object with the store and all of RTL's query functions
+    return {
+        store,
+        ...render(ui, { wrapper: Wrapper, ...renderOptions })
+    };
+}
+