<p dir="auto">This issue is only ocuring in [Iphone 12].</p>
<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: [v131.1]</li>
<li>Operating System:  Ubuntu</li>
<li>Browser: DEVICE_TYPE=iPhone12</li>
<li>Other info:</li>
</ul>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="    it(&quot;renders the component&quot;, async () =&gt; {
      await page.click(&quot;text=Go to page&quot;);
      await expect(page).toHaveSelector(`.gotopage`);
    });
"><pre class="notranslate">    <span class="pl-en">it</span><span class="pl-kos">(</span><span class="pl-s">"renders the component"</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
      <span class="pl-k">await</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">click</span><span class="pl-kos">(</span><span class="pl-s">"text=Go to page"</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
      <span class="pl-k">await</span> <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">page</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toHaveSelector</span><span class="pl-kos">(</span><span class="pl-s">`.gotopage`</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto"><strong>Steps</strong></p>
<p dir="auto">[Describe actual behavior]<br>
locator resolved to ...<br>
attempting click action<br>
waiting for element to be visible, enabled and stable<br>
element is visible, enabled and stable<br>
scrolling into view if needed<br>
done scrolling<br>
element is outside of the viewport</p>
<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: [v1.33.0]</li>
<li>Operating System: [Windows 11, macOS 13.2]</li>
<li>Browser: [Chromium]</li>
<li>Other info:</li>
</ul>
<h3 dir="auto">Source code</h3>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import { test } from &quot;@playwright/test&quot;;

test(&quot;test&quot;, async ({ page }) =&gt; {
    await page.goto(&quot;https://letcode.in/table&quot;);

    // This does not locate the first row
    page.getByRole(&quot;row&quot;).nth(0);

    // Only this locates the first row
    page.getByRole(&quot;row&quot;).first();
});"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-kos">{</span> <span class="pl-s1">test</span> <span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">"@playwright/test"</span><span class="pl-kos">;</span>

<span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">"test"</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <span class="pl-kos">(</span><span class="pl-kos">{</span> page <span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
    <span class="pl-k">await</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">goto</span><span class="pl-kos">(</span><span class="pl-s">"https://letcode.in/table"</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

    <span class="pl-c">// This does not locate the first row</span>
    <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">getByRole</span><span class="pl-kos">(</span><span class="pl-s">"row"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">nth</span><span class="pl-kos">(</span><span class="pl-c1">0</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

    <span class="pl-c">// Only this locates the first row</span>
    <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">getByRole</span><span class="pl-kos">(</span><span class="pl-s">"row"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto"><strong>Expected</strong></p>
<p dir="auto"><code class="notranslate">page.getByRole("row").nth(0);</code> shoud locate the first row.</p>
<a target="_blank" rel="noopener noreferrer" href="https://user-images.githubusercontent.com/78950093/237922456-44d0e892-d499-4a5f-a1ca-c593149d3168.png"><img width="1518" alt="image" src="https://user-images.githubusercontent.com/78950093/237922456-44d0e892-d499-4a5f-a1ca-c593149d3168.png" style="max-width: 100%;"></a>
<p dir="auto"><strong>Actual</strong></p>
<p dir="auto"><code class="notranslate">page.getByRole("row").nth(0);</code> does not locate the first row. Only <code class="notranslate">page.getByRole("row").first();</code> locates the first row.</p>
<a target="_blank" rel="noopener noreferrer" href="https://user-images.githubusercontent.com/78950093/237922830-6f8b93cb-cb01-49bb-a98a-12ee53945e31.png"><img width="1522" alt="image" src="https://user-images.githubusercontent.com/78950093/237922830-6f8b93cb-cb01-49bb-a98a-12ee53945e31.png" style="max-width: 100%;"></a>