From 9a474b36280996e24221a0dab9837aef375f65a8 Mon Sep 17 00:00:00 2001
From: Cee Chen <constance.chen@elastic.co>
Date: Thu, 21 Sep 2023 15:15:13 -0700
Subject: [PATCH] Write E2E Cypress tests

---
 src/components/combo_box/combo_box.spec.tsx | 36 +++++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/src/components/combo_box/combo_box.spec.tsx b/src/components/combo_box/combo_box.spec.tsx
index 4910941a1f5e..e40d4ffd85d7 100644
--- a/src/components/combo_box/combo_box.spec.tsx
+++ b/src/components/combo_box/combo_box.spec.tsx
@@ -50,6 +50,42 @@ describe('EuiComboBox', () => {
     });
   });
 
+  describe('input auto sizing', () => {
+    it('resizes the width of the input based to fit the search text', () => {
+      cy.realMount(<EuiComboBox options={[]} />);
+      cy.get('[data-test-subj="comboBoxSearchInput"]').should(
+        'have.attr',
+        'style',
+        'inline-size: 2px;'
+      );
+
+      cy.get('[data-test-subj="comboBoxSearchInput"]').realClick();
+      cy.realType('lorem ipsum dolor');
+      cy.get('[data-test-subj="comboBoxSearchInput"]').should(
+        'have.attr',
+        'style',
+        'inline-size: 121px;'
+      );
+    });
+
+    it('does not exceed the maximum possible width of the input wrapper', () => {
+      cy.realMount(<EuiComboBox options={[]} />);
+      cy.get('[data-test-subj="comboBoxSearchInput"]').realClick();
+      cy.realType(
+        'Lorem ipsum dolor sit amet, consectetur adipiscing elit......'
+      );
+
+      cy.get('[data-test-subj="comboBoxSearchInput"]').should(
+        'have.attr',
+        'style',
+        'inline-size: 387px;'
+      );
+      cy.get('[data-test-subj="comboBoxSearchInput"]')
+        .invoke('width')
+        .should('be.eq', 354);
+    });
+  });
+
   describe('truncation', () => {
     const sharedProps = {
       style: { width: 200 },