From 7341d9fadd1466a5b2f2bde8631f3b02cf9a7d8a Mon Sep 17 00:00:00 2001
From: Alex Rudenko <OrKoN@users.noreply.github.com>
Date: Wed, 22 Sep 2021 12:48:24 +0200
Subject: [PATCH] fix: request an animation frame to fix flaky clickablePoint
 test (#7587)

Sometimes an element has not been layed out yet and, in this case,
clickablePoint fails because backend cannot compute content quads.

Co-authored-by: Jan Scheffler <janscheffler@chromium.org>
---
 test/jshandle.spec.ts | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/test/jshandle.spec.ts b/test/jshandle.spec.ts
index 685d448899d11..4f64d738ae112 100644
--- a/test/jshandle.spec.ts
+++ b/test/jshandle.spec.ts
@@ -309,7 +309,9 @@ describe('JSHandle', function () {
           <div style="cursor: pointer; width: 120px; height: 60px; margin: 30px; padding: 15px;"></div>
         `;
       });
-
+      await page.evaluate(async () => {
+        return new Promise((resolve) => window.requestAnimationFrame(resolve));
+      });
       const divHandle = await page.$('div');
       expect(await divHandle.clickablePoint()).toEqual({
         x: 45 + 60, // margin + middle point offset
@@ -335,6 +337,9 @@ describe('JSHandle', function () {
           <iframe style="border: none; margin: 0; padding: 0;" seamless sandbox srcdoc="<style>* { margin: 0; padding: 0;}</style><div style='cursor: pointer; width: 120px; height: 60px; margin: 30px; padding: 15px;' />"></iframe>
         `;
       });
+      await page.evaluate(async () => {
+        return new Promise((resolve) => window.requestAnimationFrame(resolve));
+      });
       const frame = page.frames()[1];
       const divHandle = await frame.$('div');
       expect(await divHandle.clickablePoint()).toEqual({