refactor(test-utils): migrate dynamic helpers usage

packages/pluggableWidgets/calendar-web/src/__tests__/Calendar.spec.tsx

@@ -72,8 +72,8 @@ const customViewProps: CalendarContainerProps = {
     view: "custom",
     defaultViewStandard: "month",
     defaultViewCustom: "work_week",
-    editable: dynamic(true),
-    showEventDate: dynamic(true),
+    editable: dynamic.available(true),
+    showEventDate: dynamic.available(true),
     widthUnit: "percentage",
     width: 100,
     heightUnit: "pixels",

packages/pluggableWidgets/checkbox-radio-selection-web/src/CheckboxRadioSelection.editorPreview.tsx

@@ -1,18 +1,24 @@
-import { generateUUID } from "@mendix/widget-plugin-platform/framework/generate-uuid";
+import type { DynamicValue } from "mendix";
 import { ReactElement, useMemo } from "react";
+import { generateUUID } from "@mendix/widget-plugin-platform/framework/generate-uuid";
 import { CheckboxRadioSelectionPreviewProps } from "../typings/CheckboxRadioSelectionProps";
+import { CheckboxSelection } from "./components/CheckboxSelection/CheckboxSelection";
 import { RadioSelection } from "./components/RadioSelection/RadioSelection";
-import { dynamic } from "@mendix/widget-plugin-test-utils";
-import { MultiSelector, SelectionBaseProps, SingleSelector } from "./helpers/types";
-import { StaticPreviewSelector } from "./helpers/Static/Preview/StaticPreviewSelector";
+import { AssociationPreviewSelector } from "./helpers/Association/Preview/AssociationPreviewSelector";
 import {
     DatabaseMultiPreviewSelector,
     DatabasePreviewSelector
 } from "./helpers/Database/Preview/DatabasePreviewSelector";
-import { AssociationPreviewSelector } from "./helpers/Association/Preview/AssociationPreviewSelector";
+import { StaticPreviewSelector } from "./helpers/Static/Preview/StaticPreviewSelector";
+import { MultiSelector, SelectionBaseProps, SingleSelector } from "./helpers/types";
 import "./ui/CheckboxRadioSelection.scss";
 import "./ui/CheckboxRadioSelectionPreview.scss";
-import { CheckboxSelection } from "./components/CheckboxSelection/CheckboxSelection";
+
+const available = <T,>(value: T): DynamicValue<T> =>
+    ({
+        status: "available",
+        value
+    }) as DynamicValue<T>;
 
 export const preview = (props: CheckboxRadioSelectionPreviewProps): ReactElement => {
     const id = generateUUID().toString();
@@ -21,9 +27,9 @@ export const preview = (props: CheckboxRadioSelectionPreviewProps): ReactElement
         inputId: id,
         labelId: `${id}-label`,
         readOnlyStyle: props.readOnlyStyle,
-        ariaRequired: dynamic(false),
-        ariaLabel: dynamic(""),
-        groupName: dynamic(`${id}-group`),
+        ariaRequired: available(false),
+        ariaLabel: available(""),
+        groupName: available(`${id}-group`),
         noOptionsText: "No options available"
     };
 

packages/pluggableWidgets/combobox-web/AGENTS.md

@@ -297,7 +297,7 @@ Uses `@mendix/widget-plugin-test-utils` builders:
 - `ReferenceValueBuilder` — mocks ReferenceValue (single association)
 - `ReferenceSetValueBuilder` — mocks ReferenceSetValue (multi association)
 - `ListValueBuilder` — mocks ListValue datasource with `.withItems()`, `.withHasMore()`
-- `dynamic(value?)` — wraps in DynamicValue
+- `dynamic.[available|loading|unavailable](value?)` — wraps in DynamicValue
 - `obj(id?)` — creates mock ObjectItem
 - `list(items)` — creates mock ListValue
 - `setupIntersectionObserverStub()` — stubs browser IntersectionObserver

packages/pluggableWidgets/combobox-web/src/Combobox.editorPreview.tsx

@@ -1,13 +1,19 @@
-import { generateUUID } from "@mendix/widget-plugin-platform/framework/generate-uuid";
+import type { DynamicValue } from "mendix";
 import { ReactElement, useMemo } from "react";
+import { generateUUID } from "@mendix/widget-plugin-platform/framework/generate-uuid";
 import { ComboboxPreviewProps } from "../typings/ComboboxProps";
 import { SingleSelection } from "./components/SingleSelection/SingleSelection";
-import { dynamic } from "@mendix/widget-plugin-test-utils";
-import { SelectionBaseProps, SingleSelector } from "./helpers/types";
 import "./ui/Combobox.scss";
 import { AssociationPreviewSelector } from "./helpers/Association/Preview/AssociationPreviewSelector";
-import { StaticPreviewSelector } from "./helpers/Static/Preview/StaticPreviewSelector";
 import { DatabasePreviewSelector } from "./helpers/Database/Preview/DatabasePreviewSelector";
+import { StaticPreviewSelector } from "./helpers/Static/Preview/StaticPreviewSelector";
+import { SelectionBaseProps, SingleSelector } from "./helpers/types";
+
+const available = <T,>(value: T): DynamicValue<T> =>
+    ({
+        status: "available",
+        value
+    }) as DynamicValue<T>;
 
 export const preview = (props: ComboboxPreviewProps): ReactElement => {
     const id = generateUUID().toString();
@@ -16,7 +22,7 @@ export const preview = (props: ComboboxPreviewProps): ReactElement => {
         inputId: id,
         labelId: `${id}-label`,
         readOnlyStyle: props.readOnlyStyle,
-        ariaRequired: dynamic(false),
+        ariaRequired: available(false),
         a11yConfig: {
             ariaLabels: {
                 clearSelection: props.clearButtonAriaLabel,

packages/pluggableWidgets/combobox-web/src/__tests__/MultiSelection.spec.tsx

@@ -40,23 +40,23 @@ describe("Combo box (Association)", () => {
             optionsSourceAssociationCaptionExpression: listExpression(() => "$currentObject/CountryName"),
             optionsSourceAssociationCustomContentType: "no",
             optionsSourceAssociationCustomContent: undefined,
-            emptyOptionText: dynamic("Select an option 111"),
-            ariaRequired: dynamic(true),
+            emptyOptionText: dynamic.available("Select an option 111"),
+            ariaRequired: dynamic.available(true),
             clearable: true,
             filterType: "contains",
             selectedItemsStyle: "text",
             readOnlyStyle: "bordered",
             lazyLoading: false,
             loadingType: "spinner",
-            noOptionsText: dynamic("no options found"),
-            clearButtonAriaLabel: dynamic("Clear selection"),
-            removeValueAriaLabel: dynamic("Remove value"),
+            noOptionsText: dynamic.available("no options found"),
+            clearButtonAriaLabel: dynamic.available("Clear selection"),
+            removeValueAriaLabel: dynamic.available("Remove value"),
             selectAllButton: true, // Causes +1 option to be added to the menu
-            selectAllButtonCaption: dynamic("Select All"),
+            selectAllButtonCaption: dynamic.available("Select All"),
             selectionMethod: "checkbox",
-            a11ySelectedValue: dynamic("Selected value:"),
-            a11yOptionsAvailable: dynamic("Options available:"),
-            a11yInstructions: dynamic("a11yInstructions"),
+            a11ySelectedValue: dynamic.available("Selected value:"),
+            a11yOptionsAvailable: dynamic.available("Options available:"),
+            a11yInstructions: dynamic.available("a11yInstructions"),
             showFooter: false,
             databaseAttributeString: new EditableValueBuilder<string | Big>().build(),
             optionsSourceDatabaseCaptionType: "attribute",
@@ -65,23 +65,23 @@ describe("Combo box (Association)", () => {
             staticAttribute: new EditableValueBuilder<string>().build(),
             optionsSourceStaticDataSource: [
                 {
-                    staticDataSourceValue: dynamic("value1"),
+                    staticDataSourceValue: dynamic.available("value1"),
                     staticDataSourceCustomContent: undefined,
-                    staticDataSourceCaption: dynamic("caption1")
+                    staticDataSourceCaption: dynamic.available("caption1")
                 },
                 {
-                    staticDataSourceValue: dynamic("value2"),
+                    staticDataSourceValue: dynamic.available("value2"),
                     staticDataSourceCustomContent: undefined,
-                    staticDataSourceCaption: dynamic("caption2")
+                    staticDataSourceCaption: dynamic.available("caption2")
                 }
             ],
             selectedItemsSorting: "none",
             customEditability: "default",
-            customEditabilityExpression: dynamic(false),
+            customEditabilityExpression: dynamic.available(false),
             filterInputDebounceInterval: 200
         };
         if (defaultProps.optionsSourceAssociationCaptionType === "expression") {
-            defaultProps.optionsSourceAssociationCaptionExpression!.get = i => dynamic(`${i.id}`);
+            defaultProps.optionsSourceAssociationCaptionExpression!.get = i => dynamic.available(`${i.id}`);
         }
     });
 

packages/pluggableWidgets/combobox-web/src/__tests__/SingleSelection.spec.tsx

@@ -50,22 +50,22 @@ describe("Combo box (Association)", () => {
             optionsSourceAssociationCaptionExpression: listExpression(() => "$currentObject/CountryName"),
             optionsSourceAssociationCustomContentType: "no",
             optionsSourceAssociationCustomContent: undefined,
-            emptyOptionText: dynamic("Select an option 111"),
-            ariaRequired: dynamic(true),
+            emptyOptionText: dynamic.available("Select an option 111"),
+            ariaRequired: dynamic.available(true),
             clearable: true,
             filterType: "contains",
             selectedItemsStyle: "text",
             readOnlyStyle: "bordered",
             lazyLoading: false,
             loadingType: "spinner",
-            clearButtonAriaLabel: dynamic("Clear selection"),
-            removeValueAriaLabel: dynamic("Remove value"),
-            selectAllButtonCaption: dynamic("Select All"),
+            clearButtonAriaLabel: dynamic.available("Clear selection"),
+            removeValueAriaLabel: dynamic.available("Remove value"),
+            selectAllButtonCaption: dynamic.available("Select All"),
             selectAllButton: false,
             selectionMethod: "checkbox",
-            a11ySelectedValue: dynamic("Selected value:"),
-            a11yOptionsAvailable: dynamic("Options available:"),
-            a11yInstructions: dynamic("a11yInstructions"),
+            a11ySelectedValue: dynamic.available("Selected value:"),
+            a11yOptionsAvailable: dynamic.available("Options available:"),
+            a11yInstructions: dynamic.available("a11yInstructions"),
             showFooter: false,
             databaseAttributeString: new EditableValueBuilder<string | Big>().build(),
             optionsSourceDatabaseCaptionType: "attribute",
@@ -74,23 +74,23 @@ describe("Combo box (Association)", () => {
             staticAttribute: new EditableValueBuilder<string>().build(),
             optionsSourceStaticDataSource: [
                 {
-                    staticDataSourceValue: dynamic("value1"),
+                    staticDataSourceValue: dynamic.available("value1"),
                     staticDataSourceCustomContent: undefined,
-                    staticDataSourceCaption: dynamic("caption1")
+                    staticDataSourceCaption: dynamic.available("caption1")
                 },
                 {
-                    staticDataSourceValue: dynamic("value2"),
+                    staticDataSourceValue: dynamic.available("value2"),
                     staticDataSourceCustomContent: undefined,
-                    staticDataSourceCaption: dynamic("caption2")
+                    staticDataSourceCaption: dynamic.available("caption2")
                 }
             ],
             selectedItemsSorting: "none",
             customEditability: "default",
-            customEditabilityExpression: dynamic(false),
+            customEditabilityExpression: dynamic.available(false),
             filterInputDebounceInterval: 200
         };
         if (defaultProps.optionsSourceAssociationCaptionType === "expression") {
-            defaultProps.optionsSourceAssociationCaptionExpression!.get = i => dynamic(`${i.id}`);
+            defaultProps.optionsSourceAssociationCaptionExpression!.get = i => dynamic.available(`${i.id}`);
         }
     });
     it("renders combobox widget", () => {

packages/pluggableWidgets/combobox-web/src/__tests__/StaticSelection.spec.tsx

@@ -50,22 +50,22 @@ describe("Combo box (Static values)", () => {
             optionsSourceAssociationCaptionExpression: listExpression(() => "$currentObject/CountryName"),
             optionsSourceAssociationCustomContentType: "no",
             optionsSourceAssociationCustomContent: undefined,
-            emptyOptionText: dynamic("Select an option 111"),
-            ariaRequired: dynamic(true),
+            emptyOptionText: dynamic.available("Select an option 111"),
+            ariaRequired: dynamic.available(true),
             clearable: true,
             filterType: "contains",
             selectedItemsStyle: "text",
             readOnlyStyle: "bordered",
             lazyLoading: false,
             loadingType: "spinner",
-            clearButtonAriaLabel: dynamic("Clear selection"),
-            removeValueAriaLabel: dynamic("Remove value"),
-            selectAllButtonCaption: dynamic("Select All"),
+            clearButtonAriaLabel: dynamic.available("Clear selection"),
+            removeValueAriaLabel: dynamic.available("Remove value"),
+            selectAllButtonCaption: dynamic.available("Select All"),
             selectAllButton: false,
             selectionMethod: "checkbox",
-            a11ySelectedValue: dynamic("Selected value:"),
-            a11yOptionsAvailable: dynamic("Options available:"),
-            a11yInstructions: dynamic("a11yInstructions"),
+            a11ySelectedValue: dynamic.available("Selected value:"),
+            a11yOptionsAvailable: dynamic.available("Options available:"),
+            a11yInstructions: dynamic.available("a11yInstructions"),
             showFooter: false,
             databaseAttributeString: new EditableValueBuilder<string | Big>().build(),
             optionsSourceDatabaseCaptionType: "attribute",
@@ -74,23 +74,23 @@ describe("Combo box (Static values)", () => {
             staticAttribute: new EditableValueBuilder<string>().withValue("value1").build(),
             optionsSourceStaticDataSource: [
                 {
-                    staticDataSourceValue: dynamic("value1"),
+                    staticDataSourceValue: dynamic.available("value1"),
                     staticDataSourceCustomContent: undefined,
-                    staticDataSourceCaption: dynamic("caption1")
+                    staticDataSourceCaption: dynamic.available("caption1")
                 },
                 {
-                    staticDataSourceValue: dynamic("value2"),
+                    staticDataSourceValue: dynamic.available("value2"),
                     staticDataSourceCustomContent: undefined,
-                    staticDataSourceCaption: dynamic("caption2")
+                    staticDataSourceCaption: dynamic.available("caption2")
                 }
             ],
             selectedItemsSorting: "none",
             customEditability: "default",
-            customEditabilityExpression: dynamic(false),
+            customEditabilityExpression: dynamic.available(false),
             filterInputDebounceInterval: 200
         };
         if (defaultProps.optionsSourceAssociationCaptionType === "expression") {
-            defaultProps.optionsSourceAssociationCaptionExpression!.get = i => dynamic(`${i.id}`);
+            defaultProps.optionsSourceAssociationCaptionExpression!.get = i => dynamic.available(`${i.id}`);
         }
     });
     it("renders combobox widget", () => {

packages/pluggableWidgets/combobox-web/src/helpers/Database/__tests__/DatabaseSingleSelectionSelector.spec.ts

@@ -40,7 +40,7 @@ function buildProps({ items, values, targetValue, selection }: PropsOverrides):
         optionsSourceDatabaseCaptionAttribute: captionAttr,
         optionsSourceDatabaseValueAttribute: valueAttr,
         databaseAttributeString: targetAttr as any,
-        emptyOptionText: dynamic("Select..."),
+        emptyOptionText: dynamic.available("Select..."),
         optionsSourceDatabaseCustomContentType: "no",
         optionsSourceAssociationCustomContentType: "no",
         staticDataSourceCustomContentType: "no",
@@ -50,14 +50,14 @@ function buildProps({ items, values, targetValue, selection }: PropsOverrides):
         lazyLoading: false,
         loadingType: "spinner",
         customEditability: "default",
-        customEditabilityExpression: dynamic(false),
+        customEditabilityExpression: dynamic.available(false),
         filterInputDebounceInterval: 200,
         selectedItemsStyle: "text",
         readOnlyStyle: "bordered",
         selectionMethod: "checkbox",
         selectAllButton: false,
-        selectAllButtonCaption: dynamic("Select All"),
-        ariaRequired: dynamic(true),
+        selectAllButtonCaption: dynamic.available("Select All"),
+        ariaRequired: dynamic.available(true),
         showFooter: false,
         selectedItemsSorting: "none",
         attributeEnumeration: new EditableValueBuilder<string>().build(),