@cqa-lib/cqa-ui 1.1.395 → 1.1.397

package/fesm2020/cqa-lib-cqa-ui.mjs

@@ -7570,6 +7570,26 @@ class StepRendererComponent {
             return this.getDebugPointSetHandler(this.step);
         return false;
     }
+    /**
+     * Safely trigger change detection on a child component.
+     * Calls detectChanges() only if the child's ngOnInit has already run (i.e. config is built).
+     * Before initialization, falls back to markForCheck() which queues CD for the next cycle
+     * without forcing immediate template evaluation.
+     */
+    safeDetectChanges(componentRef) {
+        if (!componentRef?.injector)
+            return;
+        const instanceCdr = componentRef.injector.get(ChangeDetectorRef, null);
+        if (!instanceCdr)
+            return;
+        if (StepRendererComponent.componentInitialized.get(this.container)) {
+            instanceCdr.markForCheck();
+            instanceCdr.detectChanges();
+        }
+        else {
+            instanceCdr.markForCheck();
+        }
+    }
     ngOnChanges(changes) {
         if (!this.container || !this.step)
             return;
@@ -7595,13 +7615,7 @@ class StepRendererComponent {
                     // Try to update selectedIteration if iterations are available
                     this.updateLoopStepSelectedIteration(instance, currentValue);
                     // Trigger change detection on the loop-step component
-                    if (componentRef.injector) {
-                        const instanceCdr = componentRef.injector.get(ChangeDetectorRef, null);
-                        if (instanceCdr) {
-                            instanceCdr.markForCheck();
-                            instanceCdr.detectChanges();
-                        }
-                    }
+                    this.safeDetectChanges(componentRef);
                 }
             }
         }
@@ -7619,13 +7633,7 @@ class StepRendererComponent {
                         instance.config.stepNumber = currentValue;
                     }
                     // Trigger change detection on the component instance
-                    if (componentRef.injector) {
-                        const instanceCdr = componentRef.injector.get(ChangeDetectorRef, null);
-                        if (instanceCdr) {
-                            instanceCdr.markForCheck();
-                            instanceCdr.detectChanges();
-                        }
-                    }
+                    this.safeDetectChanges(componentRef);
                 }
             }
         }
@@ -7651,13 +7659,7 @@ class StepRendererComponent {
                     }
                 }
                 // Trigger change detection on the component instance
-                if (componentRef.injector) {
-                    const instanceCdr = componentRef.injector.get(ChangeDetectorRef, null);
-                    if (instanceCdr) {
-                        instanceCdr.markForCheck();
-                        instanceCdr.detectChanges();
-                    }
-                }
+                this.safeDetectChanges(componentRef);
             }
         }
         // If downloadingStepId changed, update file-download instance isDownloading
@@ -7667,13 +7669,7 @@ class StepRendererComponent {
             if (instance && componentRef && this.getEffectiveStepType(currentStep) === 'file-download') {
                 const tid = currentStep.testStepResultId;
                 instance.isDownloading = !!tid && this.downloadingStepId === tid;
-                if (componentRef.injector) {
-                    const instanceCdr = componentRef.injector.get(ChangeDetectorRef, null);
-                    if (instanceCdr) {
-                        instanceCdr.markForCheck();
-                        instanceCdr.detectChanges();
-                    }
-                }
+                this.safeDetectChanges(componentRef);
             }
         }
         // If isDebug, debugPointSet or getDebugPointSetHandler changed (e.g. user toggled debug in portal/Storybook), update nested instance
@@ -7751,13 +7747,7 @@ class StepRendererComponent {
                         subscribedEvents.add('stepMoreOptionSelect');
                     }
                 }
-                if (componentRef.injector) {
-                    const instanceCdr = componentRef.injector.get(ChangeDetectorRef, null);
-                    if (instanceCdr) {
-                        instanceCdr.markForCheck();
-                        instanceCdr.detectChanges();
-                    }
-                }
+                this.safeDetectChanges(componentRef);
             }
         }
         // Get step identifiers (use effective type: generateDocument -> file-download)
