<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: v1.33, All?</li>
</ul>
<h3 dir="auto">Source code</h3>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I provided the exact source code that allows reproducing the issue locally.</li>
</ul>




<p dir="auto"><strong>Test file (self-contained)</strong></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// repro.mjs

import { chromium } from '@playwright/test'

const browser = await chromium.launch({
  headless: false
})

const context = await browser.newContext()
const page = await context.newPage()

page.once('load', async page =&gt; {
  await page.waitForTimeout(10000)

  console.log('after 10 sec!')
})

await page.goto('https://google.com/')

await page.locator('#L2AGLb').click()
await page.locator('textarea#APjFqb').first().type('Playwright')

await page.locator('.FPdoLc input.gNO89b[name=&quot;btnK&quot;]').click()

await page.pause()
"><pre class="notranslate"><span class="pl-c">// repro.mjs</span>

<span class="pl-k">import</span> <span class="pl-kos">{</span> <span class="pl-s1">chromium</span> <span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'@playwright/test'</span>

<span class="pl-k">const</span> <span class="pl-s1">browser</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> <span class="pl-s1">chromium</span><span class="pl-kos">.</span><span class="pl-en">launch</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
  <span class="pl-c1">headless</span>: <span class="pl-c1">false</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span>

<span class="pl-k">const</span> <span class="pl-s1">context</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> <span class="pl-s1">browser</span><span class="pl-kos">.</span><span class="pl-en">newContext</span><span class="pl-kos">(</span><span class="pl-kos">)</span>
<span class="pl-k">const</span> <span class="pl-s1">page</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> <span class="pl-s1">context</span><span class="pl-kos">.</span><span class="pl-en">newPage</span><span class="pl-kos">(</span><span class="pl-kos">)</span>

<span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">once</span><span class="pl-kos">(</span><span class="pl-s">'load'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <span class="pl-s1">page</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">waitForTimeout</span><span class="pl-kos">(</span><span class="pl-c1">10000</span><span class="pl-kos">)</span>

  <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">'after 10 sec!'</span><span class="pl-kos">)</span>
<span class="pl-kos">}</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://google.com/'</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">locator</span><span class="pl-kos">(</span><span class="pl-s">'#L2AGLb'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">click</span><span class="pl-kos">(</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">locator</span><span class="pl-kos">(</span><span class="pl-s">'textarea#APjFqb'</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-en">type</span><span class="pl-kos">(</span><span class="pl-s">'Playwright'</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">locator</span><span class="pl-kos">(</span><span class="pl-s">'.FPdoLc input.gNO89b[name="btnK"]'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">click</span><span class="pl-kos">(</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">pause</span><span class="pl-kos">(</span><span class="pl-kos">)</span></pre></div>
<p dir="auto"><strong>Steps</strong></p>
<ul dir="auto">
<li><code class="notranslate">npm install @playwright/test</code></li>
<li><code class="notranslate">npx playwright install --with-deps</code></li>
<li><code class="notranslate">node repro.mjs</code></li>
</ul>
<p dir="auto"><strong>Expected</strong></p>
<p dir="auto">I expected that the callback in the event listener would block executing the rest of the script for 10 seconds.</p>
<p dir="auto"><strong>Actual</strong></p>
<p dir="auto">The script is executed without waiting for the callback to be fulfilled (a Google search is done first, and a message is logged to the console later).</p>
<p dir="auto"><strong>Comment</strong></p>
<p dir="auto">I wasn't sure if it should be reported as a bug or maybe a feature request, so please adjust the issue. If an actual implementation has to stay untouched, then I believe putting information in the docs for that scenario could be helpful for others. Providing me with a workaround to achieve my goal is also very welcome here.</p>
<p dir="auto">My application have two different environments. In one of the environment, elements are available in iframe whereas in other environment, they are present in page. I don't want to duplicate my code. Is there a way that I can handle both frame and page elements in the same ts file?</p>