From 464386ecf511d87e84278d7f5a937cfb76c3328e Mon Sep 17 00:00:00 2001
From: jrandolf <101637635+jrandolf@users.noreply.github.com>
Date: Thu, 21 Sep 2023 22:50:36 +0200
Subject: [PATCH] chore: deflake textarea test (#10983)

---
 test/assets/input/textarea.html |  2 +-
 test/src/mouse.spec.ts          | 29 +++++++++++++++--------------
 2 files changed, 16 insertions(+), 15 deletions(-)
diff --git a/test/assets/input/textarea.html b/test/assets/input/textarea.html
index 6d77f310..66fdc403 100644
--- a/test/assets/input/textarea.html
+++ b/test/assets/input/textarea.html
@@ -4,7 +4,7 @@
     <title>Textarea test</title>
   </head>
   <body>
-    <textarea></textarea>
+    <textarea rows="5" cols="20"></textarea>
     <script src='mouse-helper.js'></script>
     <script>
       globalThis.result = '';
diff --git a/test/src/mouse.spec.ts b/test/src/mouse.spec.ts
index 951efbe5..9eedd96d 100644
--- a/test/src/mouse.spec.ts
+++ b/test/src/mouse.spec.ts
@@ -97,29 +97,30 @@ describe('Mouse', function () {
   it('should select the text with mouse', async () => {
     const {page, server} = await getTestState();
 
-    await page.goto(server.PREFIX + '/input/textarea.html');
-    await page.focus('textarea');
     const text =
       "This is the text that we are going to try to select. Let's see how it goes.";
+
+    await page.goto(`${server.PREFIX}/input/textarea.html`);
+    await page.focus('textarea');
     await page.keyboard.type(text);
-    // Firefox needs an extra frame here after typing or it will fail to set the scrollTop
-    await page.evaluate(() => {
-      return new Promise(requestAnimationFrame);
-    });
-    await page.evaluate(() => {
-      return (document.querySelector('textarea')!.scrollTop = 0);
-    });
+    using handle = await page
+      .locator('textarea')
+      .filterHandle(async element => {
+        return await element.evaluate((element, text) => {
+          return element.value === text;
+        }, text);
+      })
+      .waitHandle();
     const {x, y} = await page.evaluate(dimensions);
     await page.mouse.move(x + 2, y + 2);
     await page.mouse.down();
     await page.mouse.move(100, 100);
     await page.mouse.up();
     expect(
-      await page.evaluate(() => {
-        const textarea = document.querySelector('textarea')!;
-        return textarea.value.substring(
-          textarea.selectionStart,
-          textarea.selectionEnd
+      await handle.evaluate(element => {
+        return element.value.substring(
+          element.selectionStart,
+          element.selectionEnd
         );
       })
     ).toBe(text);
