@linzjs/step-ag-grid 15.1.2 → 16.0.0

package/src/stories/grid/gridFormStatic/GridFormEditBearingCorrection.stories.tsx

@@ -1,9 +1,12 @@
+import "../../../react-menu3/styles/index.scss";
+import "../../../styles/index.scss";
+import "@linzjs/lui/dist/scss/base.scss";
+
 import { ComponentMeta, ComponentStory } from "@storybook/react/dist/ts3.9/client/preview/types-6-3";
 import { GridPopoverContext, GridPopoverContextType } from "contexts/GridPopoverContext";
 import { useRef } from "react";
 
 import "@linzjs/lui/dist/fonts";
-import "@linzjs/lui/dist/scss/base.scss";
 
 import {
   GridContextProvider,

package/src/stories/grid/gridFormStatic/GridFormMessage.stories.tsx

@@ -1,9 +1,12 @@
+import "../../../react-menu3/styles/index.scss";
+import "../../../styles/index.scss";
+import "@linzjs/lui/dist/scss/base.scss";
+
 import { ComponentMeta, ComponentStory } from "@storybook/react/dist/ts3.9/client/preview/types-6-3";
 import { GridPopoverContext, GridPopoverContextType } from "contexts/GridPopoverContext";
 import { useRef } from "react";
 
 import "@linzjs/lui/dist/fonts";
-import "@linzjs/lui/dist/scss/base.scss";
 
 import { GridContextProvider, GridFormMessage } from "../../..";
 

package/src/stories/grid/gridFormStatic/GridFormMultiSelect.stories.tsx

@@ -1,9 +1,12 @@
+import "../../../react-menu3/styles/index.scss";
+import "../../../styles/index.scss";
+import "@linzjs/lui/dist/scss/base.scss";
+
 import { ComponentMeta, ComponentStory } from "@storybook/react/dist/ts3.9/client/preview/types-6-3";
 import { GridPopoverContext, GridPopoverContextType } from "contexts/GridPopoverContext";
 import { useRef } from "react";
 
 import "@linzjs/lui/dist/fonts";
-import "@linzjs/lui/dist/scss/base.scss";
 
 import { GridBaseRow, GridContextProvider, GridFormMultiSelect, GridFormMultiSelectProps } from "../../..";
 

package/src/stories/grid/gridFormStatic/GridFormPopoverMenu.stories.tsx

@@ -1,9 +1,12 @@
+import "../../../react-menu3/styles/index.scss";
+import "../../../styles/index.scss";
+import "@linzjs/lui/dist/scss/base.scss";
+
 import { ComponentMeta, ComponentStory } from "@storybook/react/dist/ts3.9/client/preview/types-6-3";
 import { GridPopoverContext, GridPopoverContextType } from "contexts/GridPopoverContext";
 import { useRef } from "react";
 
 import "@linzjs/lui/dist/fonts";
-import "@linzjs/lui/dist/scss/base.scss";
 
 import {
   GridBaseRow,

package/src/stories/grid/gridFormStatic/GridFormTextArea.stories.tsx

@@ -1,9 +1,12 @@
+import "../../../react-menu3/styles/index.scss";
+import "../../../styles/index.scss";
+import "@linzjs/lui/dist/scss/base.scss";
+
 import { ComponentMeta, ComponentStory } from "@storybook/react/dist/ts3.9/client/preview/types-6-3";
 import { GridPopoverContext, GridPopoverContextType } from "contexts/GridPopoverContext";
 import { useRef } from "react";
 
 import "@linzjs/lui/dist/fonts";
-import "@linzjs/lui/dist/scss/base.scss";
 
 import { GridBaseRow, GridContextProvider, GridFormTextArea, GridFormTextAreaProps } from "../../..";
 

package/src/stories/grid/gridFormStatic/GridFormTextInput.stories.tsx

@@ -1,9 +1,12 @@
+import "../../../react-menu3/styles/index.scss";
+import "../../../styles/index.scss";
+import "@linzjs/lui/dist/scss/base.scss";
+
 import { ComponentMeta, ComponentStory } from "@storybook/react/dist/ts3.9/client/preview/types-6-3";
 import { GridPopoverContext, GridPopoverContextType } from "contexts/GridPopoverContext";
 import { useRef } from "react";
 
 import "@linzjs/lui/dist/fonts";
-import "@linzjs/lui/dist/scss/base.scss";
 
 import { GridBaseRow, GridContextProvider, GridFormTextInput, GridFormTextInputProps } from "../../..";
 

package/src/stories/grid/interactions/GridKeyboardInteractions.stories.tsx

@@ -1,10 +1,13 @@
+import "../../../styles/GridTheme.scss";
+import "../../../styles/index.scss";
+import "@linzjs/lui/dist/scss/base.scss";
+
 import { expect, jest } from "@storybook/jest";
 import { ComponentMeta, ComponentStory } from "@storybook/react/dist/ts3.9/client/preview/types-6-3";
 import { userEvent, waitFor } from "@storybook/testing-library";
 import { useMemo, useState } from "react";
 
 import "@linzjs/lui/dist/fonts";
-import "@linzjs/lui/dist/scss/base.scss";
 
 import {
   ColDefT,
@@ -21,8 +24,6 @@ import {
   MenuOption,
   wait,
 } from "../../../";
-import "../../../styles/GridTheme.scss";
-import "../../../styles/index.scss";
 
 export default {
   title: "Components / Grids",
@@ -34,6 +35,14 @@ export default {
     selectable: false,
     rowSelection: "single",
   },
+  // Storybook hangs otherwise
+  parameters: {
+    docs: {
+      source: {
+        type: "code",
+      },
+    },
+  },
   decorators: [
     (Story) => (
       <div style={{ width: 1024, height: 400 }}>
@@ -223,14 +232,14 @@ GridKeyboardInteractions.play = async ({ canvasElement }) => {
     expect(activeCell).toHaveAttribute("aria-colindex", "1");
     expect(activeCell?.parentElement).toHaveAttribute("row-index", "0");
   });
-  userEvent.keyboard("{arrowdown}{arrowdown}");
-  userEvent.keyboard("{arrowright}{arrowright}{arrowright}{arrowright}{arrowright}{arrowright}{arrowright}");
+  await userEvent.keyboard("{arrowdown}{arrowdown}");
+  await userEvent.keyboard("{arrowright}{arrowright}{arrowright}{arrowright}{arrowright}{arrowright}{arrowright}");
 
   // Test enter post focus
   const test = async (fn: () => any, colId: string, rowId: string) => {
-    userEvent.keyboard("{Enter}");
+    await userEvent.keyboard("{Enter}");
     await wait(1000);
-    userEvent.keyboard("{arrowdown}{arrowdown}");
+    await userEvent.keyboard("{arrowdown}{arrowdown}");
     fn();
     await waitFor(async () => {
       expect(multiEditAction).toHaveBeenCalled();
@@ -247,16 +256,16 @@ GridKeyboardInteractions.play = async ({ canvasElement }) => {
 
   await test(() => userEvent.keyboard("{Enter}"), "8", "2");
   await test(() => userEvent.tab(), "9", "2");
-  userEvent.tab({ shift: true });
+  await userEvent.tab({ shift: true });
   await test(() => userEvent.tab({ shift: true }), "6", "2");
-  userEvent.keyboard("{Esc}");
-  userEvent.tab();
+  await userEvent.keyboard("{Esc}");
+  await userEvent.tab();
 
-  userEvent.keyboard("{Enter}");
+  await userEvent.keyboard("{Enter}");
   await wait(250);
   expect(eAction).not.toHaveBeenCalled();
 
-  userEvent.keyboard("e");
+  await userEvent.keyboard("e");
   await waitFor(async () => {
     expect(eAction).toHaveBeenCalled();
   });

package/src/stories/react-menu/ReactMenu.stories.tsx

@@ -1,3 +1,5 @@
+import "../../react-menu3/styles/index.scss";
+
 import { expect, jest } from "@storybook/jest";
 import { ComponentMeta, ComponentStory } from "@storybook/react/dist/ts3.9/client/preview/types-6-3";
 import { userEvent, within } from "@storybook/testing-library";
@@ -42,7 +44,7 @@ ReactMenuControlled.play = async ({ canvasElement }) => {
   const canvas = within(canvasElement);
 
   const keyboard = async (key: string) => {
-    userEvent.keyboard(key);
+    await userEvent.keyboard(key);
     await wait(100); // Wait for debounce
   };
 
@@ -51,13 +53,13 @@ ReactMenuControlled.play = async ({ canvasElement }) => {
 
   const openMenu = async () => {
     await wait(500); // Wait for debounce
-    userEvent.click(menuButton);
+    await userEvent.click(menuButton);
     expect(await canvas.findByRole("menuitem", { name: "New File" })).toBeInTheDocument();
   };
 
   // Check menu closes on click outside
   await openMenu();
-  userEvent.click(menuButton.parentElement as Element);
+  await userEvent.click(menuButton.parentElement as Element);
   expect(canvas.queryByRole("menuitem", { name: "New File" })).not.toBeInTheDocument();
 
   // Test arrow down/up
@@ -73,7 +75,7 @@ ReactMenuControlled.play = async ({ canvasElement }) => {
   expect(document.activeElement?.innerHTML).toBe("Print...");
 
   // Escape close
-  userEvent.type(menuButton.parentElement as Element, "{Escape}");
+  await userEvent.type(menuButton.parentElement as Element, "{Escape}");
   expect(canvas.queryByRole("menuitem", { name: "New File" })).not.toBeInTheDocument();
 
   // Test enter to select

package/src/utils/testQuick.ts

@@ -70,7 +70,15 @@ const quickSelector = <T extends HTMLElement>(
     els = els.filter(matcher);
   }
 
-  return { selector, els };
+  return {
+    selector: [
+      selector,
+      typeof lastIQueryQuick.text == "string" ? JSON.stringify(lastIQueryQuick.text) : lastIQueryQuick.text,
+    ]
+      .filter((r) => r)
+      .join(" "),
+    els,
+  };
 };
 
 /**
@@ -110,7 +118,7 @@ export const queryAllQuick = <T extends HTMLElement>(filter: IQueryQuick, contai
 export const getAllQuick = <T extends HTMLElement>(filter: IQueryQuick, container?: HTMLElement): T[] => {
   const els = queryAllQuick(filter, container);
   if (els.length == 0) {
-    throw Error(`getAllQuick not found, selector: ${quickSelector(filter)}`);
+    throw Error(`getAllQuick not found, selector: ${quickSelector(filter).selector}`);
   }
   return els as T[];
 };