cx 26.0.14 → 26.1.1

package/src/ui/IsolatedScope.spec.tsx

@@ -1,22 +1,25 @@
 import { Store } from "../data/Store";
-import { createTestRenderer } from "../util/test/createTestRenderer";
+import { createTestRenderer, act } from "../util/test/createTestRenderer";
 import assert from "assert";
 import { IsolatedScope } from "./IsolatedScope";
 import { bind } from "./bind";
 
 describe("IsolatedScope", () => {
-   it("prevents multiple re-renders", () => {
+   it("prevents multiple re-renders", async () => {
       let list: any[] = [];
       let widget = (
          <cx>
             <IsolatedScope
                data={{
-                  value: { bind: 'value' }
+                  value: { bind: "value" },
                }}
             >
-               <span text={bind("value")} onExplore={(context, { store }) => {
-                  list.push(store.get("value"));
-               }} />
+               <span
+                  text={bind("value")}
+                  onExplore={(context, { store }) => {
+                     list.push(store.get("value"));
+                  }}
+               />
             </IsolatedScope>
          </cx>
       );
@@ -27,7 +30,7 @@ describe("IsolatedScope", () => {
          },
       });
 
-      const component = createTestRenderer(store, widget);
+      const component = await createTestRenderer(store, widget);
 
       let tree = component.toJSON();
       assert.deepEqual(list, ["bad"]);
@@ -38,12 +41,16 @@ describe("IsolatedScope", () => {
       });
 
       //component should not re-render if unrelated data changes
-      store.set("dummy", "dummy");
+      await act(async () => {
+         store.set("dummy", "dummy");
+      });
       tree = component.toJSON();
       assert.deepEqual(list, ["bad"]);
 
       //component should not re-render if unrelated data changes
-      store.set("value", "good");
+      await act(async () => {
+         store.set("value", "good");
+      });
       tree = component.toJSON();
       assert.deepEqual(list, ["bad", "good"]);
       assert.deepEqual(tree, {

package/src/ui/Prop.ts

@@ -1,140 +1,140 @@
-import { Selector } from "../data/Selector";
-import { AccessorChain } from "../data/createAccessorModelProxy";
-
-export type Bind = {
-   bind: string;
-   defaultValue?: any;
-   throttle?: number;
-   debounce?: number;
-};
-
-export type Tpl = {
-   tpl: string;
-};
-
-export type Expr = {
-   expr: string;
-   set?: (value: any, instance?: any) => boolean;
-   throttle?: number;
-   debounce?: number;
-};
-
-export type Binding = Bind | Tpl | Expr;
-
-export type GetSet<T> = {
-   get: Selector<T>;
-   set?: (value: T, instance?: any) => boolean;
-   throttle?: number;
-   debounce?: number;
-};
-
-export interface StructuredSelector {
-   [prop: string]: Selector<any>;
-}
-
-export type Prop<T> = T | Binding | Selector<T> | AccessorChain<T> | GetSet<T>;
-
-export type WritableProp<T> = Bind | AccessorChain<T>;
-
-export interface DataRecord {
-   [prop: string]: any;
-}
-
-export interface Config {
-   [prop: string]: any;
-}
-
-export interface StructuredProp {
-   [prop: string]: Prop<any>;
-}
-
-/**
- * Utility type that extracts the resolved value type from a Prop<T>.
- * Used to derive the runtime type of structured props.
- */
-export type ResolveProp<P> =
-   P extends Selector<infer T>
-      ? T
-      : P extends AccessorChain<infer T>
-        ? T
-        : P extends GetSet<infer T>
-          ? T
-          : P extends Bind
-            ? any
-            : P extends Tpl
-              ? string
-              : P extends Expr
-                ? any
-                : P;
-
-/**
- * Utility type that resolves a structured prop object to its runtime value types.
- * Transforms { name: StringProp, count: NumberProp } to { name: string, count: number }
- */
-export type ResolveStructuredPropType<S> = {
-   [K in keyof S]: ResolveProp<S[K]>;
-};
-
-/**
- * Resolves the runtime value type from either a Prop<T> or a StructuredProp.
- * Use this for generic widgets like ContentResolver and Validator where the
- * input can be either a single prop or a structured object.
- *
- * - For Prop<T> (Selector, AccessorChain, GetSet), resolves to T
- * - For bindings (Bind, Tpl, Expr), resolves to any/string/any
- * - For structured objects, recursively resolves each property via ResolveStructuredProp
- * - For literal values, returns them as-is
- */
-export type ResolvePropType<P> =
-   P extends Selector<infer T>
-      ? T
-      : P extends AccessorChain<infer T>
-        ? T
-        : P extends GetSet<infer T>
-          ? T
-          : P extends Bind
-            ? any
-            : P extends Tpl
-              ? string
-              : P extends Expr
-                ? any
-                : P extends object
-                  ? ResolveStructuredPropType<P>
-                  : P;
-
-/**
- * Generic structured prop type that provides type safety for params and their resolved values.
- * Use with ContentResolver and similar widgets to type the onResolve callback params.
- */
-export type TypedStructuredProp<T extends Record<string, any>> = {
-   [K in keyof T]: Prop<T[K]>;
-};
-
-export type StringProp = Prop<string>;
-export type StyleProp = Prop<string | React.CSSProperties> | StructuredProp;
-export type NumberProp = Prop<number>;
-export type BooleanProp = Prop<boolean>;
-export type ClassProp = Prop<string> | StructuredProp;
-export type RecordsProp = Prop<DataRecord[]>;
-export type SortersProp = Prop<Sorter[]>;
-export type UnknownProp = Prop<unknown>;
-export type ModProp = StringProp | StructuredProp;
-
-export type RecordAlias = string | { toString(): string };
-
-export type SortDirection = "ASC" | "DESC";
-
-export interface Sorter {
-   field?: string;
-   value?: (record: DataRecord) => any;
-   direction: SortDirection;
-}
-
-export interface CollatorOptions {
-   localeMatcher?: "lookup" | "best fit";
-   usage?: "sort" | "search";
-   sensitivity?: "base" | "accent" | "case" | "variant";
-   ignorePunctuation?: boolean;
-   numeric?: boolean;
-   caseFirst?: "upper" | "lower" | "false";
-}
+import { Selector } from "../data/Selector";
+import { AccessorChain } from "../data/createAccessorModelProxy";
+
+export type Bind = {
+   bind: string;
+   defaultValue?: any;
+   throttle?: number;
+   debounce?: number;
+};
+
+export type Tpl = {
+   tpl: string;
+};
+
+export type Expr = {
+   expr: string;
+   set?: (value: any, instance?: any) => boolean;
+   throttle?: number;
+   debounce?: number;
+};
+
+export type Binding = Bind | Tpl | Expr;
+
+export type GetSet<T> = {
+   get: Selector<T>;
+   set?: (value: T, instance?: any) => boolean;
+   throttle?: number;
+   debounce?: number;
+};
+
+export interface StructuredSelector {
+   [prop: string]: Selector<any>;
+}
+
+export type Prop<T> = T | Binding | Selector<T> | AccessorChain<T> | GetSet<T>;
+
+export type WritableProp<T> = Bind | AccessorChain<T>;
+
+export interface DataRecord {
+   [prop: string]: any;
+}
+
+export interface Config {
+   [prop: string]: any;
+}
+
+export interface StructuredProp {
+   [prop: string]: Prop<any>;
+}
+
+/**
+ * Utility type that extracts the resolved value type from a Prop<T>.
+ * Used to derive the runtime type of structured props.
+ */
+export type ResolveProp<P> =
+   P extends Selector<infer T>
+      ? T
+      : P extends AccessorChain<infer T>
+        ? T
+        : P extends GetSet<infer T>
+          ? T
+          : P extends Bind
+            ? any
+            : P extends Tpl
+              ? string
+              : P extends Expr
+                ? any
+                : P;
+
+/**
+ * Utility type that resolves a structured prop object to its runtime value types.
+ * Transforms { name: StringProp, count: NumberProp } to { name: string, count: number }
+ */
+export type ResolveStructuredPropType<S> = {
+   [K in keyof S]: ResolveProp<S[K]>;
+};
+
+/**
+ * Resolves the runtime value type from either a Prop<T> or a StructuredProp.
+ * Use this for generic widgets like ContentResolver and Validator where the
+ * input can be either a single prop or a structured object.
+ *
+ * - For Prop<T> (Selector, AccessorChain, GetSet), resolves to T
+ * - For bindings (Bind, Tpl, Expr), resolves to any/string/any
+ * - For structured objects, recursively resolves each property via ResolveStructuredProp
+ * - For literal values, returns them as-is
+ */
+export type ResolvePropType<P> =
+   P extends Selector<infer T>
+      ? T
+      : P extends AccessorChain<infer T>
+        ? T
+        : P extends GetSet<infer T>
+          ? T
+          : P extends Bind
+            ? any
+            : P extends Tpl
+              ? string
+              : P extends Expr
+                ? any
+                : P extends object
+                  ? ResolveStructuredPropType<P>
+                  : P;
+
+/**
+ * Generic structured prop type that provides type safety for params and their resolved values.
+ * Use with ContentResolver and similar widgets to type the onResolve callback params.
+ */
+export type TypedStructuredProp<T extends Record<string, any>> = {
+   [K in keyof T]: Prop<T[K]>;
+};
+
+export type StringProp = Prop<string>;
+export type StyleProp = Prop<string | React.CSSProperties> | StructuredProp;
+export type NumberProp = Prop<number>;
+export type BooleanProp = Prop<boolean>;
+export type ClassProp = Prop<string> | StructuredProp;
+export type RecordsProp = Prop<DataRecord[]>;
+export type SortersProp = Prop<Sorter[]>;
+export type UnknownProp = Prop<unknown>;
+export type ModProp = StringProp | StructuredProp;
+
+export type RecordAlias = string | { toString(): string };
+
+export type SortDirection = "ASC" | "DESC";
+
+export interface Sorter {
+   field?: string;
+   value?: (record: DataRecord) => any;
+   direction: SortDirection;
+}
+
+export interface CollatorOptions {
+   localeMatcher?: "lookup" | "best fit";
+   usage?: "sort" | "search";
+   sensitivity?: "base" | "accent" | "case" | "variant";
+   ignorePunctuation?: boolean;
+   numeric?: boolean;
+   caseFirst?: "upper" | "lower" | "false";
+}

package/src/ui/PureContainer.spec.tsx

@@ -1,11 +1,11 @@
 import { Store } from "../data/Store";
 import assert from "assert";
-import { createTestRenderer } from "../util/test/createTestRenderer";
+import { createTestRenderer, act } from "../util/test/createTestRenderer";
 import { bind } from "./bind";
 import { PureContainer } from "./PureContainer";
 
 describe("PureContainer", () => {
-   it("renders static text children", () => {
+   it("renders static text children", async () => {
       let widget = (
          <cx>
             <PureContainer>
@@ -15,7 +15,7 @@ describe("PureContainer", () => {
       );
 
       let store = new Store();
-      const component = createTestRenderer(store, widget);
+      const component = await createTestRenderer(store, widget);
 
       let tree = component.toJSON();
       assert(tree && !Array.isArray(tree), "Expected single element");
@@ -26,7 +26,7 @@ describe("PureContainer", () => {
       });
    });
 
-   it("renders multiple children", () => {
+   it("renders multiple children", async () => {
       let widget = (
          <cx>
             <PureContainer>
@@ -38,7 +38,7 @@ describe("PureContainer", () => {
       );
 
       let store = new Store();
-      const component = createTestRenderer(store, widget);
+      const component = await createTestRenderer(store, widget);
 
       let tree = component.toJSON();
       assert(Array.isArray(tree), "Expected array of elements");
@@ -62,7 +62,7 @@ describe("PureContainer", () => {
       ]);
    });
 
-   it("renders children with data bindings", () => {
+   it("renders children with data bindings", async () => {
       let widget = (
          <cx>
             <PureContainer>
@@ -77,7 +77,7 @@ describe("PureContainer", () => {
          },
       });
 
-      const component = createTestRenderer(store, widget);
+      const component = await createTestRenderer(store, widget);
 
       let tree = component.toJSON();
       assert(tree && !Array.isArray(tree), "Expected single element");
@@ -88,7 +88,7 @@ describe("PureContainer", () => {
       });
    });
 
-   it("renders nested containers", () => {
+   it("renders nested containers", async () => {
       let widget = (
          <cx>
             <PureContainer>
@@ -102,7 +102,7 @@ describe("PureContainer", () => {
       );
 
       let store = new Store();
-      const component = createTestRenderer(store, widget);
+      const component = await createTestRenderer(store, widget);
 
       let tree = component.toJSON();
       assert(tree && !Array.isArray(tree), "Expected single element");
@@ -119,7 +119,7 @@ describe("PureContainer", () => {
       });
    });
 
-   it("conditionally renders children based on visible binding", () => {
+   it("conditionally renders children based on visible binding", async () => {
       let widget = (
          <cx>
             <PureContainer>
@@ -135,7 +135,7 @@ describe("PureContainer", () => {
          },
       });
 
-      const component = createTestRenderer(store, widget);
+      const component = await createTestRenderer(store, widget);
 
       let tree = component.toJSON();
       assert(tree && !Array.isArray(tree), "Expected single element");
@@ -146,7 +146,7 @@ describe("PureContainer", () => {
       });
    });
 
-   it("handles empty children", () => {
+   it("handles empty children", async () => {
       let widget = (
          <cx>
             <PureContainer>
@@ -156,7 +156,7 @@ describe("PureContainer", () => {
       );
 
       let store = new Store();
-      const component = createTestRenderer(store, widget);
+      const component = await createTestRenderer(store, widget);
 
       let tree = component.toJSON();
       assert(tree && !Array.isArray(tree), "Expected single element");
@@ -167,7 +167,7 @@ describe("PureContainer", () => {
       });
    });
 
-   it("renders children from items property", () => {
+   it("renders children from items property", async () => {
       let widget = (
          <cx>
             <PureContainer items={[<div key="1">Item 1</div>, <div key="2">Item 2</div>]} />
@@ -175,7 +175,7 @@ describe("PureContainer", () => {
       );
 
       let store = new Store();
-      const component = createTestRenderer(store, widget);
+      const component = await createTestRenderer(store, widget);
 
       let tree = component.toJSON();
       assert(Array.isArray(tree), "Expected array of elements");
@@ -192,7 +192,7 @@ describe("PureContainer", () => {
       });
    });
 
-   it("updates children when store data changes", () => {
+   it("updates children when store data changes", async () => {
       let widget = (
          <cx>
             <PureContainer>
@@ -207,7 +207,7 @@ describe("PureContainer", () => {
          },
       });
 
-      const component = createTestRenderer(store, widget);
+      const component = await createTestRenderer(store, widget);
 
       let tree = component.toJSON();
       assert.deepEqual(tree, {
@@ -217,7 +217,9 @@ describe("PureContainer", () => {
       });
 
       // Update the store
-      store.set("count", 5);
+      await act(async () => {
+         store.set("count", 5);
+      });
 
       // Re-render
       tree = component.toJSON();