@@ -8018,8 +8008,6 @@ class StepRendererComponent {
         if (currentStep.displayType === 'condition' && currentStep.nestedSteps !== undefined) {
             const currentNestedSteps = currentStep.nestedSteps || [];
             const previousNestedSteps = previousStep.nestedSteps || [];
-            console.log('🔄 step-renderer: currentNestedSteps', currentNestedSteps);
-            console.log('🔄 step-renderer: previousNestedSteps', previousNestedSteps);
             // Use deep comparison to detect content changes, not just reference changes
             // This is critical when switching between IF and ELSE_IF branches
             if (this.hasNestedStepsChanged(currentNestedSteps, previousNestedSteps)) {
@@ -8029,11 +8017,6 @@ class StepRendererComponent {
                     instance.config.nestedSteps = [...currentNestedSteps];
                 }
                 hasChanges = true;
-                console.log('🔄 step-renderer: nestedSteps updated for condition-step', {
-                    stepId: currentStep.id,
-                    previousCount: previousNestedSteps.length,
-                    currentCount: currentNestedSteps.length
-                });
             }
         }
         // Special handling for file-download (including generateDocument): sync from generateDocumentResult
@@ -8157,19 +8140,7 @@ class StepRendererComponent {
         // Trigger change detection on the component instance if there were changes
         // This ensures only the nested step updates without affecting parent steps
         if (hasChanges) {
-            if (componentRef.injector) {
-                const instanceCdr = componentRef.injector.get(ChangeDetectorRef, null);
-                if (instanceCdr) {
-                    instanceCdr.markForCheck();
-                    instanceCdr.detectChanges();
-                }
-            }
-            else if (instance.cdr) {
-                instance.cdr.detectChanges();
-            }
-            else if (instance.changeDetectorRef) {
-                instance.changeDetectorRef.detectChanges();
-            }
+            this.safeDetectChanges(componentRef);
             // Don't call markForCheck on this component to avoid triggering parent re-renders
         }
     }
@@ -8338,6 +8309,7 @@ class StepRendererComponent {
             }
             StepRendererComponent.componentInstances.delete(this.container);
             StepRendererComponent.componentRefs.delete(this.container);
+            StepRendererComponent.componentInitialized.delete(this.container);
             this.lastStepId = currentStepId;
             this.lastStepType = currentStepType;
         }
