@linzjs/step-ag-grid 7.3.0 → 7.3.1

package/package.json

@@ -2,7 +2,7 @@
   "name": "@linzjs/step-ag-grid",
   "repository": "github:linz/step-ag-grid.git",
   "license": "MIT",
-  "version": "7.3.0",
+  "version": "7.3.1",
   "keywords": [
     "aggrid",
     "ag-grid",

package/src/components/gridForm/GridFormDropDown.tsx

@@ -328,7 +328,9 @@ export const GridFormDropDown = <RowType extends GridBaseRow>(props: GridFormPop
                         }}
                       >
                         {item.subComponent && (
-                          <item.subComponent key={`${fieldToString(field)}-${index}_subcomponent_inner`} />
+                          <div className={"subComponent"}>
+                            <item.subComponent key={`${fieldToString(field)}-${index}_subcomponent_inner`} />
+                          </div>
                         )}
                       </GridSubComponentContext.Provider>
                     )}

package/src/components/gridForm/GridFormMultiSelect.tsx

@@ -414,7 +414,9 @@ const MenuSubComponent = (props: {
               triggerSave,
             }}
           >
-            <item.subComponent />
+            <div className={"subComponent"}>
+              <item.subComponent />
+            </div>
           </GridSubComponentContext.Provider>
         )
       }

package/src/components/gridForm/GridFormPopoverMenu.tsx

@@ -149,7 +149,9 @@ export const GridFormPopoverMenu = <RowType extends GridBaseRow>(props: GridForm
                             triggerSave,
                           }}
                         >
-                          <item.subComponent />
+                          <div className={"subComponent"}>
+                            <item.subComponent />
+                          </div>
                         </GridSubComponentContext.Provider>
                       )
                     }

package/src/components/gridForm/GridFormSubComponentTextArea.tsx

@@ -35,7 +35,7 @@ export const GridFormSubComponentTextArea = <RowType extends GridBaseRow>(
   }, [setValid, invalid, value]);
 
   return (
-    <div className={clsx("FreeTextInput LuiDeprecatedForms", props.className)}>
+    <div className={clsx("FreeTextInput", props.className)}>
       <TextAreaInput
         className={"free-text-input"}
         value={value}

package/src/utils/testUtil.ts

@@ -1,6 +1,7 @@
 import { act, waitFor, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { findQuick, getAllQuick, getMatcher, getQuick, queryQuick } from "./testQuick";
+import { wait } from "./util";
 
 export const findRow = async (rowId: number | string, within?: HTMLElement): Promise<HTMLDivElement> => {
   return findQuick<HTMLDivElement>({ tagName: `div[row-id='${rowId}']:not(:empty)` }, within);
@@ -58,8 +59,8 @@ export const editCell = async (rowId: number | string, colId: string, within?: H
   await act(async () => {
     const cell = await findCell(rowId, colId, within);
     userEvent.dblClick(cell);
-    await findOpenMenu();
   });
+  await findOpenMenu();
 };
 
 const findOpenMenu = async (): Promise<HTMLElement> => findQuick({ classes: ".szh-menu--state-open" });
@@ -73,13 +74,16 @@ export const queryMenuOption = async (menuOptionText: string | RegExp): Promise<
 };
 
 export const findMenuOption = async (menuOptionText: string | RegExp): Promise<HTMLElement> => {
-  return await waitFor(async () => {
-    const menuOption = await queryMenuOption(menuOptionText);
-    if (menuOption == null) {
-      throw Error(`Unable to find menu option ${menuOptionText}`);
-    }
-    return menuOption;
-  });
+  return await waitFor(
+    async () => {
+      const menuOption = await queryMenuOption(menuOptionText);
+      if (menuOption == null) {
+        throw Error(`Unable to find menu option ${menuOptionText}`);
+      }
+      return menuOption;
+    },
+    { timeout: 10000 },
+  );
 };
 
 export const clickMenuOption = async (menuOptionText: string | RegExp): Promise<void> => {
@@ -96,6 +100,7 @@ export const openAndClickMenuOption = async (
   within?: HTMLElement,
 ): Promise<void> => {
   await editCell(rowId, colId, within);
+  await wait(100);
   await clickMenuOption(menuOptionText);
 };
 
@@ -123,13 +128,13 @@ export const clickMultiSelectOption = async (value: string): Promise<void> => {
 
 export const typeOtherInput = async (value: string): Promise<void> => {
   const openMenu = await findOpenMenu();
-  const otherInput = await findQuick({ tagName: "input[type='text']" }, openMenu);
+  const otherInput = await findQuick({ classes: ".subComponent", child: { tagName: "input[type='text']" } }, openMenu);
   userEvent.type(otherInput, value);
 };
 
 export const typeOtherTextArea = async (value: string): Promise<void> => {
   const openMenu = await findOpenMenu();
-  const otherTextArea = await findQuick({ tagName: "textarea" }, openMenu);
+  const otherTextArea = await findQuick({ classes: ".subComponent", child: { tagName: "textarea" } }, openMenu);
   userEvent.type(otherTextArea, value);
 };