From f0eb8945e00e5b69e5a97f85f0e2a08824dacf21 Mon Sep 17 00:00:00 2001
From: "SPRINX0\\prochazka" <jan.prochazka@sprinx.com>
Date: Thu, 9 Jan 2025 16:01:34 +0100
Subject: [PATCH] filter model test

---
 e2e-tests/cypress/e2e/browse-data.cy.js        | 14 ++++++++++++++
 packages/web/src/buttons/DropDownButton.svelte |  9 ++++++++-
 packages/web/src/elements/SearchInput.svelte   |  1 +
 packages/web/src/widgets/ConnectionList.svelte |  1 +
 packages/web/src/widgets/SqlObjectList.svelte  |  2 ++
 5 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/e2e-tests/cypress/e2e/browse-data.cy.js b/e2e-tests/cypress/e2e/browse-data.cy.js
index b6ad7ea3e..5486ac39c 100644
--- a/e2e-tests/cypress/e2e/browse-data.cy.js
+++ b/e2e-tests/cypress/e2e/browse-data.cy.js
@@ -8,4 +8,18 @@ describe('Data browser data', () => {
     cy.contains('Let There Be Rock');
     cy.contains('Rows: 347');
   });
+
+  it('Filter model', () => {
+    cy.visit('http://localhost:3000');
+
+    cy.contains('MySql-connection').click();
+    cy.contains('Chinook').click();
+    cy.testid('SqlObjectList_search').clear().type('album');
+    cy.contains('347 rows, InnoDB');
+    cy.testid('SqlObjectList_searchMenuDropDown').click();
+    cy.contains('Column name').click();
+    cy.contains('AlbumId');
+    cy.contains('Column name').click();
+    cy.contains('AlbumId').should('not.exist');
+  });
 });
diff --git a/packages/web/src/buttons/DropDownButton.svelte b/packages/web/src/buttons/DropDownButton.svelte
index beb4a0c81..260d9a7a6 100644
--- a/packages/web/src/buttons/DropDownButton.svelte
+++ b/packages/web/src/buttons/DropDownButton.svelte
@@ -33,6 +33,13 @@
   }
 </script>
 
-<InlineButton {square} {narrow} on:click={handleClick} bind:this={domButton} {disabled}>
+<InlineButton
+  {square}
+  {narrow}
+  on:click={handleClick}
+  bind:this={domButton}
+  {disabled}
+  data-testid={$$props['data-testid']}
+>
   <FontIcon icon={isLoading ? 'icon loading' : icon} />
 </InlineButton>
diff --git a/packages/web/src/elements/SearchInput.svelte b/packages/web/src/elements/SearchInput.svelte
index d3efcd775..c86e4af01 100644
--- a/packages/web/src/elements/SearchInput.svelte
+++ b/packages/web/src/elements/SearchInput.svelte
@@ -43,6 +43,7 @@
   on:keydown={handleKeyDown}
   bind:this={domInput}
   on:focus={e => domInput.select()}
+  data-testid={$$props['data-testid']}
 />
 
 <style>
diff --git a/packages/web/src/widgets/ConnectionList.svelte b/packages/web/src/widgets/ConnectionList.svelte
index 13033c564..85cc5541b 100644
--- a/packages/web/src/widgets/ConnectionList.svelte
+++ b/packages/web/src/widgets/ConnectionList.svelte
@@ -215,6 +215,7 @@
     onFocusFilteredList={() => {
       domListHandler?.focusFirst();
     }}
+    data-testid="ConnectionList_search"
   />
   <CloseSearchButton bind:filter />
   <DropDownButton
diff --git a/packages/web/src/widgets/SqlObjectList.svelte b/packages/web/src/widgets/SqlObjectList.svelte
index 77d926ff0..2c208305a 100644
--- a/packages/web/src/widgets/SqlObjectList.svelte
+++ b/packages/web/src/widgets/SqlObjectList.svelte
@@ -214,6 +214,7 @@
       onFocusFilteredList={() => {
         domListHandler?.focusFirst();
       }}
+      data-testid="SqlObjectList_search"
     />
     <CloseSearchButton bind:filter />
     <DropDownButton
@@ -221,6 +222,7 @@
       menu={createSearchMenu}
       square={!!filter}
       narrow={false}
+      data-testid="SqlObjectList_searchMenuDropDown"
     />
     {#if !filter}
       <DropDownButton icon="icon plus-thick" menu={createAddMenu} />