[WC-3083] fix combobox lazy load on initial load

packages/pluggableWidgets/combobox-web/CHANGELOG.md

@@ -10,6 +10,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 - We fixed an issue where combobox failed to render a proper width on auto-fit container.
 
+- We fixed an issue where combobox lazy load is not working on initial load.
+
 ## [2.5.0] - 2025-08-12
 
 ### Added

packages/pluggableWidgets/combobox-web/src/helpers/BaseDatasourceOptionsProvider.ts

@@ -86,9 +86,9 @@ export class BaseDatasourceOptionsProvider extends BaseOptionsProvider<ObjectIte
     }
 
     // used for initial load of selected value in case options are lazy loaded
-    loadSelectedValue(attributeValue: string): void {
+    loadSelectedValue(attributeValue: string, attrId?: ListAttributeValue["id"]): void {
         if (this.lazyLoading && this.ds && this.attributeId) {
-            const filterCondition = datasourceFilter("containsExact", attributeValue, this.attributeId);
+            const filterCondition = datasourceFilter("containsExact", attributeValue, attrId ?? this.attributeId);
             this.ds?.setFilter(filterCondition);
             this.ds.setLimit(1);
         }

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

@@ -55,9 +55,10 @@ export class DatabaseSingleSelectionSelector<T extends string | Big, R extends E
             valueSourceAttribute
         } = extractDatabaseProps(props);
 
-        if (ds.status === "loading") {
+        if (ds.status === "loading" && (!lazyLoading || ds.limit !== Infinity)) {
             return;
         }
+
         this._attr = targetAttribute as R;
         this.readOnly = getReadonly(targetAttribute, props.customEditability, props.customEditabilityExpression);
         this.lazyLoader.updateProps(ds);
@@ -100,9 +101,20 @@ export class DatabaseSingleSelectionSelector<T extends string | Big, R extends E
                     });
                     if (obj) {
                         this.currentId = obj;
+                    } else {
+                        // NOTE: should not hit this scope normally
+                        // if the value is not in the options list, but there is a value from attribute
+                        // there is probably a mismatch between the value and the datasource
+                        // logical next step is to try to reload the attribute value
+                        if (allOptions.length <= 1) {
+                            this.options.loadSelectedValue(targetAttribute.value?.toString(), valueSourceAttribute?.id);
+                        }
                     }
                 } else {
-                    this.options.loadSelectedValue(targetAttribute.value?.toString());
+                    // should hit on initial condition whereas:
+                    // no options are loaded yet : (allOptions.length > 0)
+                    // but there is a value from target attribute : (!this.currentId)
+                    this.options.loadSelectedValue(targetAttribute.value?.toString(), valueSourceAttribute?.id);
                 }
             } else if (!targetAttribute.value && this.currentId) {
                 this.currentId = null;

packages/pluggableWidgets/combobox-web/src/helpers/LazyLoadProvider.ts

@@ -18,7 +18,7 @@ export class LazyLoadProvider {
     getLimit(limit: number, readOnly: boolean, status: ValueStatus, lazyLoading: boolean): number | undefined {
         if (status !== "available" || readOnly === true) {
             if (status === "loading" && lazyLoading) {
-                return this.limit || 1;
+                return this.limit === Infinity || !this.limit ? 0 : this.limit;
             }
             return 0;
         }