@cqa-lib/cqa-ui 1.1.95 → 1.1.96
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/execution-screen/db-verification-step/db-verification-step.component.mjs +5 -3
- package/fesm2015/cqa-lib-cqa-ui.mjs +4 -2
- package/fesm2015/cqa-lib-cqa-ui.mjs.map +1 -1
- package/fesm2020/cqa-lib-cqa-ui.mjs +4 -2
- package/fesm2020/cqa-lib-cqa-ui.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -11560,6 +11560,8 @@ class DbVerificationStepComponent extends BaseStepComponent {
|
|
|
11560
11560
|
};
|
|
11561
11561
|
}
|
|
11562
11562
|
toggleHeader() {
|
|
11563
|
+
if (this.isLive)
|
|
11564
|
+
return;
|
|
11563
11565
|
this.toggle();
|
|
11564
11566
|
if (!this.isExpanded) {
|
|
11565
11567
|
this.showFailedStepDetails = false;
|
|
@@ -11813,10 +11815,10 @@ class DbVerificationStepComponent extends BaseStepComponent {
|
|
|
11813
11815
|
}
|
|
11814
11816
|
}
|
|
11815
11817
|
DbVerificationStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DbVerificationStepComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
11816
|
-
DbVerificationStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DbVerificationStepComponent, selector: "cqa-db-verification-step", inputs: { id: "id", testStepResultId: "testStepResultId", stepNumber: "stepNumber", title: "title", status: "status", duration: "duration", timingBreakdown: "timingBreakdown", expanded: "expanded", dbTestResult: "dbTestResult", dbConfig: "dbConfig", failureDetails: "failureDetails", reasoning: "reasoning", confidence: "confidence", isUploadingBaseline: "isUploadingBaseline", isMakingCurrentBaseline: "isMakingCurrentBaseline", selfHealAnalysis: "selfHealAnalysis", getSelfHealLoadingStatesHandler: "getSelfHealLoadingStatesHandler", isLive: "isLive" }, outputs: { makeCurrentBaseline: "makeCurrentBaseline", uploadBaseline: "uploadBaseline", analyze: "analyze", viewFullLogs: "viewFullLogs", selfHealAction: "selfHealAction" }, host: { classAttribute: "cqa-ui-root" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div>\n <!-- Header -->\n <div\n class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-p-2 cqa-cursor-pointer\"\n (click)=\"toggleHeader()\"\n style=\"border-bottom: 1px solid #F3F4F6\">\n \n <!-- Status Icon -->\n <!-- Success -->\n <div *ngIf=\"getStatus().toLowerCase() === 'success'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M10.9005 4.99999C11.1289 6.12064 10.9662 7.28571 10.4395 8.30089C9.91279 9.31608 9.054 10.12 8.00631 10.5787C6.95862 11.0373 5.78536 11.1229 4.6822 10.8212C3.57904 10.5195 2.61265 9.84869 1.94419 8.92071C1.27573 7.99272 0.945611 6.86361 1.00888 5.72169C1.07215 4.57976 1.52499 3.49404 2.29188 2.64558C3.05876 1.79712 4.09334 1.23721 5.22308 1.05922C6.35282 0.881233 7.50944 1.09592 8.50005 1.66749\" stroke=\"#22C55E\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M4.5 5.5L6 7L11 2\" stroke=\"#22C55E\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Failure -->\n <div *ngIf=\"getStatus().toLowerCase() === 'failure' || getStatus().toLowerCase() === 'failed'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.5 4.5L4.5 7.5\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M4.5 4.5L7.5 7.5\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Pending -->\n <div *ngIf=\"getStatus().toLowerCase() === 'pending'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Running - Show spinner -->\n <div *ngIf=\"getStatus().toLowerCase() === 'running'\">\n <svg class=\"cqa-animate-spin cqa-text-[#3B82F6]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"6\" cy=\"6\" r=\"5\" stroke=\"currentColor\" stroke-width=\"1.5\" fill=\"none\" opacity=\"0.25\"/>\n <path d=\"M6 1A5 5 0 0 1 11 6\" stroke=\"currentColor\" stroke-width=\"1.5\" fill=\"none\" stroke-linecap=\"round\"/>\n </svg>\n </div>\n\n <div><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\n <rect width=\"20\" height=\"16\" rx=\"4\" fill=\"#F0F0F1\"/>\n <path d=\"M13.5 3.5H6.5C5.95 3.5 5.5 3.95 5.5 4.5V11.5C5.5 12.05 5.95 12.5 6.5 12.5H13.5C14.05 12.5 14.5 12.05 14.5 11.5V4.5C14.5 3.95 14.05 3.5 13.5 3.5ZM13.5 4.5V6H6.5V4.5H13.5ZM13.5 7V9H6.5V7H13.5ZM6.5 11.5V10H13.5V11.5H6.5Z\" fill=\"#212122\"/>\n </svg></div>\n\n <!-- Step Number and Title -->\n <div class=\"cqa-font-bold cqa-flex-1 cqa-text-[#334155] cqa-text-[11px] cqa-leading-[13px]\">\n {{ stepNumber }}. <span [innerHTML]=\"title\"></span> \n \n <span class=\"cqa-ml-1 cqa-px-1.5 cqa-py-0.5 cqa-rounded-full cqa-font-medium cqa-text-[#212122] cqa-bg-[#F0F0F1] cqa-text-[10px] cqa-leading-[15px] cqa-min-w-max\">\n Database\n </span>\n\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#9CA3AF]\">\n {{ formatDuration(duration) }}\n </span>\n <svg [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M3.5 5L7 8.5L10.5 5\" stroke=\"#9CA3AF\" stroke-width=\"0.833333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n </div>\n\n <!-- Expanded Content -->\n <div *ngIf=\"isExpanded\" class=\"cqa-p-2 !cqa-pl-9 !cqa-pr-6 cqa-bg-white\">\n <!-- Summary Bar -->\n <div class=\"cqa-mb-1.5 cqa-p-3 cqa-bg-[#FCFCFC] cqa-rounded-[6px] cqa-flex cqa-flex-col cqa-gap-2\" style=\"border: 1px solid #E5E7EB;\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-4\">\n <!-- Status Badge -->\n <cqa-badge\n *ngIf=\"getStatus()?.toLowerCase() === 'failure' || getStatus()?.toLowerCase() === 'failed'\"\n label=\"FAIL\"\n backgroundColor=\"#DC2626\"\n textColor=\"#FFFFFF\"\n size=\"small\">\n </cqa-badge>\n <cqa-badge\n *ngIf=\"getStatus()?.toLowerCase() === 'success'\"\n label=\"PASS\"\n backgroundColor=\"#22C55E\"\n textColor=\"#FFFFFF\"\n size=\"small\">\n </cqa-badge>\n\n <div class=\"cqa-h-[19px] cqa-w-[1px] cqa-bg-[#E5E7EB]\"></div>\n \n <!-- Summary Stats -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-4 cqa-text-[11px] cqa-leading-[16px] cqa-text-[#6B7280]\">\n <span *ngIf=\"duration\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Total Time: <span class=\"cqa-text-[#4B5563]\">{{ formatDuration(duration) }}</span></span>\n <span *ngIf=\"cachedQueryResults?.length > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Queries: <span class=\"cqa-text-[#4B5563]\">{{ cachedQueryResults?.length || 0 }}</span></span>\n <span *ngIf=\"dbTestResult?.assertionResults?.length > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Assertions: <span class=\"cqa-text-[#4B5563]\">{{ dbTestResult?.assertionResults?.length || 0 }}</span></span>\n <span *ngIf=\"getTotalRowsReturned() > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Rows Returned: <span class=\"cqa-text-[#4B5563]\">{{ getTotalRowsReturned() }}</span></span>\n </div>\n </div>\n\n <!-- Failure Banner -->\n <div \n *ngIf=\"getFailureMessage()\"\n class=\"cqa-flex cqa-px-2 cqa-py-1 cqa-bg-[#FEF2F2] cqa-rounded-[4px]\" style=\"border: 1px solid #FEE2E2;\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#B91C1C]\">\n {{ getFailureMessage() }}\n </span>\n </div>\n </div>\n\n <!-- Database Environment Section -->\n <div *ngIf=\"dbConfig\" class=\"cqa-mb-1.5\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Database environment</div>\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-px-4 cqa-py-2 cqa-relative cqa-flex cqa-flex-wrap cqa-gap-3\">\n <!-- Environment -->\n <div class=\"\">\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#45556C] cqa-mb-1\">Environment</div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-4\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-text-[#0F172B]\">{{ dbConfig.name }}</span>\n <span (click)=\"copyEnvironment()\" class=\"cqa-cursor-pointer\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.33332 10.6667H3.99999C3.64637 10.6667 3.30723 10.5263 3.05718 10.2762C2.80713 10.0262 2.66666 9.68704 2.66666 9.33341V4.00008C2.66666 3.64646 2.80713 3.30732 3.05718 3.05727C3.30723 2.80722 3.64637 2.66675 3.99999 2.66675H9.33332C9.68695 2.66675 10.0261 2.80722 10.2761 3.05727C10.5262 3.30732 10.6667 3.64646 10.6667 4.00008V5.33341M6.66666 13.3334H12C12.3536 13.3334 12.6928 13.1929 12.9428 12.9429C13.1928 12.6928 13.3333 12.3537 13.3333 12.0001V6.66675C13.3333 6.31313 13.1928 5.97399 12.9428 5.72394C12.6928 5.47389 12.3536 5.33341 12 5.33341H6.66666C6.31303 5.33341 5.9739 5.47389 5.72385 5.72394C5.4738 5.97399 5.33332 6.31313 5.33332 6.66675V12.0001C5.33332 12.3537 5.4738 12.6928 5.72385 12.9429C5.9739 13.1929 6.31303 13.3334 6.66666 13.3334Z\" stroke=\"#636363\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </span>\n </div>\n </div>\n \n <div class=\"\">\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#45556C] cqa-mb-1\">Type</div>\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-text-[#0F172B]\">{{ dbConfig.dbType }}</div>\n </div>\n </div>\n </div>\n\n <div class=\"cqa-mb-1.5\" *ngIf=\"cachedQueryResults?.length > 0\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Query Execution</div>\n <div class=\"cqa-flex cqa-flex-col cqa-gap-2 cqa-px-4 cqa-py-2 cqa-bg-white cqa-rounded-[10px]\" style=\"border: 1px solid #E2E8F0;\">\n <cqa-db-query-execution-item\n *ngFor=\"let queryItem of cachedQueryResults; let i = index; trackBy: trackByQueryKey\"\n [queryNumber]=\"i + 1\"\n [queryKey]=\"queryItem.key\"\n [queryResult]=\"queryItem.result\"\n [status]=\"getQueryStatus(queryItem.key)\"\n [variableName]=\"queryItem.key\">\n </cqa-db-query-execution-item>\n </div>\n </div>\n\n <!-- Verification Section -->\n <div *ngIf=\"dbTestResult?.assertionResults && dbTestResult?.assertionResults?.length > 0\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Verification</div> \n <!-- Verification Table -->\n <div class=\"cqa-bg-white cqa-rounded-[10px] cqa-px-4 cqa-py-2 cqa-overflow-hidden\" style=\"border: 1px solid #E2E8F0;\">\n <!-- Segment Control for Filters -->\n <cqa-segment-control\n [segments]=\"filterSegments\"\n [value]=\"verificationFilter\"\n (valueChange)=\"onFilterChange($event)\">\n </cqa-segment-control>\n <cqa-table-template\n [columns]=\"verificationTableColumns\"\n [data]=\"getTableData()\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [isEmptyState]=\"isEmptyTable\"\n [emptyStateConfig]=\"emptyStateConfig\"\n [showSearchBar]=\"false\"\n [showFilterButton]=\"false\"\n [showSettingsButton]=\"false\"\n [showAutoRefreshButton]=\"false\"\n [showOtherButton]=\"false\"\n [showFilterPanel]=\"false\"\n [serverSidePagination]=\"false\"\n (pageChange)=\"onPageChange($event)\">\n </cqa-table-template>\n </div>\n </div>\n\n <!-- Self Heal Analysis -->\n <cqa-self-heal-analysis \n *ngIf=\"selfHealAnalysis\" \n [originalLocator]=\"selfHealAnalysis.originalLocator\"\n [healedLocator]=\"selfHealAnalysis.healedLocator\"\n [confidence]=\"selfHealAnalysis.confidence\"\n [healMethod]=\"selfHealAnalysis.healMethod\"\n [isLoadingAccept]=\"getSelfHealLoadingStatesHandler ? getSelfHealLoadingStatesHandler().isLoadingAccept : false\"\n [isLoadingModifyAccept]=\"getSelfHealLoadingStatesHandler ? getSelfHealLoadingStatesHandler().isLoadingModifyAccept : false\"\n (action)=\"onSelfHealAction($event)\">\n </cqa-self-heal-analysis>\n\n <!-- Timing Breakdown -->\n <div *ngIf=\"timingBreakdown\" class=\"cqa-flex cqa-items-center cqa-justify-end cqa-gap-5 cqa-pt-4 cqa-px-4 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#9CA3AF]\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <div><svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg></div>\n <span>Timing breakdown</span>\n </div>\n <span class=\"cqa-text-dialog-muted cqa-flex cqa-items-center cqa-gap-3\">\n <div>\n App <span class=\"cqa-text-[#374151]\">{{ formatDuration(timingBreakdown.app) }}</span>\n </div>\n <div><svg width=\"1\" height=\"11\" viewBox=\"0 0 1 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M-3.8147e-06 10.32V-7.15256e-07H0.959996V10.32H-3.8147e-06Z\" fill=\"#E5E7EB\"/></svg></div>\n <div>\n Tool <span class=\"cqa-text-[#374151]\">{{ formatDuration(timingBreakdown.tool) }}</span>\n </div>\n </span>\n </div>\n\n <!-- View More Failed Step Button - shown when expanded and failure details exist -->\n <div *ngIf=\"showViewMoreButton\" class=\"cqa-mt-2 cqa-px-4\">\n <cqa-view-more-failed-step-button\n [timingBreakdown]=\"timingBreakdown\"\n [subSteps]=\"getSubStepsForFailedStep()\"\n [failureDetails]=\"failureDetails\"\n [isExpanded]=\"showFailedStepDetails\"\n (viewMoreClick)=\"onViewMoreFailedStepClick($event)\">\n </cqa-view-more-failed-step-button>\n </div>\n\n <!-- Updated Failed Step Component - shown when button is clicked -->\n <div *ngIf=\"showViewMoreButton && showFailedStepDetails && failureDetails\" class=\"cqa-mt-2 cqa-px-4\">\n <cqa-updated-failed-step\n [testStepResultId]=\"testStepResultId\"\n [timingBreakdown]=\"timingBreakdown\"\n [expanded]=\"true\"\n [subSteps]=\"getSubStepsForFailedStep()\"\n [failureDetails]=\"failureDetails\"\n [reasoning]=\"reasoning\"\n [confidence]=\"confidence\"\n [isUploadingBaseline]=\"isUploadingBaseline\"\n [isMakingCurrentBaseline]=\"isMakingCurrentBaseline\"\n [isLive]=\"isLive\"\n (makeCurrentBaseline)=\"onMakeCurrentBaseline($event)\"\n (uploadBaseline)=\"onUploadBaseline($event)\"\n (analyze)=\"onAnalyze()\"\n (viewFullLogs)=\"onViewFullLogs()\">\n </cqa-updated-failed-step>\n </div>\n </div>\n</div>\n\n", components: [{ type: BadgeComponent, selector: "cqa-badge", inputs: ["type", "label", "icon", "iconLibrary", "variant", "size", "backgroundColor", "textColor", "borderColor", "iconBackgroundColor", "iconColor", "iconSize", "inlineStyles", "key", "value", "keyTextColor", "valueTextColor", "isLoading"] }, { type: DbQueryExecutionItemComponent, selector: "cqa-db-query-execution-item", inputs: ["queryNumber", "queryKey", "queryResult", "status", "variableName"] }, { type: SegmentControlComponent, selector: "cqa-segment-control", inputs: ["segments", "value", "disabled"], outputs: ["valueChange"] }, { type: TableTemplateComponent, selector: "cqa-table-template", inputs: ["searchPlaceholder", "searchValue", "showClear", "showSearchBar", "filterConfig", "showFilterPanel", "showFilterButton", "otherButtonLabel", "otherButtonVariant", "showOtherButton", "showActionButton", "showSettingsButton", "showAutoRefreshButton", "data", "isEmptyState", "emptyStateConfig", "actions", "chips", "filterApplied", "columns", "selectedAutoRefreshInterval", "pageIndex", "pageSize", "serverSidePagination", "totalElements", "isTableLoading", "isTableDataLoading"], outputs: ["onSearchChange", "onApplyFilterClick", "onResetFilterClick", "onClearAll", "removeChip", "pageChange", "onReload", "onAutoRefreshClick"] }, { type: SelfHealAnalysisComponent, selector: "cqa-self-heal-analysis", inputs: ["originalLocator", "healedLocator", "confidence", "healMethod", "isLoadingAccept", "isLoadingModifyAccept"], outputs: ["action"] }, { type: ViewMoreFailedStepButtonComponent, selector: "cqa-view-more-failed-step-button", inputs: ["timingBreakdown", "subSteps", "failureDetails", "isExpanded"], outputs: ["viewMoreClick"] }, { type: UpdatedFailedStepComponent, selector: "cqa-updated-failed-step", inputs: ["timingBreakdown", "testStepResultId", "expanded", "subSteps", "failureDetails", "reasoning", "confidence", "isUploadingBaseline", "isMakingCurrentBaseline", "isLive"], outputs: ["makeCurrentBaseline", "uploadBaseline", "analyze", "viewFullLogs"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
11818
|
+
DbVerificationStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DbVerificationStepComponent, selector: "cqa-db-verification-step", inputs: { id: "id", testStepResultId: "testStepResultId", stepNumber: "stepNumber", title: "title", status: "status", duration: "duration", timingBreakdown: "timingBreakdown", expanded: "expanded", dbTestResult: "dbTestResult", dbConfig: "dbConfig", failureDetails: "failureDetails", reasoning: "reasoning", confidence: "confidence", isUploadingBaseline: "isUploadingBaseline", isMakingCurrentBaseline: "isMakingCurrentBaseline", selfHealAnalysis: "selfHealAnalysis", getSelfHealLoadingStatesHandler: "getSelfHealLoadingStatesHandler", isLive: "isLive" }, outputs: { makeCurrentBaseline: "makeCurrentBaseline", uploadBaseline: "uploadBaseline", analyze: "analyze", viewFullLogs: "viewFullLogs", selfHealAction: "selfHealAction" }, host: { classAttribute: "cqa-ui-root" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div>\n <!-- Header -->\n <div\n class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-p-2 cqa-cursor-pointer\"\n (click)=\"toggleHeader()\"\n style=\"border-bottom: 1px solid #F3F4F6\">\n \n <!-- Status Icon -->\n <!-- Success -->\n <div *ngIf=\"getStatus().toLowerCase() === 'success'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M10.9005 4.99999C11.1289 6.12064 10.9662 7.28571 10.4395 8.30089C9.91279 9.31608 9.054 10.12 8.00631 10.5787C6.95862 11.0373 5.78536 11.1229 4.6822 10.8212C3.57904 10.5195 2.61265 9.84869 1.94419 8.92071C1.27573 7.99272 0.945611 6.86361 1.00888 5.72169C1.07215 4.57976 1.52499 3.49404 2.29188 2.64558C3.05876 1.79712 4.09334 1.23721 5.22308 1.05922C6.35282 0.881233 7.50944 1.09592 8.50005 1.66749\" stroke=\"#22C55E\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M4.5 5.5L6 7L11 2\" stroke=\"#22C55E\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Failure -->\n <div *ngIf=\"getStatus().toLowerCase() === 'failure' || getStatus().toLowerCase() === 'failed'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.5 4.5L4.5 7.5\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M4.5 4.5L7.5 7.5\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Pending -->\n <div *ngIf=\"getStatus().toLowerCase() === 'pending'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Running - Show spinner -->\n <div *ngIf=\"getStatus().toLowerCase() === 'running'\">\n <svg class=\"cqa-animate-spin cqa-text-[#3B82F6]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"6\" cy=\"6\" r=\"5\" stroke=\"currentColor\" stroke-width=\"1.5\" fill=\"none\" opacity=\"0.25\"/>\n <path d=\"M6 1A5 5 0 0 1 11 6\" stroke=\"currentColor\" stroke-width=\"1.5\" fill=\"none\" stroke-linecap=\"round\"/>\n </svg>\n </div>\n\n <div><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\n <rect width=\"20\" height=\"16\" rx=\"4\" fill=\"#F0F0F1\"/>\n <path d=\"M13.5 3.5H6.5C5.95 3.5 5.5 3.95 5.5 4.5V11.5C5.5 12.05 5.95 12.5 6.5 12.5H13.5C14.05 12.5 14.5 12.05 14.5 11.5V4.5C14.5 3.95 14.05 3.5 13.5 3.5ZM13.5 4.5V6H6.5V4.5H13.5ZM13.5 7V9H6.5V7H13.5ZM6.5 11.5V10H13.5V11.5H6.5Z\" fill=\"#212122\"/>\n </svg></div>\n\n <!-- Step Number and Title -->\n <div class=\"cqa-font-bold cqa-flex-1 cqa-text-[#334155] cqa-text-[11px] cqa-leading-[13px]\">\n {{ stepNumber }}. <span [innerHTML]=\"title\"></span> \n \n <span class=\"cqa-ml-1 cqa-px-1.5 cqa-py-0.5 cqa-rounded-full cqa-font-medium cqa-text-[#212122] cqa-bg-[#F0F0F1] cqa-text-[10px] cqa-leading-[15px] cqa-min-w-max\">\n Database\n </span>\n\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#9CA3AF]\">\n {{ formatDuration(duration) }}\n </span>\n <svg *ngIf=\"!isLive\" [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M3.5 5L7 8.5L10.5 5\" stroke=\"#9CA3AF\" stroke-width=\"0.833333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n </div>\n\n <!-- Expanded Content -->\n <div *ngIf=\"isExpanded\" class=\"cqa-p-2 !cqa-pl-9 !cqa-pr-6 cqa-bg-white\">\n <!-- Summary Bar -->\n <div class=\"cqa-mb-1.5 cqa-p-3 cqa-bg-[#FCFCFC] cqa-rounded-[6px] cqa-flex cqa-flex-col cqa-gap-2\" style=\"border: 1px solid #E5E7EB;\" *ngIf=\"getStatus() || duration || cachedQueryResults?.length > 0 || dbTestResult?.assertionResults?.length > 0 || getTotalRowsReturned() > 0 || getFailureMessage()\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-4\">\n <!-- Status Badge -->\n <cqa-badge\n *ngIf=\"getStatus()?.toLowerCase() === 'failure' || getStatus()?.toLowerCase() === 'failed'\"\n label=\"FAIL\"\n backgroundColor=\"#DC2626\"\n textColor=\"#FFFFFF\"\n size=\"small\">\n </cqa-badge>\n <cqa-badge\n *ngIf=\"getStatus()?.toLowerCase() === 'success'\"\n label=\"PASS\"\n backgroundColor=\"#22C55E\"\n textColor=\"#FFFFFF\"\n size=\"small\">\n </cqa-badge>\n\n <div class=\"cqa-h-[19px] cqa-w-[1px] cqa-bg-[#E5E7EB]\"></div>\n \n <!-- Summary Stats -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-4 cqa-text-[11px] cqa-leading-[16px] cqa-text-[#6B7280]\">\n <span *ngIf=\"duration\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Total Time: <span class=\"cqa-text-[#4B5563]\">{{ formatDuration(duration) }}</span></span>\n <span *ngIf=\"cachedQueryResults?.length > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Queries: <span class=\"cqa-text-[#4B5563]\">{{ cachedQueryResults?.length || 0 }}</span></span>\n <span *ngIf=\"dbTestResult?.assertionResults?.length > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Assertions: <span class=\"cqa-text-[#4B5563]\">{{ dbTestResult?.assertionResults?.length || 0 }}</span></span>\n <span *ngIf=\"getTotalRowsReturned() > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Rows Returned: <span class=\"cqa-text-[#4B5563]\">{{ getTotalRowsReturned() }}</span></span>\n </div>\n </div>\n\n <!-- Failure Banner -->\n <div \n *ngIf=\"getFailureMessage()\"\n class=\"cqa-flex cqa-px-2 cqa-py-1 cqa-bg-[#FEF2F2] cqa-rounded-[4px]\" style=\"border: 1px solid #FEE2E2;\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#B91C1C]\">\n {{ getFailureMessage() }}\n </span>\n </div>\n </div>\n\n <!-- Database Environment Section -->\n <div *ngIf=\"dbConfig\" class=\"cqa-mb-1.5\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Database environment</div>\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-px-4 cqa-py-2 cqa-relative cqa-flex cqa-flex-wrap cqa-gap-3\">\n <!-- Environment -->\n <div class=\"\">\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#45556C] cqa-mb-1\">Environment</div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-4\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-text-[#0F172B]\">{{ dbConfig.name }}</span>\n <span (click)=\"copyEnvironment()\" class=\"cqa-cursor-pointer\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.33332 10.6667H3.99999C3.64637 10.6667 3.30723 10.5263 3.05718 10.2762C2.80713 10.0262 2.66666 9.68704 2.66666 9.33341V4.00008C2.66666 3.64646 2.80713 3.30732 3.05718 3.05727C3.30723 2.80722 3.64637 2.66675 3.99999 2.66675H9.33332C9.68695 2.66675 10.0261 2.80722 10.2761 3.05727C10.5262 3.30732 10.6667 3.64646 10.6667 4.00008V5.33341M6.66666 13.3334H12C12.3536 13.3334 12.6928 13.1929 12.9428 12.9429C13.1928 12.6928 13.3333 12.3537 13.3333 12.0001V6.66675C13.3333 6.31313 13.1928 5.97399 12.9428 5.72394C12.6928 5.47389 12.3536 5.33341 12 5.33341H6.66666C6.31303 5.33341 5.9739 5.47389 5.72385 5.72394C5.4738 5.97399 5.33332 6.31313 5.33332 6.66675V12.0001C5.33332 12.3537 5.4738 12.6928 5.72385 12.9429C5.9739 13.1929 6.31303 13.3334 6.66666 13.3334Z\" stroke=\"#636363\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </span>\n </div>\n </div>\n \n <div class=\"\">\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#45556C] cqa-mb-1\">Type</div>\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-text-[#0F172B]\">{{ dbConfig.dbType }}</div>\n </div>\n </div>\n </div>\n\n <div class=\"cqa-mb-1.5\" *ngIf=\"cachedQueryResults?.length > 0\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Query Execution</div>\n <div class=\"cqa-flex cqa-flex-col cqa-gap-2 cqa-px-4 cqa-py-2 cqa-bg-white cqa-rounded-[10px]\" style=\"border: 1px solid #E2E8F0;\">\n <cqa-db-query-execution-item\n *ngFor=\"let queryItem of cachedQueryResults; let i = index; trackBy: trackByQueryKey\"\n [queryNumber]=\"i + 1\"\n [queryKey]=\"queryItem.key\"\n [queryResult]=\"queryItem.result\"\n [status]=\"getQueryStatus(queryItem.key)\"\n [variableName]=\"queryItem.key\">\n </cqa-db-query-execution-item>\n </div>\n </div>\n\n <!-- Verification Section -->\n <div *ngIf=\"dbTestResult?.assertionResults && dbTestResult?.assertionResults?.length > 0\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Verification</div> \n <!-- Verification Table -->\n <div class=\"cqa-bg-white cqa-rounded-[10px] cqa-px-4 cqa-py-2 cqa-overflow-hidden\" style=\"border: 1px solid #E2E8F0;\">\n <!-- Segment Control for Filters -->\n <cqa-segment-control\n [segments]=\"filterSegments\"\n [value]=\"verificationFilter\"\n (valueChange)=\"onFilterChange($event)\">\n </cqa-segment-control>\n <cqa-table-template\n [columns]=\"verificationTableColumns\"\n [data]=\"getTableData()\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [isEmptyState]=\"isEmptyTable\"\n [emptyStateConfig]=\"emptyStateConfig\"\n [showSearchBar]=\"false\"\n [showFilterButton]=\"false\"\n [showSettingsButton]=\"false\"\n [showAutoRefreshButton]=\"false\"\n [showOtherButton]=\"false\"\n [showFilterPanel]=\"false\"\n [serverSidePagination]=\"false\"\n (pageChange)=\"onPageChange($event)\">\n </cqa-table-template>\n </div>\n </div>\n\n <!-- Self Heal Analysis -->\n <cqa-self-heal-analysis \n *ngIf=\"selfHealAnalysis\" \n [originalLocator]=\"selfHealAnalysis.originalLocator\"\n [healedLocator]=\"selfHealAnalysis.healedLocator\"\n [confidence]=\"selfHealAnalysis.confidence\"\n [healMethod]=\"selfHealAnalysis.healMethod\"\n [isLoadingAccept]=\"getSelfHealLoadingStatesHandler ? getSelfHealLoadingStatesHandler().isLoadingAccept : false\"\n [isLoadingModifyAccept]=\"getSelfHealLoadingStatesHandler ? getSelfHealLoadingStatesHandler().isLoadingModifyAccept : false\"\n (action)=\"onSelfHealAction($event)\">\n </cqa-self-heal-analysis>\n\n <!-- Timing Breakdown -->\n <div *ngIf=\"timingBreakdown\" class=\"cqa-flex cqa-items-center cqa-justify-end cqa-gap-5 cqa-pt-4 cqa-px-4 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#9CA3AF]\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <div><svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg></div>\n <span>Timing breakdown</span>\n </div>\n <span class=\"cqa-text-dialog-muted cqa-flex cqa-items-center cqa-gap-3\">\n <div>\n App <span class=\"cqa-text-[#374151]\">{{ formatDuration(timingBreakdown.app) }}</span>\n </div>\n <div><svg width=\"1\" height=\"11\" viewBox=\"0 0 1 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M-3.8147e-06 10.32V-7.15256e-07H0.959996V10.32H-3.8147e-06Z\" fill=\"#E5E7EB\"/></svg></div>\n <div>\n Tool <span class=\"cqa-text-[#374151]\">{{ formatDuration(timingBreakdown.tool) }}</span>\n </div>\n </span>\n </div>\n\n <!-- View More Failed Step Button - shown when expanded and failure details exist -->\n <div *ngIf=\"showViewMoreButton\" class=\"cqa-mt-2 cqa-px-4\">\n <cqa-view-more-failed-step-button\n [timingBreakdown]=\"timingBreakdown\"\n [subSteps]=\"getSubStepsForFailedStep()\"\n [failureDetails]=\"failureDetails\"\n [isExpanded]=\"showFailedStepDetails\"\n (viewMoreClick)=\"onViewMoreFailedStepClick($event)\">\n </cqa-view-more-failed-step-button>\n </div>\n\n <!-- Updated Failed Step Component - shown when button is clicked -->\n <div *ngIf=\"showViewMoreButton && showFailedStepDetails && failureDetails\" class=\"cqa-mt-2 cqa-px-4\">\n <cqa-updated-failed-step\n [testStepResultId]=\"testStepResultId\"\n [timingBreakdown]=\"timingBreakdown\"\n [expanded]=\"true\"\n [subSteps]=\"getSubStepsForFailedStep()\"\n [failureDetails]=\"failureDetails\"\n [reasoning]=\"reasoning\"\n [confidence]=\"confidence\"\n [isUploadingBaseline]=\"isUploadingBaseline\"\n [isMakingCurrentBaseline]=\"isMakingCurrentBaseline\"\n [isLive]=\"isLive\"\n (makeCurrentBaseline)=\"onMakeCurrentBaseline($event)\"\n (uploadBaseline)=\"onUploadBaseline($event)\"\n (analyze)=\"onAnalyze()\"\n (viewFullLogs)=\"onViewFullLogs()\">\n </cqa-updated-failed-step>\n </div>\n </div>\n</div>\n\n", components: [{ type: BadgeComponent, selector: "cqa-badge", inputs: ["type", "label", "icon", "iconLibrary", "variant", "size", "backgroundColor", "textColor", "borderColor", "iconBackgroundColor", "iconColor", "iconSize", "inlineStyles", "key", "value", "keyTextColor", "valueTextColor", "isLoading"] }, { type: DbQueryExecutionItemComponent, selector: "cqa-db-query-execution-item", inputs: ["queryNumber", "queryKey", "queryResult", "status", "variableName"] }, { type: SegmentControlComponent, selector: "cqa-segment-control", inputs: ["segments", "value", "disabled"], outputs: ["valueChange"] }, { type: TableTemplateComponent, selector: "cqa-table-template", inputs: ["searchPlaceholder", "searchValue", "showClear", "showSearchBar", "filterConfig", "showFilterPanel", "showFilterButton", "otherButtonLabel", "otherButtonVariant", "showOtherButton", "showActionButton", "showSettingsButton", "showAutoRefreshButton", "data", "isEmptyState", "emptyStateConfig", "actions", "chips", "filterApplied", "columns", "selectedAutoRefreshInterval", "pageIndex", "pageSize", "serverSidePagination", "totalElements", "isTableLoading", "isTableDataLoading"], outputs: ["onSearchChange", "onApplyFilterClick", "onResetFilterClick", "onClearAll", "removeChip", "pageChange", "onReload", "onAutoRefreshClick"] }, { type: SelfHealAnalysisComponent, selector: "cqa-self-heal-analysis", inputs: ["originalLocator", "healedLocator", "confidence", "healMethod", "isLoadingAccept", "isLoadingModifyAccept"], outputs: ["action"] }, { type: ViewMoreFailedStepButtonComponent, selector: "cqa-view-more-failed-step-button", inputs: ["timingBreakdown", "subSteps", "failureDetails", "isExpanded"], outputs: ["viewMoreClick"] }, { type: UpdatedFailedStepComponent, selector: "cqa-updated-failed-step", inputs: ["timingBreakdown", "testStepResultId", "expanded", "subSteps", "failureDetails", "reasoning", "confidence", "isUploadingBaseline", "isMakingCurrentBaseline", "isLive"], outputs: ["makeCurrentBaseline", "uploadBaseline", "analyze", "viewFullLogs"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
11817
11819
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DbVerificationStepComponent, decorators: [{
|
|
11818
11820
|
type: Component,
|
|
11819
|
-
args: [{ selector: 'cqa-db-verification-step', host: { class: 'cqa-ui-root' }, template: "<div>\n <!-- Header -->\n <div\n class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-p-2 cqa-cursor-pointer\"\n (click)=\"toggleHeader()\"\n style=\"border-bottom: 1px solid #F3F4F6\">\n \n <!-- Status Icon -->\n <!-- Success -->\n <div *ngIf=\"getStatus().toLowerCase() === 'success'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M10.9005 4.99999C11.1289 6.12064 10.9662 7.28571 10.4395 8.30089C9.91279 9.31608 9.054 10.12 8.00631 10.5787C6.95862 11.0373 5.78536 11.1229 4.6822 10.8212C3.57904 10.5195 2.61265 9.84869 1.94419 8.92071C1.27573 7.99272 0.945611 6.86361 1.00888 5.72169C1.07215 4.57976 1.52499 3.49404 2.29188 2.64558C3.05876 1.79712 4.09334 1.23721 5.22308 1.05922C6.35282 0.881233 7.50944 1.09592 8.50005 1.66749\" stroke=\"#22C55E\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M4.5 5.5L6 7L11 2\" stroke=\"#22C55E\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Failure -->\n <div *ngIf=\"getStatus().toLowerCase() === 'failure' || getStatus().toLowerCase() === 'failed'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.5 4.5L4.5 7.5\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M4.5 4.5L7.5 7.5\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Pending -->\n <div *ngIf=\"getStatus().toLowerCase() === 'pending'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Running - Show spinner -->\n <div *ngIf=\"getStatus().toLowerCase() === 'running'\">\n <svg class=\"cqa-animate-spin cqa-text-[#3B82F6]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"6\" cy=\"6\" r=\"5\" stroke=\"currentColor\" stroke-width=\"1.5\" fill=\"none\" opacity=\"0.25\"/>\n <path d=\"M6 1A5 5 0 0 1 11 6\" stroke=\"currentColor\" stroke-width=\"1.5\" fill=\"none\" stroke-linecap=\"round\"/>\n </svg>\n </div>\n\n <div><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\n <rect width=\"20\" height=\"16\" rx=\"4\" fill=\"#F0F0F1\"/>\n <path d=\"M13.5 3.5H6.5C5.95 3.5 5.5 3.95 5.5 4.5V11.5C5.5 12.05 5.95 12.5 6.5 12.5H13.5C14.05 12.5 14.5 12.05 14.5 11.5V4.5C14.5 3.95 14.05 3.5 13.5 3.5ZM13.5 4.5V6H6.5V4.5H13.5ZM13.5 7V9H6.5V7H13.5ZM6.5 11.5V10H13.5V11.5H6.5Z\" fill=\"#212122\"/>\n </svg></div>\n\n <!-- Step Number and Title -->\n <div class=\"cqa-font-bold cqa-flex-1 cqa-text-[#334155] cqa-text-[11px] cqa-leading-[13px]\">\n {{ stepNumber }}. <span [innerHTML]=\"title\"></span> \n \n <span class=\"cqa-ml-1 cqa-px-1.5 cqa-py-0.5 cqa-rounded-full cqa-font-medium cqa-text-[#212122] cqa-bg-[#F0F0F1] cqa-text-[10px] cqa-leading-[15px] cqa-min-w-max\">\n Database\n </span>\n\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#9CA3AF]\">\n {{ formatDuration(duration) }}\n </span>\n <svg [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M3.5 5L7 8.5L10.5 5\" stroke=\"#9CA3AF\" stroke-width=\"0.833333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n </div>\n\n <!-- Expanded Content -->\n <div *ngIf=\"isExpanded\" class=\"cqa-p-2 !cqa-pl-9 !cqa-pr-6 cqa-bg-white\">\n <!-- Summary Bar -->\n <div class=\"cqa-mb-1.5 cqa-p-3 cqa-bg-[#FCFCFC] cqa-rounded-[6px] cqa-flex cqa-flex-col cqa-gap-2\" style=\"border: 1px solid #E5E7EB;\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-4\">\n <!-- Status Badge -->\n <cqa-badge\n *ngIf=\"getStatus()?.toLowerCase() === 'failure' || getStatus()?.toLowerCase() === 'failed'\"\n label=\"FAIL\"\n backgroundColor=\"#DC2626\"\n textColor=\"#FFFFFF\"\n size=\"small\">\n </cqa-badge>\n <cqa-badge\n *ngIf=\"getStatus()?.toLowerCase() === 'success'\"\n label=\"PASS\"\n backgroundColor=\"#22C55E\"\n textColor=\"#FFFFFF\"\n size=\"small\">\n </cqa-badge>\n\n <div class=\"cqa-h-[19px] cqa-w-[1px] cqa-bg-[#E5E7EB]\"></div>\n \n <!-- Summary Stats -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-4 cqa-text-[11px] cqa-leading-[16px] cqa-text-[#6B7280]\">\n <span *ngIf=\"duration\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Total Time: <span class=\"cqa-text-[#4B5563]\">{{ formatDuration(duration) }}</span></span>\n <span *ngIf=\"cachedQueryResults?.length > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Queries: <span class=\"cqa-text-[#4B5563]\">{{ cachedQueryResults?.length || 0 }}</span></span>\n <span *ngIf=\"dbTestResult?.assertionResults?.length > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Assertions: <span class=\"cqa-text-[#4B5563]\">{{ dbTestResult?.assertionResults?.length || 0 }}</span></span>\n <span *ngIf=\"getTotalRowsReturned() > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Rows Returned: <span class=\"cqa-text-[#4B5563]\">{{ getTotalRowsReturned() }}</span></span>\n </div>\n </div>\n\n <!-- Failure Banner -->\n <div \n *ngIf=\"getFailureMessage()\"\n class=\"cqa-flex cqa-px-2 cqa-py-1 cqa-bg-[#FEF2F2] cqa-rounded-[4px]\" style=\"border: 1px solid #FEE2E2;\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#B91C1C]\">\n {{ getFailureMessage() }}\n </span>\n </div>\n </div>\n\n <!-- Database Environment Section -->\n <div *ngIf=\"dbConfig\" class=\"cqa-mb-1.5\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Database environment</div>\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-px-4 cqa-py-2 cqa-relative cqa-flex cqa-flex-wrap cqa-gap-3\">\n <!-- Environment -->\n <div class=\"\">\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#45556C] cqa-mb-1\">Environment</div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-4\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-text-[#0F172B]\">{{ dbConfig.name }}</span>\n <span (click)=\"copyEnvironment()\" class=\"cqa-cursor-pointer\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.33332 10.6667H3.99999C3.64637 10.6667 3.30723 10.5263 3.05718 10.2762C2.80713 10.0262 2.66666 9.68704 2.66666 9.33341V4.00008C2.66666 3.64646 2.80713 3.30732 3.05718 3.05727C3.30723 2.80722 3.64637 2.66675 3.99999 2.66675H9.33332C9.68695 2.66675 10.0261 2.80722 10.2761 3.05727C10.5262 3.30732 10.6667 3.64646 10.6667 4.00008V5.33341M6.66666 13.3334H12C12.3536 13.3334 12.6928 13.1929 12.9428 12.9429C13.1928 12.6928 13.3333 12.3537 13.3333 12.0001V6.66675C13.3333 6.31313 13.1928 5.97399 12.9428 5.72394C12.6928 5.47389 12.3536 5.33341 12 5.33341H6.66666C6.31303 5.33341 5.9739 5.47389 5.72385 5.72394C5.4738 5.97399 5.33332 6.31313 5.33332 6.66675V12.0001C5.33332 12.3537 5.4738 12.6928 5.72385 12.9429C5.9739 13.1929 6.31303 13.3334 6.66666 13.3334Z\" stroke=\"#636363\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </span>\n </div>\n </div>\n \n <div class=\"\">\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#45556C] cqa-mb-1\">Type</div>\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-text-[#0F172B]\">{{ dbConfig.dbType }}</div>\n </div>\n </div>\n </div>\n\n <div class=\"cqa-mb-1.5\" *ngIf=\"cachedQueryResults?.length > 0\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Query Execution</div>\n <div class=\"cqa-flex cqa-flex-col cqa-gap-2 cqa-px-4 cqa-py-2 cqa-bg-white cqa-rounded-[10px]\" style=\"border: 1px solid #E2E8F0;\">\n <cqa-db-query-execution-item\n *ngFor=\"let queryItem of cachedQueryResults; let i = index; trackBy: trackByQueryKey\"\n [queryNumber]=\"i + 1\"\n [queryKey]=\"queryItem.key\"\n [queryResult]=\"queryItem.result\"\n [status]=\"getQueryStatus(queryItem.key)\"\n [variableName]=\"queryItem.key\">\n </cqa-db-query-execution-item>\n </div>\n </div>\n\n <!-- Verification Section -->\n <div *ngIf=\"dbTestResult?.assertionResults && dbTestResult?.assertionResults?.length > 0\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Verification</div> \n <!-- Verification Table -->\n <div class=\"cqa-bg-white cqa-rounded-[10px] cqa-px-4 cqa-py-2 cqa-overflow-hidden\" style=\"border: 1px solid #E2E8F0;\">\n <!-- Segment Control for Filters -->\n <cqa-segment-control\n [segments]=\"filterSegments\"\n [value]=\"verificationFilter\"\n (valueChange)=\"onFilterChange($event)\">\n </cqa-segment-control>\n <cqa-table-template\n [columns]=\"verificationTableColumns\"\n [data]=\"getTableData()\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [isEmptyState]=\"isEmptyTable\"\n [emptyStateConfig]=\"emptyStateConfig\"\n [showSearchBar]=\"false\"\n [showFilterButton]=\"false\"\n [showSettingsButton]=\"false\"\n [showAutoRefreshButton]=\"false\"\n [showOtherButton]=\"false\"\n [showFilterPanel]=\"false\"\n [serverSidePagination]=\"false\"\n (pageChange)=\"onPageChange($event)\">\n </cqa-table-template>\n </div>\n </div>\n\n <!-- Self Heal Analysis -->\n <cqa-self-heal-analysis \n *ngIf=\"selfHealAnalysis\" \n [originalLocator]=\"selfHealAnalysis.originalLocator\"\n [healedLocator]=\"selfHealAnalysis.healedLocator\"\n [confidence]=\"selfHealAnalysis.confidence\"\n [healMethod]=\"selfHealAnalysis.healMethod\"\n [isLoadingAccept]=\"getSelfHealLoadingStatesHandler ? getSelfHealLoadingStatesHandler().isLoadingAccept : false\"\n [isLoadingModifyAccept]=\"getSelfHealLoadingStatesHandler ? getSelfHealLoadingStatesHandler().isLoadingModifyAccept : false\"\n (action)=\"onSelfHealAction($event)\">\n </cqa-self-heal-analysis>\n\n <!-- Timing Breakdown -->\n <div *ngIf=\"timingBreakdown\" class=\"cqa-flex cqa-items-center cqa-justify-end cqa-gap-5 cqa-pt-4 cqa-px-4 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#9CA3AF]\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <div><svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg></div>\n <span>Timing breakdown</span>\n </div>\n <span class=\"cqa-text-dialog-muted cqa-flex cqa-items-center cqa-gap-3\">\n <div>\n App <span class=\"cqa-text-[#374151]\">{{ formatDuration(timingBreakdown.app) }}</span>\n </div>\n <div><svg width=\"1\" height=\"11\" viewBox=\"0 0 1 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M-3.8147e-06 10.32V-7.15256e-07H0.959996V10.32H-3.8147e-06Z\" fill=\"#E5E7EB\"/></svg></div>\n <div>\n Tool <span class=\"cqa-text-[#374151]\">{{ formatDuration(timingBreakdown.tool) }}</span>\n </div>\n </span>\n </div>\n\n <!-- View More Failed Step Button - shown when expanded and failure details exist -->\n <div *ngIf=\"showViewMoreButton\" class=\"cqa-mt-2 cqa-px-4\">\n <cqa-view-more-failed-step-button\n [timingBreakdown]=\"timingBreakdown\"\n [subSteps]=\"getSubStepsForFailedStep()\"\n [failureDetails]=\"failureDetails\"\n [isExpanded]=\"showFailedStepDetails\"\n (viewMoreClick)=\"onViewMoreFailedStepClick($event)\">\n </cqa-view-more-failed-step-button>\n </div>\n\n <!-- Updated Failed Step Component - shown when button is clicked -->\n <div *ngIf=\"showViewMoreButton && showFailedStepDetails && failureDetails\" class=\"cqa-mt-2 cqa-px-4\">\n <cqa-updated-failed-step\n [testStepResultId]=\"testStepResultId\"\n [timingBreakdown]=\"timingBreakdown\"\n [expanded]=\"true\"\n [subSteps]=\"getSubStepsForFailedStep()\"\n [failureDetails]=\"failureDetails\"\n [reasoning]=\"reasoning\"\n [confidence]=\"confidence\"\n [isUploadingBaseline]=\"isUploadingBaseline\"\n [isMakingCurrentBaseline]=\"isMakingCurrentBaseline\"\n [isLive]=\"isLive\"\n (makeCurrentBaseline)=\"onMakeCurrentBaseline($event)\"\n (uploadBaseline)=\"onUploadBaseline($event)\"\n (analyze)=\"onAnalyze()\"\n (viewFullLogs)=\"onViewFullLogs()\">\n </cqa-updated-failed-step>\n </div>\n </div>\n</div>\n\n", styles: [] }]
|
|
11821
|
+
args: [{ selector: 'cqa-db-verification-step', host: { class: 'cqa-ui-root' }, template: "<div>\n <!-- Header -->\n <div\n class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-p-2 cqa-cursor-pointer\"\n (click)=\"toggleHeader()\"\n style=\"border-bottom: 1px solid #F3F4F6\">\n \n <!-- Status Icon -->\n <!-- Success -->\n <div *ngIf=\"getStatus().toLowerCase() === 'success'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M10.9005 4.99999C11.1289 6.12064 10.9662 7.28571 10.4395 8.30089C9.91279 9.31608 9.054 10.12 8.00631 10.5787C6.95862 11.0373 5.78536 11.1229 4.6822 10.8212C3.57904 10.5195 2.61265 9.84869 1.94419 8.92071C1.27573 7.99272 0.945611 6.86361 1.00888 5.72169C1.07215 4.57976 1.52499 3.49404 2.29188 2.64558C3.05876 1.79712 4.09334 1.23721 5.22308 1.05922C6.35282 0.881233 7.50944 1.09592 8.50005 1.66749\" stroke=\"#22C55E\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M4.5 5.5L6 7L11 2\" stroke=\"#22C55E\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Failure -->\n <div *ngIf=\"getStatus().toLowerCase() === 'failure' || getStatus().toLowerCase() === 'failed'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.5 4.5L4.5 7.5\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M4.5 4.5L7.5 7.5\" stroke=\"#DC2626\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Pending -->\n <div *ngIf=\"getStatus().toLowerCase() === 'pending'\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n <!-- Running - Show spinner -->\n <div *ngIf=\"getStatus().toLowerCase() === 'running'\">\n <svg class=\"cqa-animate-spin cqa-text-[#3B82F6]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"6\" cy=\"6\" r=\"5\" stroke=\"currentColor\" stroke-width=\"1.5\" fill=\"none\" opacity=\"0.25\"/>\n <path d=\"M6 1A5 5 0 0 1 11 6\" stroke=\"currentColor\" stroke-width=\"1.5\" fill=\"none\" stroke-linecap=\"round\"/>\n </svg>\n </div>\n\n <div><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\n <rect width=\"20\" height=\"16\" rx=\"4\" fill=\"#F0F0F1\"/>\n <path d=\"M13.5 3.5H6.5C5.95 3.5 5.5 3.95 5.5 4.5V11.5C5.5 12.05 5.95 12.5 6.5 12.5H13.5C14.05 12.5 14.5 12.05 14.5 11.5V4.5C14.5 3.95 14.05 3.5 13.5 3.5ZM13.5 4.5V6H6.5V4.5H13.5ZM13.5 7V9H6.5V7H13.5ZM6.5 11.5V10H13.5V11.5H6.5Z\" fill=\"#212122\"/>\n </svg></div>\n\n <!-- Step Number and Title -->\n <div class=\"cqa-font-bold cqa-flex-1 cqa-text-[#334155] cqa-text-[11px] cqa-leading-[13px]\">\n {{ stepNumber }}. <span [innerHTML]=\"title\"></span> \n \n <span class=\"cqa-ml-1 cqa-px-1.5 cqa-py-0.5 cqa-rounded-full cqa-font-medium cqa-text-[#212122] cqa-bg-[#F0F0F1] cqa-text-[10px] cqa-leading-[15px] cqa-min-w-max\">\n Database\n </span>\n\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#9CA3AF]\">\n {{ formatDuration(duration) }}\n </span>\n <svg *ngIf=\"!isLive\" [class.cqa-rotate-180]=\"isExpanded\" class=\"cqa-transition-transform\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M3.5 5L7 8.5L10.5 5\" stroke=\"#9CA3AF\" stroke-width=\"0.833333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </div>\n </div>\n\n <!-- Expanded Content -->\n <div *ngIf=\"isExpanded\" class=\"cqa-p-2 !cqa-pl-9 !cqa-pr-6 cqa-bg-white\">\n <!-- Summary Bar -->\n <div class=\"cqa-mb-1.5 cqa-p-3 cqa-bg-[#FCFCFC] cqa-rounded-[6px] cqa-flex cqa-flex-col cqa-gap-2\" style=\"border: 1px solid #E5E7EB;\" *ngIf=\"getStatus() || duration || cachedQueryResults?.length > 0 || dbTestResult?.assertionResults?.length > 0 || getTotalRowsReturned() > 0 || getFailureMessage()\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-4\">\n <!-- Status Badge -->\n <cqa-badge\n *ngIf=\"getStatus()?.toLowerCase() === 'failure' || getStatus()?.toLowerCase() === 'failed'\"\n label=\"FAIL\"\n backgroundColor=\"#DC2626\"\n textColor=\"#FFFFFF\"\n size=\"small\">\n </cqa-badge>\n <cqa-badge\n *ngIf=\"getStatus()?.toLowerCase() === 'success'\"\n label=\"PASS\"\n backgroundColor=\"#22C55E\"\n textColor=\"#FFFFFF\"\n size=\"small\">\n </cqa-badge>\n\n <div class=\"cqa-h-[19px] cqa-w-[1px] cqa-bg-[#E5E7EB]\"></div>\n \n <!-- Summary Stats -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-4 cqa-text-[11px] cqa-leading-[16px] cqa-text-[#6B7280]\">\n <span *ngIf=\"duration\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Total Time: <span class=\"cqa-text-[#4B5563]\">{{ formatDuration(duration) }}</span></span>\n <span *ngIf=\"cachedQueryResults?.length > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Queries: <span class=\"cqa-text-[#4B5563]\">{{ cachedQueryResults?.length || 0 }}</span></span>\n <span *ngIf=\"dbTestResult?.assertionResults?.length > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Assertions: <span class=\"cqa-text-[#4B5563]\">{{ dbTestResult?.assertionResults?.length || 0 }}</span></span>\n <span *ngIf=\"getTotalRowsReturned() > 0\" class=\"cqa-font-medium cqa-text-[10px] cqa-text-[#111827]\">Rows Returned: <span class=\"cqa-text-[#4B5563]\">{{ getTotalRowsReturned() }}</span></span>\n </div>\n </div>\n\n <!-- Failure Banner -->\n <div \n *ngIf=\"getFailureMessage()\"\n class=\"cqa-flex cqa-px-2 cqa-py-1 cqa-bg-[#FEF2F2] cqa-rounded-[4px]\" style=\"border: 1px solid #FEE2E2;\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#B91C1C]\">\n {{ getFailureMessage() }}\n </span>\n </div>\n </div>\n\n <!-- Database Environment Section -->\n <div *ngIf=\"dbConfig\" class=\"cqa-mb-1.5\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Database environment</div>\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-px-4 cqa-py-2 cqa-relative cqa-flex cqa-flex-wrap cqa-gap-3\">\n <!-- Environment -->\n <div class=\"\">\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#45556C] cqa-mb-1\">Environment</div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-4\">\n <span class=\"cqa-text-[10px] cqa-leading-[15px] cqa-text-[#0F172B]\">{{ dbConfig.name }}</span>\n <span (click)=\"copyEnvironment()\" class=\"cqa-cursor-pointer\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.33332 10.6667H3.99999C3.64637 10.6667 3.30723 10.5263 3.05718 10.2762C2.80713 10.0262 2.66666 9.68704 2.66666 9.33341V4.00008C2.66666 3.64646 2.80713 3.30732 3.05718 3.05727C3.30723 2.80722 3.64637 2.66675 3.99999 2.66675H9.33332C9.68695 2.66675 10.0261 2.80722 10.2761 3.05727C10.5262 3.30732 10.6667 3.64646 10.6667 4.00008V5.33341M6.66666 13.3334H12C12.3536 13.3334 12.6928 13.1929 12.9428 12.9429C13.1928 12.6928 13.3333 12.3537 13.3333 12.0001V6.66675C13.3333 6.31313 13.1928 5.97399 12.9428 5.72394C12.6928 5.47389 12.3536 5.33341 12 5.33341H6.66666C6.31303 5.33341 5.9739 5.47389 5.72385 5.72394C5.4738 5.97399 5.33332 6.31313 5.33332 6.66675V12.0001C5.33332 12.3537 5.4738 12.6928 5.72385 12.9429C5.9739 13.1929 6.31303 13.3334 6.66666 13.3334Z\" stroke=\"#636363\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </span>\n </div>\n </div>\n \n <div class=\"\">\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#45556C] cqa-mb-1\">Type</div>\n <div class=\"cqa-text-[10px] cqa-leading-[15px] cqa-text-[#0F172B]\">{{ dbConfig.dbType }}</div>\n </div>\n </div>\n </div>\n\n <div class=\"cqa-mb-1.5\" *ngIf=\"cachedQueryResults?.length > 0\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Query Execution</div>\n <div class=\"cqa-flex cqa-flex-col cqa-gap-2 cqa-px-4 cqa-py-2 cqa-bg-white cqa-rounded-[10px]\" style=\"border: 1px solid #E2E8F0;\">\n <cqa-db-query-execution-item\n *ngFor=\"let queryItem of cachedQueryResults; let i = index; trackBy: trackByQueryKey\"\n [queryNumber]=\"i + 1\"\n [queryKey]=\"queryItem.key\"\n [queryResult]=\"queryItem.result\"\n [status]=\"getQueryStatus(queryItem.key)\"\n [variableName]=\"queryItem.key\">\n </cqa-db-query-execution-item>\n </div>\n </div>\n\n <!-- Verification Section -->\n <div *ngIf=\"dbTestResult?.assertionResults && dbTestResult?.assertionResults?.length > 0\">\n <div class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B] cqa-mb-2\">Verification</div> \n <!-- Verification Table -->\n <div class=\"cqa-bg-white cqa-rounded-[10px] cqa-px-4 cqa-py-2 cqa-overflow-hidden\" style=\"border: 1px solid #E2E8F0;\">\n <!-- Segment Control for Filters -->\n <cqa-segment-control\n [segments]=\"filterSegments\"\n [value]=\"verificationFilter\"\n (valueChange)=\"onFilterChange($event)\">\n </cqa-segment-control>\n <cqa-table-template\n [columns]=\"verificationTableColumns\"\n [data]=\"getTableData()\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [isEmptyState]=\"isEmptyTable\"\n [emptyStateConfig]=\"emptyStateConfig\"\n [showSearchBar]=\"false\"\n [showFilterButton]=\"false\"\n [showSettingsButton]=\"false\"\n [showAutoRefreshButton]=\"false\"\n [showOtherButton]=\"false\"\n [showFilterPanel]=\"false\"\n [serverSidePagination]=\"false\"\n (pageChange)=\"onPageChange($event)\">\n </cqa-table-template>\n </div>\n </div>\n\n <!-- Self Heal Analysis -->\n <cqa-self-heal-analysis \n *ngIf=\"selfHealAnalysis\" \n [originalLocator]=\"selfHealAnalysis.originalLocator\"\n [healedLocator]=\"selfHealAnalysis.healedLocator\"\n [confidence]=\"selfHealAnalysis.confidence\"\n [healMethod]=\"selfHealAnalysis.healMethod\"\n [isLoadingAccept]=\"getSelfHealLoadingStatesHandler ? getSelfHealLoadingStatesHandler().isLoadingAccept : false\"\n [isLoadingModifyAccept]=\"getSelfHealLoadingStatesHandler ? getSelfHealLoadingStatesHandler().isLoadingModifyAccept : false\"\n (action)=\"onSelfHealAction($event)\">\n </cqa-self-heal-analysis>\n\n <!-- Timing Breakdown -->\n <div *ngIf=\"timingBreakdown\" class=\"cqa-flex cqa-items-center cqa-justify-end cqa-gap-5 cqa-pt-4 cqa-px-4 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-[#9CA3AF]\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <div><svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#9CA3AF\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg></div>\n <span>Timing breakdown</span>\n </div>\n <span class=\"cqa-text-dialog-muted cqa-flex cqa-items-center cqa-gap-3\">\n <div>\n App <span class=\"cqa-text-[#374151]\">{{ formatDuration(timingBreakdown.app) }}</span>\n </div>\n <div><svg width=\"1\" height=\"11\" viewBox=\"0 0 1 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M-3.8147e-06 10.32V-7.15256e-07H0.959996V10.32H-3.8147e-06Z\" fill=\"#E5E7EB\"/></svg></div>\n <div>\n Tool <span class=\"cqa-text-[#374151]\">{{ formatDuration(timingBreakdown.tool) }}</span>\n </div>\n </span>\n </div>\n\n <!-- View More Failed Step Button - shown when expanded and failure details exist -->\n <div *ngIf=\"showViewMoreButton\" class=\"cqa-mt-2 cqa-px-4\">\n <cqa-view-more-failed-step-button\n [timingBreakdown]=\"timingBreakdown\"\n [subSteps]=\"getSubStepsForFailedStep()\"\n [failureDetails]=\"failureDetails\"\n [isExpanded]=\"showFailedStepDetails\"\n (viewMoreClick)=\"onViewMoreFailedStepClick($event)\">\n </cqa-view-more-failed-step-button>\n </div>\n\n <!-- Updated Failed Step Component - shown when button is clicked -->\n <div *ngIf=\"showViewMoreButton && showFailedStepDetails && failureDetails\" class=\"cqa-mt-2 cqa-px-4\">\n <cqa-updated-failed-step\n [testStepResultId]=\"testStepResultId\"\n [timingBreakdown]=\"timingBreakdown\"\n [expanded]=\"true\"\n [subSteps]=\"getSubStepsForFailedStep()\"\n [failureDetails]=\"failureDetails\"\n [reasoning]=\"reasoning\"\n [confidence]=\"confidence\"\n [isUploadingBaseline]=\"isUploadingBaseline\"\n [isMakingCurrentBaseline]=\"isMakingCurrentBaseline\"\n [isLive]=\"isLive\"\n (makeCurrentBaseline)=\"onMakeCurrentBaseline($event)\"\n (uploadBaseline)=\"onUploadBaseline($event)\"\n (analyze)=\"onAnalyze()\"\n (viewFullLogs)=\"onViewFullLogs()\">\n </cqa-updated-failed-step>\n </div>\n </div>\n</div>\n\n", styles: [] }]
|
|
11820
11822
|
}], propDecorators: { id: [{
|
|
11821
11823
|
type: Input
|
|
11822
11824
|
}], testStepResultId: [{
|