Skip to content

Commit 70d9a7d

Browse files
Eric-B-WuEric-B-Wu
authored
fix(designer): Custom Connectors to be fetched by operation group instead of filtering from every custom operation (#8673)
* Fix obo * small fix * custom apis should not need to wait for all custom apis to finish before loading operations * simplify logic * fix * add e2e test
1 parent 8cb3426 commit 70d9a7d

File tree

5 files changed

+157
-26
lines changed

5 files changed

+157
-26
lines changed

‎e2e/designer/real-api/browse/browseCustomConnectorOperations.spec.ts‎

Lines changed: 129 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
import { test, expect } from '../../fixtures/real-api';
2+
import workflow from './workflow.json' assert { type: 'json' };
3+
4+
test.describe(
5+
'Browse Custom Connector Operations',
6+
{
7+
tag: '@real',
8+
},
9+
() => {
10+
test.beforeEach(async ({ realDataApi }) => {
11+
await realDataApi.deployWorkflow(workflow);
12+
});
13+
14+
test('Should load operations by connector when selecting a connector in browse view', async ({ page, realDataApi }) => {
15+
// Navigate to the workflow
16+
await page.goto('/');
17+
await realDataApi.goToWorkflow();
18+
19+
// Open the add operation panel
20+
await page.getByTestId('msla-plus-button-when_a_http_request_is_received-undefined').click();
21+
await page.getByTestId('msla-add-button-when_a_http_request_is_received-undefined').click({ force: true });
22+
23+
// Click on Browse tab to enter browse view
24+
await page.getByRole('tab', { name: 'Browse' }).click();
25+
26+
// Wait for connectors to load
27+
await page.waitForTimeout(2000);
28+
29+
// Select a connector from the browse view (e.g., Office 365 Outlook or any available connector)
30+
// Using a common connector that should be available in most test environments
31+
const connectorCard = page.locator('[data-automation-id*="office365"]').first();
32+
33+
// Verify the connector card exists
34+
const connectorExists = await connectorCard.count();
35+
if (connectorExists === 0) {
36+
// If Office 365 is not available, try to find any connector card
37+
const anyConnectorCard = page.locator('.msla-recommendation-panel-card').first();
38+
await anyConnectorCard.click();
39+
} else {
40+
await connectorCard.click();
41+
}
42+
43+
// Wait for operations to load for the selected connector
44+
await page.waitForTimeout(1500);
45+
46+
// Verify that the operation group details page is displayed
47+
const operationGroupDetailPage = page.locator('.msla-op-group-detail-page');
48+
await expect(operationGroupDetailPage).toBeVisible();
49+
50+
// Verify that operations are displayed
51+
// The operations should be loaded via getOperationsByConnector instead of filtering from all operations
52+
const operationCards = page.locator('.msla-browse-card');
53+
const operationCount = await operationCards.count();
54+
55+
// Verify at least one operation is loaded
56+
expect(operationCount).toBeGreaterThan(0);
57+
58+
// Verify that an operation can be clicked (confirming operations are properly loaded)
59+
const firstOperation = operationCards.first();
60+
await expect(firstOperation).toBeVisible();
61+
62+
// Optional: Click on an operation to verify it opens the operation panel
63+
await firstOperation.click();
64+
65+
// Wait for the operation panel to open
66+
await page.waitForTimeout(1000);
67+
68+
// Verify that the operation details panel is displayed
69+
const operationPanel = page.locator('.msla-panel-container');
70+
await expect(operationPanel).toBeVisible();
71+
});
72+
73+
test('Should load custom connector operations when available', async ({ page, realDataApi }) => {
74+
// Navigate to the workflow
75+
await page.goto('/');
76+
await realDataApi.goToWorkflow();
77+
78+
// Open the add operation panel
79+
await page.getByTestId('msla-plus-button-when_a_http_request_is_received-undefined').click();
80+
await page.getByTestId('msla-add-button-when_a_http_request_is_received-undefined').click({ force: true });
81+
82+
// Click on Browse tab
83+
await page.getByRole('tab', { name: 'Browse' }).click();
84+
85+
// Wait for connectors to load
86+
await page.waitForTimeout(2000);
87+
88+
// Try to filter for custom connectors if the filter is available
89+
const customFilterButton = page.getByTestId('custom');
90+
const customFilterExists = await customFilterButton.count();
91+
92+
if (customFilterExists > 0) {
93+
await customFilterButton.click();
94+
await page.waitForTimeout(1000);
95+
96+
// Check if any custom connectors are available
97+
const customConnectorCard = page.locator('.msla-recommendation-panel-card').first();
98+
const customConnectorCount = await customConnectorCard.count();
99+
100+
if (customConnectorCount > 0) {
101+
// Click on the first custom connector
102+
await customConnectorCard.click();
103+
104+
// Wait for operations to load
105+
await page.waitForTimeout(1500);
106+
107+
// Verify that operations are displayed
108+
const operationGroupDetailPage = page.locator('.msla-op-group-detail-page');
109+
await expect(operationGroupDetailPage).toBeVisible();
110+
111+
// Verify that operations are loaded (should use getOperationsByConnector for custom connectors)
112+
const operationCards = page.locator('.msla-browse-card');
113+
const operationCount = await operationCards.count();
114+
115+
// Custom connectors should have at least one operation
116+
// This validates that getOperationsByConnector is working for custom connectors
117+
// without waiting for all custom operations to be loaded first
118+
expect(operationCount).toBeGreaterThanOrEqual(0);
119+
120+
console.log(`Custom connector operations loaded: ${operationCount}`);
121+
} else {
122+
console.log('No custom connectors available in test environment - skipping custom connector test');
123+
}
124+
} else {
125+
console.log('Custom connector filter not available - skipping custom connector test');
126+
}
127+
});
128+
}
129+
);

‎e2e/designer/real-api/browse/workflow.json‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"definition": {
3+
"$schema": "https://schema.management.azure.com/providers/Microsoft.Logic/schemas/2016-06-01/workflowdefinition.json#",
4+
"actions": {},
5+
"contentVersion": "1.0.0.0",
6+
"outputs": {},
7+
"triggers": {
8+
"When_a_HTTP_request_is_received": {
9+
"type": "Request",
10+
"kind": "Http",
11+
"inputs": {
12+
"schema": {}
13+
}
14+
}
15+
}
16+
},
17+
"kind": "Stateful"
18+
}

