From e95ba8e938ffa5ea54c935dfaeef8583ecbae316 Mon Sep 17 00:00:00 2001
From: Andrew Risse <andrewrisse@gmail.com>
Date: Wed, 24 Apr 2024 08:46:47 -0600
Subject: [PATCH 1/2] fix: tooltips

---
 .../routes/(dashboard)/chat/[[conversation_id]]/+page.svelte  | 4 +++-
 .../(dashboard)/chat/[[conversation_id]]/chatpage.test.ts     | 2 +-
 src/leapfrogai_ui/tests/helpers.ts                            | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/+page.svelte b/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/+page.svelte
index 1a19855ea..96afea861 100644
--- a/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/+page.svelte
+++ b/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/+page.svelte
@@ -164,7 +164,8 @@
 					icon={ArrowRight}
 					size="field"
 					type="submit"
-					aria-label="send"
+					aria-label="send message"
+					iconDescription="send"
 					disabled={$isLoading || !$input}
 				/>
 			{:else}
@@ -174,6 +175,7 @@
 					type="submit"
 					icon={StopFilledAlt}
 					aria-label="cancel message"
+					iconDescription="cancel"
 				/>
 			{/if}
 		</div>
diff --git a/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/chatpage.test.ts b/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/chatpage.test.ts
index a255f25b5..6b0d0ed12 100644
--- a/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/chatpage.test.ts
+++ b/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/chatpage.test.ts
@@ -51,7 +51,7 @@ describe('The Chat Page', () => {
 
 		test('the send button is disabled when there is no text in the input', () => {
 			render(ChatPage);
-			const submitBtn = screen.getByLabelText('send');
+			const submitBtn = screen.getByLabelText('send message');
 			expect(submitBtn).toHaveProperty('disabled', true);
 		});
 
diff --git a/src/leapfrogai_ui/tests/helpers.ts b/src/leapfrogai_ui/tests/helpers.ts
index e7f7d91a4..eb462581e 100644
--- a/src/leapfrogai_ui/tests/helpers.ts
+++ b/src/leapfrogai_ui/tests/helpers.ts
@@ -28,5 +28,5 @@ export const deleteConversationsByLabel = async (labels: string[]) => {
 export const waitForResponseToComplete = async (page: Page) => {
 	await expect(page.getByLabel('cancel message')).toHaveCount(1, { timeout: 25000 });
 	await expect(page.getByLabel('cancel message')).toHaveCount(0, { timeout: 25000 });
-	await expect(page.getByLabel('send')).toHaveCount(1, { timeout: 25000 });
+	await expect(page.getByLabel('send message')).toHaveCount(1, { timeout: 25000 });
 };

From f65c7bf66eb2b141c51fe460102929137cd76934 Mon Sep 17 00:00:00 2001
From: Andrew Risse <andrewrisse@gmail.com>
Date: Wed, 24 Apr 2024 08:52:47 -0600
Subject: [PATCH 2/2] fix: use test id

---
 .../(dashboard)/chat/[[conversation_id]]/+page.svelte     | 4 ++--
 .../(dashboard)/chat/[[conversation_id]]/chatpage.test.ts | 8 ++++----
 src/leapfrogai_ui/tests/chat.test.ts                      | 2 +-
 src/leapfrogai_ui/tests/helpers.ts                        | 6 +++---
 4 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/+page.svelte b/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/+page.svelte
index 96afea861..f8bf200ea 100644
--- a/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/+page.svelte
+++ b/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/+page.svelte
@@ -160,21 +160,21 @@
 			/>
 			{#if !$isLoading}
 				<Button
+					data-testid="send message"
 					kind="secondary"
 					icon={ArrowRight}
 					size="field"
 					type="submit"
-					aria-label="send message"
 					iconDescription="send"
 					disabled={$isLoading || !$input}
 				/>
 			{:else}
 				<Button
+					data-testid="cancel message"
 					kind="secondary"
 					size="field"
 					type="submit"
 					icon={StopFilledAlt}
-					aria-label="cancel message"
 					iconDescription="cancel"
 				/>
 			{/if}
diff --git a/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/chatpage.test.ts b/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/chatpage.test.ts
index 6b0d0ed12..2e2d43192 100644
--- a/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/chatpage.test.ts
+++ b/src/leapfrogai_ui/src/routes/(dashboard)/chat/[[conversation_id]]/chatpage.test.ts
@@ -51,7 +51,7 @@ describe('The Chat Page', () => {
 
 		test('the send button is disabled when there is no text in the input', () => {
 			render(ChatPage);
-			const submitBtn = screen.getByLabelText('send message');
+			const submitBtn = screen.getByTestId('send message');
 			expect(submitBtn).toHaveProperty('disabled', true);
 		});
 
@@ -99,12 +99,12 @@ describe('The Chat Page', () => {
 			await user.type(input, question);
 			await user.click(submitBtn);
 
-			expect(screen.getByLabelText('cancel message')).toBeInTheDocument();
+			expect(screen.getByTestId('cancel message')).toBeInTheDocument();
 
 			await delay(delayTime);
 
 			await user.type(input, 'new question');
-			expect(screen.queryByLabelText('cancel message')).not.toBeInTheDocument();
+			expect(screen.queryByTestId('cancel message')).not.toBeInTheDocument();
 		});
 
 		it('displays a toast error notification when there is an error with the AI response', async () => {
@@ -245,7 +245,7 @@ describe('The Chat Page', () => {
 				await user.type(input, question);
 				await user.click(submitBtn);
 				await delay(delayTime / 2);
-				const cancelBtn = screen.getByLabelText('cancel message');
+				const cancelBtn = screen.getByTestId('cancel message');
 				await user.click(cancelBtn);
 
 				await screen.findAllByText('Response Canceled');
diff --git a/src/leapfrogai_ui/tests/chat.test.ts b/src/leapfrogai_ui/tests/chat.test.ts
index cb17a7ad3..dfb6c5c6d 100644
--- a/src/leapfrogai_ui/tests/chat.test.ts
+++ b/src/leapfrogai_ui/tests/chat.test.ts
@@ -65,7 +65,7 @@ test('it cancels responses', async ({ page }) => {
 	await sendMessage(page, newMessage);
 	await expect(messages).toHaveCount(2); // ensure new response is being received
 	await page.waitForTimeout(300); // let it partially complete
-	await page.getByLabel('cancel message').click();
+	await page.getByTestId('cancel message').click();
 	await page.waitForTimeout(200); // wait to ensure new question was not sent
 	await expect(messages).toHaveCount(2);
 	const allMessages = await messages.all();
diff --git a/src/leapfrogai_ui/tests/helpers.ts b/src/leapfrogai_ui/tests/helpers.ts
index eb462581e..03fb48746 100644
--- a/src/leapfrogai_ui/tests/helpers.ts
+++ b/src/leapfrogai_ui/tests/helpers.ts
@@ -26,7 +26,7 @@ export const deleteConversationsByLabel = async (labels: string[]) => {
 };
 
 export const waitForResponseToComplete = async (page: Page) => {
-	await expect(page.getByLabel('cancel message')).toHaveCount(1, { timeout: 25000 });
-	await expect(page.getByLabel('cancel message')).toHaveCount(0, { timeout: 25000 });
-	await expect(page.getByLabel('send message')).toHaveCount(1, { timeout: 25000 });
+	await expect(page.getByTestId('cancel message')).toHaveCount(1, { timeout: 25000 });
+	await expect(page.getByTestId('cancel message')).toHaveCount(0, { timeout: 25000 });
+	await expect(page.getByTestId('send message')).toHaveCount(1, { timeout: 25000 });
 };