From 6961e641b4c4e6d1bd5de8495c3e953fca00ea79 Mon Sep 17 00:00:00 2001
From: Cee Chen <constance.chen@elastic.co>
Date: Mon, 14 Aug 2023 08:52:23 -0700
Subject: [PATCH] Fix failing Cypress test

- was off by 2.5px on headless vs headed, so tweak widths so it stops doing that

+ explicitly set viewport width (in case the default changes in the future)
---
 src/components/popover/input_popover.spec.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/components/popover/input_popover.spec.tsx b/src/components/popover/input_popover.spec.tsx
index 1acb83c5ec6..1ba40253959 100644
--- a/src/components/popover/input_popover.spec.tsx
+++ b/src/components/popover/input_popover.spec.tsx
@@ -16,6 +16,11 @@ import { EuiFieldText, EuiTextArea } from '../../components';
 import { EuiInputPopover } from './input_popover';
 
 describe('EuiPopover', () => {
+  // The viewport width matters for position assertions, so ensure it's explicitly defined
+  beforeEach(() => {
+    cy.viewport(500, 300);
+  });
+
   const props = {
     input: <EuiFieldText />,
     closePopover: () => {},
@@ -62,13 +67,15 @@ describe('EuiPopover', () => {
         <EuiInputPopover
           {...props}
           display="inline-block"
-          input={<EuiTextArea rows={1} resize="horizontal" />}
+          input={
+            <EuiTextArea rows={1} resize="horizontal" style={{ width: 150 }} />
+          }
         >
           Popover content
         </EuiInputPopover>
       </div>
     );
-    cy.get('[data-popover-panel]').should('have.css', 'left', '155.5px');
+    cy.get('[data-popover-panel]').should('have.css', 'left', '175px');
     cy.wait(100); // Wait a tick, otherwise Cypress returns a false positive
 
     // Cypress doesn't seem to have a way to mimic manual dragging/resizing, so we'll do it programmatically