Skip to content

Commit 2246820

Browse files
ranst91ranst91
authored
chore: fix flaky e2e tests (#438)
1 parent fa04b2f commit 2246820

File tree

11 files changed

+67
-93
lines changed

11 files changed

+67
-93
lines changed

‎typescript-sdk/apps/dojo/e2e/tests/adkMiddlewareTests/agenticChatPage.spec.ts‎

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,8 @@ test.describe("Agentic Chat Feature", () => {
4242
await chat.agentGreeting.waitFor({ state: "visible" });
4343

4444
// Store initial background color
45-
const initialBackground = await chat.getBackground();
45+
const backgroundContainer = page.locator('[data-testid="background-container"]')
46+
const initialBackground = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
4647
console.log("Initial background color:", initialBackground);
4748

4849
// 1. Send message to change background to blue
@@ -52,8 +53,8 @@ test.describe("Agentic Chat Feature", () => {
5253
);
5354
await waitForAIResponse(page);
5455

55-
const backgroundBlue = await chat.getBackground();
56-
expect(backgroundBlue).not.toBe(initialBackground);
56+
await expect(backgroundContainer).not.toHaveCSS('background-color', initialBackground, { timeout: 7000 });
57+
const backgroundBlue = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
5758
// Check if background is blue (string color name or contains blue)
5859
expect(backgroundBlue.toLowerCase()).toMatch(/blue|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
5960

@@ -64,15 +65,10 @@ test.describe("Agentic Chat Feature", () => {
6465
);
6566
await waitForAIResponse(page);
6667

67-
const backgroundPink = await chat.getBackground();
68-
expect(backgroundPink).not.toBe(backgroundBlue);
68+
await expect(backgroundContainer).not.toHaveCSS('background-color', backgroundBlue, { timeout: 7000 });
69+
const backgroundPink = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
6970
// Check if background is pink (string color name or contains pink)
7071
expect(backgroundPink.toLowerCase()).toMatch(/pink|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
71-
72-
// 3. Reset to default
73-
await chat.sendMessage("Reset the background color");
74-
await chat.assertUserMessageVisible("Reset the background color");
75-
await waitForAIResponse(page);
7672
});
7773
});
7874

‎typescript-sdk/apps/dojo/e2e/tests/crewAITests/agenticChatPage.spec.ts‎

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ test("[CrewAI] Agentic Chat changes background on message and reset", async ({
4040
await chat.agentGreeting.waitFor({ state: "visible" });
4141

4242
// Store initial background color
43-
const initialBackground = await chat.getBackground();
43+
const backgroundContainer = page.locator('[data-testid="background-container"]')
44+
const initialBackground = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
4445
console.log("Initial background color:", initialBackground);
4546

4647
// 1. Send message to change background to blue
@@ -50,8 +51,8 @@ test("[CrewAI] Agentic Chat changes background on message and reset", async ({
5051
);
5152
await waitForAIResponse(page);
5253

53-
const backgroundBlue = await chat.getBackground();
54-
expect(backgroundBlue).not.toBe(initialBackground);
54+
await expect(backgroundContainer).not.toHaveCSS('background-color', initialBackground, { timeout: 7000 });
55+
const backgroundBlue = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
5556
// Check if background is blue (string color name or contains blue)
5657
expect(backgroundBlue.toLowerCase()).toMatch(/blue|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
5758

@@ -62,15 +63,10 @@ test("[CrewAI] Agentic Chat changes background on message and reset", async ({
6263
);
6364
await waitForAIResponse(page);
6465

65-
const backgroundPink = await chat.getBackground();
66-
expect(backgroundPink).not.toBe(backgroundBlue);
66+
await expect(backgroundContainer).not.toHaveCSS('background-color', backgroundBlue, { timeout: 7000 });
67+
const backgroundPink = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
6768
// Check if background is pink (string color name or contains pink)
6869
expect(backgroundPink.toLowerCase()).toMatch(/pink|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
69-
70-
// 3. Reset to default
71-
await chat.sendMessage("Reset the background color");
72-
await chat.assertUserMessageVisible("Reset the background color");
73-
await waitForAIResponse(page);
7470
});
7571
});
7672

‎typescript-sdk/apps/dojo/e2e/tests/langgraphFastAPITests/agenticChatPage.spec.ts‎

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ test("[LangGraph FastAPI] Agentic Chat changes background on message and reset",
4040
await chat.agentGreeting.waitFor({ state: "visible" });
4141

4242
// Store initial background color
43-
const initialBackground = await chat.getBackground();
43+
const backgroundContainer = page.locator('[data-testid="background-container"]')
44+
const initialBackground = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
4445
console.log("Initial background color:", initialBackground);
4546

4647
// 1. Send message to change background to blue
@@ -50,8 +51,8 @@ test("[LangGraph FastAPI] Agentic Chat changes background on message and reset",
5051
);
5152
await waitForAIResponse(page);
5253

53-
const backgroundBlue = await chat.getBackground();
54-
expect(backgroundBlue).not.toBe(initialBackground);
54+
await expect(backgroundContainer).not.toHaveCSS('background-color', initialBackground, { timeout: 7000 });
55+
const backgroundBlue = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
5556
// Check if background is blue (string color name or contains blue)
5657
expect(backgroundBlue.toLowerCase()).toMatch(/blue|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
5758

@@ -62,15 +63,10 @@ test("[LangGraph FastAPI] Agentic Chat changes background on message and reset",
6263
);
6364
await waitForAIResponse(page);
6465

65-
const backgroundPink = await chat.getBackground();
66-
expect(backgroundPink).not.toBe(backgroundBlue);
66+
await expect(backgroundContainer).not.toHaveCSS('background-color', backgroundBlue, { timeout: 7000 });
67+
const backgroundPink = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
6768
// Check if background is pink (string color name or contains pink)
6869
expect(backgroundPink.toLowerCase()).toMatch(/pink|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
69-
70-
// 3. Reset to default
71-
await chat.sendMessage("Reset the background color");
72-
await chat.assertUserMessageVisible("Reset the background color");
73-
await waitForAIResponse(page);
7470
});
7571
});
7672

‎typescript-sdk/apps/dojo/e2e/tests/langgraphPythonTests/agenticChatPage.spec.ts‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ test("[LangGraph] Agentic Chat changes background on message and reset", async (
4040
await chat.agentGreeting.waitFor({ state: "visible" });
4141

4242
// Store initial background color
43-
const initialBackground = await chat.getBackground();
43+
const backgroundContainer = page.locator('[data-testid="background-container"]')
44+
const initialBackground = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
4445
console.log("Initial background color:", initialBackground);
4546

4647
// 1. Send message to change background to blue
@@ -50,8 +51,8 @@ test("[LangGraph] Agentic Chat changes background on message and reset", async (
5051
);
5152
await waitForAIResponse(page);
5253

53-
const backgroundBlue = await chat.getBackground();
54-
expect(backgroundBlue).not.toBe(initialBackground);
54+
await expect(backgroundContainer).not.toHaveCSS('background-color', initialBackground, { timeout: 7000 });
55+
const backgroundBlue = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
5556
// Check if background is blue (string color name or contains blue)
5657
expect(backgroundBlue.toLowerCase()).toMatch(/blue|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
5758

@@ -62,8 +63,8 @@ test("[LangGraph] Agentic Chat changes background on message and reset", async (
6263
);
6364
await waitForAIResponse(page);
6465

65-
const backgroundPink = await chat.getBackground();
66-
expect(backgroundPink).not.toBe(backgroundBlue);
66+
await expect(backgroundContainer).not.toHaveCSS('background-color', backgroundBlue, { timeout: 7000 });
67+
const backgroundPink = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
6768
// Check if background is pink (string color name or contains pink)
6869
expect(backgroundPink.toLowerCase()).toMatch(/pink|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
6970
});

‎typescript-sdk/apps/dojo/e2e/tests/langgraphTypescriptTests/agenticChatPage.spec.ts‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ test("[LangGraph] Agentic Chat changes background on message and reset", async (
4040
await chat.agentGreeting.waitFor({ state: "visible" });
4141

4242
// Store initial background color
43-
const initialBackground = await chat.getBackground();
43+
const backgroundContainer = page.locator('[data-testid="background-container"]')
44+
const initialBackground = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
4445
console.log("Initial background color:", initialBackground);
4546

4647
// 1. Send message to change background to blue
@@ -50,8 +51,8 @@ test("[LangGraph] Agentic Chat changes background on message and reset", async (
5051
);
5152
await waitForAIResponse(page);
5253

53-
const backgroundBlue = await chat.getBackground();
54-
expect(backgroundBlue).not.toBe(initialBackground);
54+
await expect(backgroundContainer).not.toHaveCSS('background-color', initialBackground, { timeout: 7000 });
55+
const backgroundBlue = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
5556
// Check if background is blue (string color name or contains blue)
5657
expect(backgroundBlue.toLowerCase()).toMatch(/blue|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
5758

@@ -62,8 +63,8 @@ test("[LangGraph] Agentic Chat changes background on message and reset", async (
6263
);
6364
await waitForAIResponse(page);
6465

65-
const backgroundPink = await chat.getBackground();
66-
expect(backgroundPink).not.toBe(backgroundBlue);
66+
await expect(backgroundContainer).not.toHaveCSS('background-color', backgroundBlue, { timeout: 7000 });
67+
const backgroundPink = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
6768
// Check if background is pink (string color name or contains pink)
6869
expect(backgroundPink.toLowerCase()).toMatch(/pink|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
6970
});

‎typescript-sdk/apps/dojo/e2e/tests/llamaIndexTests/agenticChatPage.spec.ts‎

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ test("[LlamaIndex] Agentic Chat changes background on message and reset", async
4040
await chat.agentGreeting.waitFor({ state: "visible" });
4141

4242
// Store initial background color
43-
const initialBackground = await chat.getBackground();
43+
const backgroundContainer = page.locator('[data-testid="background-container"]')
44+
const initialBackground = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
4445
console.log("Initial background color:", initialBackground);
4546

4647
// 1. Send message to change background to blue
@@ -50,8 +51,8 @@ test("[LlamaIndex] Agentic Chat changes background on message and reset", async
5051
);
5152
await waitForAIResponse(page);
5253

53-
const backgroundBlue = await chat.getBackground();
54-
expect(backgroundBlue).not.toBe(initialBackground);
54+
await expect(backgroundContainer).not.toHaveCSS('background-color', initialBackground, { timeout: 7000 });
55+
const backgroundBlue = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
5556
// Check if background is blue (string color name or contains blue)
5657
expect(backgroundBlue.toLowerCase()).toMatch(/blue|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
5758

@@ -62,15 +63,10 @@ test("[LlamaIndex] Agentic Chat changes background on message and reset", async
6263
);
6364
await waitForAIResponse(page);
6465

65-
const backgroundPink = await chat.getBackground();
66-
expect(backgroundPink).not.toBe(backgroundBlue);
66+
await expect(backgroundContainer).not.toHaveCSS('background-color', backgroundBlue, { timeout: 7000 });
67+
const backgroundPink = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
6768
// Check if background is pink (string color name or contains pink)
6869
expect(backgroundPink.toLowerCase()).toMatch(/pink|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
69-
70-
// 3. Reset to default
71-
await chat.sendMessage("Reset the background color to default");
72-
await chat.assertUserMessageVisible("Reset the background color to default");
73-
await waitForAIResponse(page);
7470
});
7571
});
7672

‎typescript-sdk/apps/dojo/e2e/tests/mastraAgentLocalTests/agenticChatPage.spec.ts‎

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ test("[MastraAgentLocal] Agentic Chat changes background on message and reset",
4040
await chat.agentGreeting.waitFor({ state: "visible" });
4141

4242
// Store initial background color
43-
const initialBackground = await chat.getBackground();
43+
const backgroundContainer = page.locator('[data-testid="background-container"]')
44+
const initialBackground = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
4445
console.log("Initial background color:", initialBackground);
4546

4647
// 1. Send message to change background to blue
@@ -50,8 +51,8 @@ test("[MastraAgentLocal] Agentic Chat changes background on message and reset",
5051
);
5152
await waitForAIResponse(page);
5253

53-
const backgroundBlue = await chat.getBackground();
54-
expect(backgroundBlue).not.toBe(initialBackground);
54+
await expect(backgroundContainer).not.toHaveCSS('background-color', initialBackground, { timeout: 7000 });
55+
const backgroundBlue = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
5556
// Check if background is blue (string color name or contains blue)
5657
expect(backgroundBlue.toLowerCase()).toMatch(/blue|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
5758

@@ -62,15 +63,10 @@ test("[MastraAgentLocal] Agentic Chat changes background on message and reset",
6263
);
6364
await waitForAIResponse(page);
6465

65-
const backgroundPink = await chat.getBackground();
66-
expect(backgroundPink).not.toBe(backgroundBlue);
66+
await expect(backgroundContainer).not.toHaveCSS('background-color', backgroundBlue, { timeout: 7000 });
67+
const backgroundPink = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
6768
// Check if background is pink (string color name or contains pink)
6869
expect(backgroundPink.toLowerCase()).toMatch(/pink|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
69-
70-
// 3. Reset to default
71-
await chat.sendMessage("Reset the background color to default");
72-
await chat.assertUserMessageVisible("Reset the background color to default");
73-
await waitForAIResponse(page);
7470
});
7571
});
7672

‎typescript-sdk/apps/dojo/e2e/tests/pydanticAITests/agenticChatPage.spec.ts‎

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ test("[PydanticAI] Agentic Chat changes background on message and reset", async
4040
await chat.agentGreeting.waitFor({ state: "visible" });
4141

4242
// Store initial background color
43-
const initialBackground = await chat.getBackground();
43+
const backgroundContainer = page.locator('[data-testid="background-container"]')
44+
const initialBackground = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
4445
console.log("Initial background color:", initialBackground);
4546

4647
// 1. Send message to change background to blue
@@ -50,8 +51,8 @@ test("[PydanticAI] Agentic Chat changes background on message and reset", async
5051
);
5152
await waitForAIResponse(page);
5253

53-
const backgroundBlue = await chat.getBackground();
54-
expect(backgroundBlue).not.toBe(initialBackground);
54+
await expect(backgroundContainer).not.toHaveCSS('background-color', initialBackground, { timeout: 7000 });
55+
const backgroundBlue = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
5556
// Check if background is blue (string color name or contains blue)
5657
expect(backgroundBlue.toLowerCase()).toMatch(/blue|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
5758

@@ -62,15 +63,10 @@ test("[PydanticAI] Agentic Chat changes background on message and reset", async
6263
);
6364
await waitForAIResponse(page);
6465

65-
const backgroundPink = await chat.getBackground();
66-
expect(backgroundPink).not.toBe(backgroundBlue);
66+
await expect(backgroundContainer).not.toHaveCSS('background-color', backgroundBlue, { timeout: 7000 });
67+
const backgroundPink = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
6768
// Check if background is pink (string color name or contains pink)
6869
expect(backgroundPink.toLowerCase()).toMatch(/pink|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
69-
70-
// 3. Reset to default
71-
await chat.sendMessage("Reset the background color");
72-
await chat.assertUserMessageVisible("Reset the background color");
73-
await waitForAIResponse(page);
7470
});
7571
});
7672

‎typescript-sdk/apps/dojo/e2e/tests/vercelAISdkTests/agenticChatPage.spec.ts‎

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ test("[Vercel AI SDK] Agentic Chat changes background on message and reset", asy
4040
await chat.agentGreeting.waitFor({ state: "visible" });
4141

4242
// Store initial background color
43-
const initialBackground = await chat.getBackground();
43+
const backgroundContainer = page.locator('[data-testid="background-container"]')
44+
const initialBackground = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
4445
console.log("Initial background color:", initialBackground);
4546

4647
// 1. Send message to change background to blue
@@ -50,8 +51,8 @@ test("[Vercel AI SDK] Agentic Chat changes background on message and reset", asy
5051
);
5152
await waitForAIResponse(page);
5253

53-
const backgroundBlue = await chat.getBackground();
54-
expect(backgroundBlue).not.toBe(initialBackground);
54+
await expect(backgroundContainer).not.toHaveCSS('background-color', initialBackground, { timeout: 7000 });
55+
const backgroundBlue = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
5556
// Check if background is blue (string color name or contains blue)
5657
expect(backgroundBlue.toLowerCase()).toMatch(/blue|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
5758

@@ -62,15 +63,10 @@ test("[Vercel AI SDK] Agentic Chat changes background on message and reset", asy
6263
);
6364
await waitForAIResponse(page);
6465

65-
const backgroundPink = await chat.getBackground();
66-
expect(backgroundPink).not.toBe(backgroundBlue);
66+
await expect(backgroundContainer).not.toHaveCSS('background-color', backgroundBlue, { timeout: 7000 });
67+
const backgroundPink = await backgroundContainer.evaluate(el => getComputedStyle(el).backgroundColor);
6768
// Check if background is pink (string color name or contains pink)
6869
expect(backgroundPink.toLowerCase()).toMatch(/pink|rgb\(.*,.*,.*\)|#[0-9a-f]{6}/);
69-
70-
// 3. Reset to default
71-
await chat.sendMessage("Reset the background color to default");
72-
await chat.assertUserMessageVisible("Reset the background color to default");
73-
await waitForAIResponse(page);
7470
});
7571
});
7672

‎typescript-sdk/apps/dojo/src/app/[integrationId]/feature/agentic_chat/page.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ const Chat = () => {
5050
});
5151

5252
return (
53-
<div className="flex justify-center items-center h-full w-full" style={{ background }}>
53+
<div className="flex justify-center items-center h-full w-full" data-testid="background-container" style={{ background }}>
5454
<div className="h-full w-full md:w-8/10 md:h-8/10 rounded-lg">
5555
<CopilotChat
5656
className="h-full rounded-2xl"

0 commit comments

Comments
 (0)