From 95c87f4763efd4ea576532ff60b836e64b22cd0e Mon Sep 17 00:00:00 2001 From: Dallin Romney Date: Mon, 20 Jan 2025 15:17:58 -0800 Subject: [PATCH 1/3] fix tutorial card logic --- gui/src/pages/gui/Chat.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/gui/src/pages/gui/Chat.tsx b/gui/src/pages/gui/Chat.tsx index 3f36adcef8..2d688a8b37 100644 --- a/gui/src/pages/gui/Chat.tsx +++ b/gui/src/pages/gui/Chat.tsx @@ -550,7 +550,7 @@ export function Chat() { )} - {showTutorialCard !== false && !onboardingCard.open && ( + {showTutorialCard !== false && !onboardingCard.show && (
From cef9116bd04352906bdd858866ce019aacf372f3 Mon Sep 17 00:00:00 2001 From: Dallin Romney Date: Mon, 20 Jan 2025 19:19:09 -0800 Subject: [PATCH 2/3] tutorial card test --- .../vscode/e2e/selectors/GUI.selectors.ts | 25 +++++++++++ extensions/vscode/e2e/tests/GUI.test.ts | 42 ++++++++++++++++++- .../components/BestExperienceConfigForm.tsx | 2 + .../components/OnboardingCardTabs.tsx | 1 + gui/src/components/mainInput/TutorialCard.tsx | 7 +--- 5 files changed, 71 insertions(+), 6 deletions(-) diff --git a/extensions/vscode/e2e/selectors/GUI.selectors.ts b/extensions/vscode/e2e/selectors/GUI.selectors.ts index 71a38c9f28..3191575007 100644 --- a/extensions/vscode/e2e/selectors/GUI.selectors.ts +++ b/extensions/vscode/e2e/selectors/GUI.selectors.ts @@ -79,6 +79,31 @@ export class GUISelectors { ); } + public static getOnboardingTabButton(view: WebView, title: string) { + return SelectorUtils.getElementByDataTestId( + view, + `onboarding-tab-${title}`, + ); + } + + public static getBestChatApiKeyInput(view: WebView) { + return SelectorUtils.getElementByDataTestId( + view, + "best-chat-api-key-input", + ); + } + + public static getBestAutocompleteApiKeyInput(view: WebView) { + return SelectorUtils.getElementByDataTestId( + view, + "best-autocomplete-api-key-input", + ); + } + + public static getTutorialCard(view: WebView) { + return SelectorUtils.getElementByDataTestId(view, "tutorial-card"); + } + public static getThreadMessageByText(view: WebView, text: string) { return view.findWebElement( By.xpath(`//*[@class="thread-message"]//*[contains(text(), "${text}")]`), diff --git a/extensions/vscode/e2e/tests/GUI.test.ts b/extensions/vscode/e2e/tests/GUI.test.ts index 316db2d0e3..c6ee4d30c0 100644 --- a/extensions/vscode/e2e/tests/GUI.test.ts +++ b/extensions/vscode/e2e/tests/GUI.test.ts @@ -1,5 +1,6 @@ import { expect } from "chai"; import { + By, EditorView, Key, VSBrowser, @@ -45,7 +46,7 @@ describe("GUI Test", () => { await new EditorView().closeAllEditors(); }); - describe("Onboarding", () => { + describe.only("Onboarding", () => { it("should display correct panel description", async () => { const description = await GUISelectors.getDescription(view); @@ -53,6 +54,45 @@ describe("GUI Test", () => { "Quickly get up and running using our API keys.", ); }).timeout(DEFAULT_TIMEOUT.XL); + + it("should display tutorial card after accepting onboarding quick start", async () => { + // Get paragraph with text Best + const bestTab = await GUISelectors.getOnboardingTabButton(view, "Best"); + await bestTab.click(); + + const anthropicInput = await TestUtils.waitForSuccess( + async () => await GUISelectors.getBestChatApiKeyInput(view), + ); + anthropicInput.sendKeys("invalid_api_key"); + + const mistralInput = + await GUISelectors.getBestAutocompleteApiKeyInput(view); + mistralInput.sendKeys("invalid_api_key"); + + // Get button with text "Connect" and click it + const connectButton = await view.findWebElement( + By.xpath("//button[text()='Connect']"), + ); + await connectButton.click(); + + await TestUtils.waitForSuccess( + async () => await GUISelectors.getTutorialCard(view), + ); + + // TODO validate that claude has been added to list + + // Skip testing Quick Start because github auth opens external app and breaks test + // const quickStartButton = await view.findWebElement( + // By.xpath("//*[contains(text(), 'Get started using our API keys')]") + // ); + // await quickStartButton.click(); + // await view.switchBack(); + // const allowButton = await TestUtils.waitForSuccess( + // async () => await driver.findElement(By.xpath(`//a[contains(text(), "Allow")]`)) + // ); + // await allowButton.click(); + // ({ view, driver } = await GUIActions.switchToReactIframe()); + }).timeout(DEFAULT_TIMEOUT.XL); }); describe("Chat", () => { diff --git a/gui/src/components/OnboardingCard/components/BestExperienceConfigForm.tsx b/gui/src/components/OnboardingCard/components/BestExperienceConfigForm.tsx index 575e1e8a33..86e7cd693a 100644 --- a/gui/src/components/OnboardingCard/components/BestExperienceConfigForm.tsx +++ b/gui/src/components/OnboardingCard/components/BestExperienceConfigForm.tsx @@ -99,6 +99,7 @@ function BestExperienceConfigForm({ placeholder="Enter your Anthropic API Key" value={chatApiKey} onChange={(e) => setChatApiKey(e.target.value)} + data-testid="best-chat-api-key-input" /> setAutocompleteApiKey(e.target.value)} + data-testid="best-autocomplete-api-key-input" /> onTabClick(tabType as TabTitle)} + data-testid={`onboarding-tab-${tabType}`} >

{titles.default} diff --git a/gui/src/components/mainInput/TutorialCard.tsx b/gui/src/components/mainInput/TutorialCard.tsx index 4e07ead6d7..c94f63598c 100644 --- a/gui/src/components/mainInput/TutorialCard.tsx +++ b/gui/src/components/mainInput/TutorialCard.tsx @@ -44,7 +44,7 @@ export function TutorialCard({ onClose }: TutorialCardProps) { const ideMessenger = useContext(IdeMessengerContext); return ( - + @@ -57,10 +57,7 @@ export function TutorialCard({ onClose }: TutorialCardProps) { - ideMessenger.post( - "vscode/openMoveRightMarkdown", - undefined, - ) + ideMessenger.post("vscode/openMoveRightMarkdown", undefined) } > Move Chat panel to the right From 9109fb2cfc34fdc1613c9372c32b9f3d8ff7dcb8 Mon Sep 17 00:00:00 2001 From: Dallin Romney Date: Mon, 20 Jan 2025 19:42:52 -0800 Subject: [PATCH 3/3] remove describe.only --- extensions/vscode/e2e/tests/GUI.test.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/extensions/vscode/e2e/tests/GUI.test.ts b/extensions/vscode/e2e/tests/GUI.test.ts index c6ee4d30c0..4369a917fc 100644 --- a/extensions/vscode/e2e/tests/GUI.test.ts +++ b/extensions/vscode/e2e/tests/GUI.test.ts @@ -46,7 +46,7 @@ describe("GUI Test", () => { await new EditorView().closeAllEditors(); }); - describe.only("Onboarding", () => { + describe("Onboarding", () => { it("should display correct panel description", async () => { const description = await GUISelectors.getDescription(view);