Skip to content

Commit c136f24

Browse files
ikkzikkz
committed
test: update endpoint test send E2E to interact with UI and enhance console error display
1 parent b5aced5 commit c136f24

File tree

2 files changed

+96
-30
lines changed

2 files changed

+96
-30
lines changed

‎apps/console-e2e/src/endpoint-configuration.spec.ts‎

Lines changed: 84 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -49,13 +49,13 @@ test.describe('Endpoint Configuration', () => {
4949
await expect(page.locator('.cm-content').nth(1)).toContainText('This is the footer');
5050
});
5151

52-
test('should send test message with banner/footer', async ({ page, request, context }) => {
52+
test('should send test message with banner/footer via UI', async ({ page, request, context }) => {
5353
const mockServer = new MockTargetServer();
5454
await mockServer.start();
5555

5656
try {
57-
// Create endpoint via API
58-
const endpointName = generateTestName('Test Send');
57+
// Create endpoint via API with banner and footer
58+
const endpointName = generateTestName('Test Send UI');
5959
const baseUrl = process.env.BASE_URL || 'http://localhost:3100';
6060
const authHeader = `Basic ${Buffer.from('admin:admin').toString('base64')}`;
6161

@@ -80,30 +80,85 @@ test.describe('Endpoint Configuration', () => {
8080
headers: { Authorization: authHeader },
8181
});
8282

83-
// Call test send API directly instead of via UI (more reliable for testing core functionality)
84-
const testSendRes = await request.post(`${baseUrl}/console/api/endpoints/${endpoint.id}/test`, {
85-
data: {
86-
markdown: '# Test Content\nHello World'
87-
},
88-
headers: { Authorization: authHeader },
89-
});
90-
91-
// Verify API returned success
92-
expect(testSendRes.status()).toBe(200);
93-
const result = await testSendRes.json();
94-
expect(result.event_id).toBeTruthy();
95-
96-
// Verify mock server received the request with banner/footer
97-
await page.waitForTimeout(1500); // Give webhook time to arrive
98-
const receivedPayloads = mockServer.getReceivedWebhooks();
99-
expect(receivedPayloads.length).toBeGreaterThan(0);
100-
101-
// The payload should contain the concatenated markdown
102-
const lastPayload = receivedPayloads[receivedPayloads.length - 1].body;
103-
const textField = lastPayload.text || lastPayload.content || JSON.stringify(lastPayload);
104-
expect(textField).toContain('[BANNER]');
105-
expect(textField).toContain('Test Content');
106-
expect(textField).toContain('[FOOTER]');
83+
// NOW TEST THE UI - Navigate to endpoint details page
84+
await page.goto(`/console#/endpoints/${endpoint.id}`);
85+
await page.waitForSelector('text=Test Send', { timeout: 10000 });
86+
87+
// Wait for页面加载和 CodeMirror 编辑器初始化
88+
await page.waitForTimeout(1500);
89+
90+
// Find the test markdown editor (3rd CodeMirror editor)
91+
const testEditorCount = await page.locator('.cm-editor').count();
92+
console.log(`Found ${testEditorCount} CodeMirror editors`);
93+
expect(testEditorCount).toBeGreaterThanOrEqual(3);
94+
95+
const testEditor = page.locator('.cm-editor').nth(2);
96+
await testEditor.waitFor({ state: 'visible', timeout: 5000 });
97+
98+
// Clear the default content and type new test markdown
99+
await testEditor.click();
100+
await page.waitForTimeout(300);
101+
102+
// Select all
103+
await page.keyboard.press('Control+A');
104+
await page.keyboard.press('Meta+A');
105+
await page.waitForTimeout(200);
106+
107+
// Type test content
108+
await page.keyboard.type('# UI Test Content');
109+
await page.keyboard.press('Enter');
110+
await page.keyboard.type('Testing from UI!');
111+
await page.waitForTimeout(300);
112+
113+
// Find and click the "Send Test" button
114+
const sendTestButton = page.locator('button:has-text("Send Test")').first();
115+
await sendTestButton.waitFor({ state: 'visible', timeout: 5000 });
116+
117+
console.log('About to click Send Test button');
118+
await sendTestButton.click();
119+
120+
// Wait for either success or error
121+
await page.waitForTimeout(2000);
122+
123+
// Check if delivery results appeared
124+
const deliveryResultsVisible = await page.locator('text=Delivery Results:')
125+
.isVisible({ timeout: 15000 })
126+
.catch(() => false);
127+
128+
if (deliveryResultsVisible) {
129+
console.log('Delivery results appeared!');
130+
await expect(page.locator('text=Delivery Results:')).toBeVisible();
131+
132+
// Verify mock server received the webhook
133+
await page.waitForTimeout(1500);
134+
const receivedPayloads = mockServer.getReceivedWebhooks();
135+
console.log(`Mock server received ${receivedPayloads.length} payloads`);
136+
expect(receivedPayloads.length).toBeGreaterThan(0);
137+
138+
// Verify content has banner, message, and footer
139+
const lastPayload = receivedPayloads[receivedPayloads.length - 1].body;
140+
const textField = lastPayload.text || lastPayload.content || JSON.stringify(lastPayload);
141+
console.log('Received payload text:', textField);
142+
143+
expect(textField).toContain('[BANNER]');
144+
expect(textField).toContain('UI Test Content');
145+
expect(textField).toContain('[FOOTER]');
146+
} else {
147+
// Check if there's an error message
148+
const errorVisible = await page.locator('text=Failed to send').isVisible().catch(() => false);
149+
if (errorVisible) {
150+
const errorText = await page.locator('.text-destructive').allTextContents();
151+
console.error('Test send failed with error:', errorText);
152+
153+
// Take a screenshot for debugging
154+
await page.screenshot({ path: 'test-output/test-send-error.png' });
155+
156+
throw new Error(`Test send failed in UI: ${errorText.join(', ')}`);
157+
} else {
158+
await page.screenshot({ path: 'test-output/no-results.png' });
159+
throw new Error('Neither delivery results nor error message appeared');
160+
}
161+
}
107162
} finally {
108163
await mockServer.stop();
109164
}
@@ -201,8 +256,8 @@ test.describe('Endpoint Configuration', () => {
201256
// Should show delivery results with no targets message
202257
const deliverySection = page.locator('text=Delivery Results:');
203258
if (await deliverySection.isVisible({ timeout: 2000 }).catch(() => false)) {
204-
await expect(page.locator('text=No targets configured')).toBeVisible();
205-
} else {
259+
const noTargetsMsg = page.locator("text=No targets configured").first();
260+
await expect(noTargetsMsg).toBeVisible();
206261
// Results appeared, verify response
207262
console.log('Delivery results appeared - test passed');
208263
}

‎apps/console/src/routes/endpoint-details.tsx‎

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -418,15 +418,21 @@ function TestSendSection({ endpointId }: { endpointId: string }) {
418418

419419
const testSendMutation = useMutation({
420420
mutationFn: async (markdown: string) => {
421+
console.log('Sending test with markdown:', markdown, 'to endpoint:', endpointId);
421422
const res = await testSend({
422423
path: { id: endpointId },
423424
body: { markdown },
424425
});
426+
console.log('Test send response:', res);
425427
return res.data;
426428
},
427429
onSuccess: (data) => {
430+
console.log('Test send successful:', data);
428431
setDeliveryResults(data);
429432
},
433+
onError: (error) => {
434+
console.error('Test send mutation error:', error);
435+
},
430436
});
431437

432438
const handleTestSend = () => {
@@ -481,7 +487,12 @@ function TestSendSection({ endpointId }: { endpointId: string }) {
481487

482488
{testSendMutation.isError && (
483489
<div className="mt-4 p-4 border border-destructive rounded bg-destructive/10">
484-
<p className="text-sm text-destructive">Failed to send test message</p>
490+
<p className="text-sm text-destructive font-semibold">Failed to send test message</p>
491+
{testSendMutation.error && (
492+
<p className="text-xs text-destructive mt-1">
493+
{testSendMutation.error instanceof Error ? testSendMutation.error.message : String(testSendMutation.error)}
494+
</p>
495+
)}
485496
</div>
486497
)}
487498
</CardContent>

0 commit comments

Comments
 (0)