fix AI assistant chat and e2e test

n8n-io · Nov 18, 2024 · a0544ae · a0544ae
1 parent 68f5b57
commit a0544ae
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/cypress/e2e/45-ai-assistant.cy.ts b/cypress/e2e/45-ai-assistant.cy.ts
@@ -557,6 +557,8 @@ describe('General help', () => {
 		}).as('chatRequest');
 
 		aiAssistant.getters.askAssistantFloatingButton().click();
+		wf.getters.zoomToFitButton().click();
+
 		aiAssistant.actions.sendMessage('What is wrong with this workflow?');
 		cy.wait('@chatRequest');
 

diff --git a/packages/design-system/src/components/AskAssistantChat/AskAssistantChat.vue b/packages/design-system/src/components/AskAssistantChat/AskAssistantChat.vue
@@ -344,6 +344,8 @@ async function onCopyButtonClick(content: string, e: MouseEvent) {
 .container {
 	height: 100%;
 	position: relative;
+	display: grid;
+	grid-template-rows: auto 1fr auto;
 }
 
 p {
@@ -373,10 +375,6 @@ p {
 	background-color: var(--color-background-light);
 	border: var(--border-base);
 	border-top: 0;
-	height: 100%;
-	overflow-x: hidden;
-	overflow-y: auto;
-	padding-bottom: 250px; // make scrollable at the end
 	position: relative;
 
 	pre,
@@ -390,7 +388,13 @@ p {
 }
 
 .messages {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
 	padding: var(--spacing-xs);
+	overflow-y: auto;
 
 	& + & {
 		padding-top: 0;
@@ -533,13 +537,12 @@ code[class^='language-'] {
 }
 
 .inputWrapper {
-	position: absolute;
 	display: flex;
-	bottom: 0;
 	background-color: var(--color-foreground-xlight);
 	border: var(--border-base);
 	width: 100%;
 	padding-top: 1px;
+	overflow: hidden;
 
 	textarea {
 		border: none;