@@ -8541,7 +8513,6 @@ class StepRendererComponent {
             }
             // Special handling for loop-step: initialize iterations if not present
             if (this.isLoopStep(this.step) && !instance.iterations) {
-                console.log(" changes['selectedIterationId'] step", this.selectedIterationId, instance.iterations);
                 // Use handler if available, otherwise try to initialize from step.executedResult.stepResult
                 if (this.getLoopIterationsHandler) {
                     instance.iterations = this.getLoopIterationsHandler(this.step);
@@ -8582,7 +8553,6 @@ class StepRendererComponent {
             }
             // Special handling for loop-step: set defaultIteration and selectedIterationId
             if (this.isLoopStep(this.step)) {
-                console.log(" changes['selectedIterationId'] step 2", this.selectedIterationId, instance.iterations);
                 // Set defaultIteration to 'last' if not already set
                 if (!instance.defaultIteration) {
                     instance.defaultIteration = 'last';
@@ -8995,9 +8965,11 @@ class StepRendererComponent {
                     instanceCdr.markForCheck();
                 }
             }
-            // Emit ready event after component is created and initialized
-            // Use setTimeout to ensure the component is fully rendered
+            // Mark component as initialized after the next CD cycle completes.
+            // By then, the child's ngOnInit will have run and config is built.
+            // After this, safeDetectChanges() will use detectChanges() for immediate updates.
             setTimeout(() => {
+                StepRendererComponent.componentInitialized.set(this.container, true);
                 this.componentReady.emit();
             }, 0);
         }
@@ -9060,13 +9032,7 @@ class StepRendererComponent {
                 // Update the step object's expanded property to keep it in sync
                 this.step.expanded = currentExpanded;
                 // Trigger change detection
-                if (componentRef.injector) {
-                    const instanceCdr = componentRef.injector.get(ChangeDetectorRef, null);
-                    if (instanceCdr) {
-                        instanceCdr.markForCheck();
-                        instanceCdr.detectChanges();
-                    }
-                }
+                this.safeDetectChanges(componentRef);
             }
             // Check if iterations are now available and we need to update selectedIteration
             if (this.isLoopStep(this.step) && this.selectedIterationId) {
@@ -9078,13 +9044,7 @@ class StepRendererComponent {
                     const shouldBeSelected = iterations.find((iter) => iter.id === selectedIterationId);
                     if (shouldBeSelected && currentSelectedIteration?.id !== selectedIterationId) {
                         this.updateLoopStepSelectedIteration(instance, selectedIterationId);
-                        if (componentRef.injector) {
-                            const instanceCdr = componentRef.injector.get(ChangeDetectorRef, null);
-                            if (instanceCdr) {
-                                instanceCdr.markForCheck();
-                                instanceCdr.detectChanges();
-                            }
-                        }
+                        this.safeDetectChanges(componentRef);
                     }
                 }
             }
@@ -9129,6 +9089,10 @@ class StepRendererComponent {
 StepRendererComponent.componentInstances = new WeakMap();
 StepRendererComponent.componentRefs = new WeakMap();
 StepRendererComponent.subscribedEventEmitters = new WeakMap(); // Track which EventEmitters have been subscribed to
+// Track whether child component's ngOnInit has run (config is built).
+// detectChanges() must NOT be called before initialization — it forces template
+// evaluation which crashes on undefined config properties.
+StepRendererComponent.componentInitialized = new WeakMap();
 StepRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: StepRendererComponent, deps: [{ token: STEP_COMPONENT_MAP }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 StepRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: StepRendererComponent, selector: "cqa-step-renderer", inputs: { step: "step", onExpandHandler: "onExpandHandler", getConditionBranchesHandler: "getConditionBranchesHandler", isStepLoadingHandler: "isStepLoadingHandler", isStepExpandedHandler: "isStepExpandedHandler", convertMsToSecondsHandler: "convertMsToSecondsHandler", formatFailureDetailsHandler: "formatFailureDetailsHandler", getSelfHealAnalysisHandler: "getSelfHealAnalysisHandler", onMakeCurrentBaselineHandler: "onMakeCurrentBaselineHandler", onUploadBaselineHandler: "onUploadBaselineHandler", onAnalyzeHandler: "onAnalyzeHandler", onViewFullLogsHandler: "onViewFullLogsHandler", onSelfHealActionHandler: "onSelfHealActionHandler", getSelfHealLoadingStatesHandler: "getSelfHealLoadingStatesHandler", isUploadingBaseline: "isUploadingBaseline", isMakingCurrentBaseline: "isMakingCurrentBaseline", selectedIterationId: "selectedIterationId", getLoopIterationsHandler: "getLoopIterationsHandler", getApiAssertionsHandler: "getApiAssertionsHandler", formatActionsHandler: "formatActionsHandler", onViewAllIterationsHandler: "onViewAllIterationsHandler", onConditionBranchClickHandler: "onConditionBranchClickHandler", onStepClickHandler: "onStepClickHandler", onJsonPathCopiedHandler: "onJsonPathCopiedHandler", onDownloadHandler: "onDownloadHandler", onFilePathCopiedHandler: "onFilePathCopiedHandler", onTextCopiedHandler: "onTextCopiedHandler", jumpToTimestampHandler: "jumpToTimestampHandler", downloadingStepId: "downloadingStepId", isLive: "isLive", isDebug: "isDebug", debugPointSet: "debugPointSet", getDebugPointSetHandler: "getDebugPointSetHandler", onDebugPointChangeHandler: "onDebugPointChangeHandler", onEditStepHandler: "onEditStepHandler", addStepMenuOptions: "addStepMenuOptions", onAddStepOptionSelectHandler: "onAddStepOptionSelectHandler", stepMoreMenuOptions: "stepMoreMenuOptions", onStepMoreOptionSelectHandler: "onStepMoreOptionSelectHandler", getAddStepMenuOptionsForNested: "getAddStepMenuOptionsForNested", getStepMoreMenuOptionsForNested: "getStepMoreMenuOptionsForNested", stepNumber: "stepNumber", parentSkipped: "parentSkipped" }, outputs: { addStepOptionSelect: "addStepOptionSelect", stepMoreOptionSelect: "stepMoreOptionSelect", addStepInsideLoop: "addStepInsideLoop", componentReady: "componentReady" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef }], usesOnChanges: true, ngImport: i0, template: '<ng-container #container></ng-container>', isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: StepRendererComponent, decorators: [{
@@ -31329,20 +31293,23 @@ class TemplateVariablesFormComponent {
                     this.cdr.markForCheck();
                 }
             }
-            // If parameter options changed and we have default values, try to initialize them.
-            // IMPORTANT: only do this on the FIRST time parameterOptions arrive, otherwise every
-            // search (which also updates parameterOptions) would re-run initializeTestDataVariables()
-            // and reset the test-data type dropdown back to 'plain-text'.
+            // Re-run initializeTestDataVariables whenever parameterOptions changes and there are still
+            // variables that need initialization (have profileId but missing profile name or dataSet).
+            // We do NOT use firstChange here because the saved profile may arrive in a second API call
+            // (id@<profileId>) after the initial paginated list, so firstChange would miss it.
+            // The inner some() guard ensures we only re-run when variables are still incomplete,
+            // preventing unnecessary re-runs on user search updates.
             if (changes['parameterOptions'] &&
-                changes['parameterOptions'].firstChange &&
                 this.parameterOptions.length > 0 &&
-                ((this.defaultTestDataProfileId && this.defaultTestDataStartIndex != null) ||
-                    // Check if any variable has selectedTestDataProfileId but is missing selectedTestDataProfile or selectedDataSet
-                    // This happens when loading a saved step - setTemplateVariables sets the ID, but we need parameterOptions to set the name and data set
-                    this.templateVariables?.some(v => this.needsDataTypeDropdown(v) &&
-                        v.dataType === 'parameter' &&
-                        v.selectedTestDataProfileId != null &&
-                        (!v.selectedTestDataProfile || !v.selectedDataSet)) ||
+                (
+                // Check if any variable has selectedTestDataProfileId but is missing selectedTestDataProfile or selectedDataSet
+                // This happens when loading a saved step - setTemplateVariables sets the ID, but we need parameterOptions to set the name and data set
+                this.templateVariables?.some(v => this.needsDataTypeDropdown(v) &&
+                    v.dataType === 'parameter' &&
+                    v.selectedTestDataProfileId != null &&
+                    (!v.selectedTestDataProfile || !v.selectedDataSet)) ||
+                    (this.defaultTestDataProfileId && this.defaultTestDataStartIndex != null &&
+                        this.templateVariables?.some(v => this.needsDataTypeDropdown(v) && v.dataType === 'parameter' && !v.selectedTestDataProfile)) ||
                     // The extra uninitialized-variable check below is debug-only: only run it in debug mode
                     // to avoid double-initialising variables in non-debug step-builder flows.
                     (this.isDebug && this.templateVariables?.some(v => this.needsDataTypeDropdown(v) && v.dataType === 'parameter' && !v.selectedTestDataProfile)))) {
@@ -31555,14 +31522,22 @@ class TemplateVariablesFormComponent {
                     // For environment type, parse the value to extract environment and parameter
                     if (dataType === 'environment') {
                         // Environment values are in format *|parameterName|
-                        // We need to find which environment this parameter belongs to
                         const paramName = rawValue;
                         if (paramName) {
-                            // Find the environment that contains this parameter
-                            const envOption = this.environmentOptions.find(env => env.name === paramName);
+                            // If we have a saved environmentId, use it for an exact match (env-{id}-{param})
+                            // to avoid selecting the wrong environment when multiple environments share param names.
+                            let envOption;
+                            if (variable.selectedEnvironmentId != null) {
+                                const exactId = `env-${variable.selectedEnvironmentId}-${paramName}`;
+                                envOption = this.environmentOptions.find(env => env.id === exactId);
+                            }
+                            // Fallback: match by param name only (legacy / first-time save)
+                            if (!envOption) {
+                                envOption = this.environmentOptions.find(env => env.name === paramName);
+                            }
                             if (envOption) {
                                 variable.selectedEnvironment = envOption.environment;
-                                // Extract and store environment ID
+                                // Extract and store environment ID from the option id
                                 const idMatch = envOption.id.match(/env-(\d+)-/);
                                 if (idMatch && idMatch[1]) {
                                     variable.selectedEnvironmentId = parseInt(idMatch[1], 10);