‎libs/designer-v2/src/lib/core/queries/browse.ts‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -418,24 +418,16 @@ const filterOperationsByConnector = (
418418
export const useOperationsByConnector = (connectorId: string, actionType?: 'triggers' | 'actions') => {
419419
// Use the existing cached built-in operations
420420
const { data: builtInOperations } = useBuiltInOperationsQuery();
421-
// Use the existing cached custom operations
422-
const { data: customOperations } = useCustomOperationsLazyQuery();
423421

424422
return useQuery(
425423
['operationsByConnector', connectorId, actionType],
426424
async () => {
427-
// For managed/Azure connectors - use specific API call
428-
if (isManagedConnector(connectorId)) {
425+
// For managed/Azure and custom connectors - use specific API call
426+
if (isManagedConnector(connectorId) || isCustomConnectorId(connectorId)) {
429427
const data = await SearchService().getOperationsByConnector?.(connectorId, actionType);
430428
return data || [];
431429
}
432430

433-
// For custom connectors - filter from cached custom operations
434-
if (isCustomConnectorId(connectorId)) {
435-
const allCustomOperations = customOperations?.pages.flatMap((page) => page.data) ?? [];
436-
return filterOperationsByConnector(allCustomOperations, connectorId, actionType);
437-
}
438-
439431
// For all built-in operations (both client and server) - filter from cached data
440432
const allBuiltInOperations = (builtInOperations?.data as DiscoveryOpArray) ?? [];
441433
return filterOperationsByConnector(allBuiltInOperations, connectorId, actionType);

‎libs/designer/src/lib/core/queries/browse.ts‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -438,24 +438,16 @@ const filterOperationsByConnector = (
438438
export const useOperationsByConnector = (connectorId: string, actionType?: 'triggers' | 'actions') => {
439439
// Use the existing cached built-in operations
440440
const { data: builtInOperations } = useBuiltInOperationsQuery();
441-
// Use the existing cached custom operations
442-
const { data: customOperations } = useCustomOperationsLazyQuery();
443441

444442
return useQuery(
445443
['operationsByConnector', connectorId, actionType],
446444
async () => {
447-
// For managed/Azure connectors - use specific API call
448-
if (isManagedConnector(connectorId)) {
445+
// For managed/Azure and custom connectors - use specific API call
446+
if (isManagedConnector(connectorId) || isCustomConnectorId(connectorId)) {
449447
const data = await SearchService().getOperationsByConnector?.(connectorId, actionType);
450448
return data || [];
451449
}
452450

453-
// For custom connectors - filter from cached custom operations
454-
if (isCustomConnectorId(connectorId)) {
455-
const allCustomOperations = customOperations?.pages.flatMap((page) => page.data) ?? [];
456-
return filterOperationsByConnector(allCustomOperations, connectorId, actionType);
457-
}
458-
459451
// For all built-in operations (both client and server) - filter from cached data
460452
const allBuiltInOperations = (builtInOperations?.data as DiscoveryOpArray) ?? [];
461453
return filterOperationsByConnector(allBuiltInOperations, connectorId, actionType);

‎libs/logic-apps-shared/src/designer-client-services/lib/base/search.ts‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import type {
88
DiscoveryWorkflowTrigger,
99
BuiltInOperation,
1010
} from '../../../utils/src';
11-
import { ArgumentException, equals, getResourceNameFromId, normalizeConnectorIds } from '../../../utils/src';
11+
import { ArgumentException, equals, isCustomConnectorId, normalizeConnectorIds } from '../../../utils/src';
1212
import { AzureConnectorMock } from '../__test__/__mocks__/azureConnectorResponse';
1313
import { azureOperationsResponse } from '../__test__/__mocks__/azureOperationResponse';
1414
import type { ContinuationTokenResponse } from '../common/azure';
@@ -184,12 +184,9 @@ export abstract class BaseSearchService implements ISearchService {
184184

185185
async getOperationsByConnector(connectorId: string, actionType?: 'triggers' | 'actions'): Promise<DiscoveryOpArray> {
186186
const {
187-
apiHubServiceDetails: { location, subscriptionId, apiVersion },
187+
apiHubServiceDetails: { apiVersion },
188188
} = this.options;
189189

190-
const connectorName = getResourceNameFromId(connectorId);
191-
const uri = `/subscriptions/${subscriptionId}/providers/Microsoft.Web/locations/${location}/managedApis/${connectorName}/apiOperations`;
192-
193190
let filter: string | undefined;
194191

195192
if (actionType === 'triggers') {
@@ -203,7 +200,10 @@ export abstract class BaseSearchService implements ISearchService {
203200
...(filter ? { $filter: filter } : {}),
204201
};
205202

206-
const { value } = await this.getAzureResourceByPage(uri, queryParameters);
203+
const uri = `${connectorId}/apiOperations`;
204+
205+
const { value } = await this.getAzureResourceByPage(uri, queryParameters, 0, 1000);
206+
207207
return this.removeUnsupportedOperations(value);
208208
}
209209

0 commit comments

Comments
 (0)