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();
+ 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();
+ 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 },