diff --git a/example/cypress/e2e/forms/autocomplete.cy.ts b/example/cypress/e2e/forms/autocomplete.cy.ts
index 7bc4250..a8bf4d2 100644
--- a/example/cypress/e2e/forms/autocomplete.cy.ts
+++ b/example/cypress/e2e/forms/autocomplete.cy.ts
@@ -7,12 +7,12 @@ describe('forms/Auto Completes', () => {
     cy.contains('h2[data-cy=auto-completes]', 'Auto Completes');
     cy.get('div[data-cy=auto-complete-0]').as('firstAutoComplete');
 
-    cy.get('@firstAutoComplete').find('[data-id="activator"]').should('be.exist');
+    cy.get('@firstAutoComplete').should('be.exist');
     cy.get('@firstAutoComplete').find('span[class*=_label_]').should('contain.text', 'Select');
 
     cy.get('div[role=menu]').should('not.exist');
 
-    cy.get('@firstAutoComplete').find('[data-id="activator"]').click();
+    cy.get('@firstAutoComplete').click();
 
     cy.get('div[role=menu]').should('be.visible');
     cy.get('div[role=menu] button:first-child').click();
diff --git a/src/composables/dropdown-menu.ts b/src/composables/dropdown-menu.ts
index 0c788aa..0291e58 100644
--- a/src/composables/dropdown-menu.ts
+++ b/src/composables/dropdown-menu.ts
@@ -136,7 +136,7 @@ export function useDropdownMenu<T, K extends keyof T>({
     return itemIndexInValue(item) !== -1;
   }
 
-  function adjustScrollByHighlightedIndex() {
+  function adjustScrollByHighlightedIndex(smooth: boolean = false) {
     const index = get(highlightedIndex);
     nextTick(() => {
       const container = get(menuRef)?.parentElement;
@@ -144,7 +144,7 @@ export function useDropdownMenu<T, K extends keyof T>({
         const highlightedElem = get(menuRef).getElementsByClassName('highlighted')[0];
 
         if (highlightedElem) {
-          highlightedElem.scrollIntoView?.({ block: 'nearest' });
+          highlightedElem.scrollIntoView?.({ behavior: smooth ? 'smooth' : 'auto', block: 'nearest' });
           if (get(autoFocus) && 'focus' in highlightedElem && typeof highlightedElem.focus === 'function')
             highlightedElem?.focus();
         }
@@ -184,7 +184,7 @@ export function useDropdownMenu<T, K extends keyof T>({
   watch(highlightedIndex, (curr, prev) => {
     if (curr !== prev) {
       nextTick(() => {
-        adjustScrollByHighlightedIndex();
+        adjustScrollByHighlightedIndex(true);
       });
     }
   });