<p dir="auto">when using typescript, <code class="notranslate">expect</code> assertions are not typechecked. since playwright supports typescript, i would expect the assertions to be typechecked, otherwise the typescript support is completely pointless</p>
<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: 1.30.0</li>
<li>Operating System: windows 10</li>
<li>Browser: 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 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-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// tests/test.ts
test('asdf', async ({ page }) =&gt; {
  // this is wrong:
  expect(page.locator('li').count()).toBe(2)

  // the argument to expect needs to be awaited, like so:
  // expect(await page.locator('li').count()).toBe(2)
});"><pre class="notranslate"><span class="pl-c">// tests/test.ts</span>
<span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">'asdf'</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-c">// this is wrong:</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-en">locator</span><span class="pl-kos">(</span><span class="pl-s">'li'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">count</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toBe</span><span class="pl-kos">(</span><span class="pl-c1">2</span><span class="pl-kos">)</span>

  <span class="pl-c">// the argument to expect needs to be awaited, like so:</span>
  <span class="pl-c">// expect(await page.locator('li').count()).toBe(2)</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>
<ol dir="auto">
<li>run <code class="notranslate">tsc</code> on the test file</li>
<li>run the test</li>
</ol>
<p dir="auto"><strong>Expected</strong></p>
<p dir="auto">compile error because it's comparing a <code class="notranslate">Promise</code> to a <code class="notranslate">number</code></p>
<p dir="auto"><strong>Actual</strong></p>
<p dir="auto">no compile error, fails at runtime with a misleading error message:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="  1) tests\test.ts:8:1 › asdf ====================================================

    Error: expect(received).toBe(expected) // Object.is equality

    Expected: 1
    Received: {}"><pre class="notranslate"><code class="notranslate">  1) tests\test.ts:8:1 › asdf ====================================================

    Error: expect(received).toBe(expected) // Object.is equality

    Expected: 1
    Received: {}
</code></pre></div>
<p dir="auto">as well as an even more misleading error (<a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1399205346" data-permission-text="Title is private" data-url="https://github.com/microsoft/playwright/issues/17869" data-hovercard-type="issue" data-hovercard-url="/microsoft/playwright/issues/17869/hovercard?comment_id=1398721182&amp;comment_type=issue_comment" href="https://github.com/microsoft/playwright/issues/17869#issuecomment-1398721182">#17869 (comment)</a>):</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Test timeout of 30000ms exceeded while tearing down &quot;context&quot;."><pre class="notranslate"><code class="notranslate">Test timeout of 30000ms exceeded while tearing down "context".
</code></pre></div>
<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: [v1.24]</li>
<li>Operating System: [macOS 13.4.]</li>
<li>Browser: [All, Chromium, Firefox, WebKit]</li>
<li>Other info: nodejs v18</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 exact source code that allows reproducing the issue locally.</li>
</ul>




<p dir="auto"><strong>Config file</strong></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// playwright.config.ts
import { defineConfig, devices } from '@playwright/test';
console.log(&quot;this in config file&quot;, this)
export default defineConfig({
  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'], },
    },
});"><pre class="notranslate"><span class="pl-c">// playwright.config.ts</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span> <span class="pl-s1">defineConfig</span><span class="pl-kos">,</span> <span class="pl-s1">devices</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-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">"this in config file"</span><span class="pl-kos">,</span> <span class="pl-smi">this</span><span class="pl-kos">)</span>
<span class="pl-k">export</span> <span class="pl-k">default</span> <span class="pl-en">defineConfig</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
  <span class="pl-c1">projects</span>: <span class="pl-kos">[</span>
    <span class="pl-kos">{</span>
      <span class="pl-c1">name</span>: <span class="pl-s">'chromium'</span><span class="pl-kos">,</span>
      <span class="pl-c1">use</span>: <span class="pl-kos">{</span> ...<span class="pl-s1">devices</span><span class="pl-kos">[</span><span class="pl-s">'Desktop Chrome'</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><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>Test file (self-contained)</strong></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="test('test this keyword in test', async ({ page }) =&gt; {
  await page.goto('https://maps.google.com');
 console.log(&quot;this in test&quot;,this)
  this.page=&quot;google page&quot;
 console.log(&quot;page:&quot;, this.page)
});"><pre class="notranslate"><span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">'test this keyword in 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://maps.google.com'</span><span class="pl-kos">)</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">"this in test"</span><span class="pl-kos">,</span><span class="pl-smi">this</span><span class="pl-kos">)</span>
  <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">page</span><span class="pl-c1">=</span><span class="pl-s">"google page"</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">"page:"</span><span class="pl-kos">,</span> <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">page</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>
<ul dir="auto">
<li>[Run the test]</li>
</ul>
<p dir="auto"><strong>Expected</strong></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="this in config should be {}
this in test should be {}
this.page=&quot;google page&quot;"><pre class="notranslate"><code class="notranslate">this in config should be {}
this in test should be {}
this.page="google page"
</code></pre></div>
<p dir="auto"><strong>Actual</strong></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="this in config is: undefined
this in test is: undefined
error when executing line &quot;this.page&quot; since page is &quot;undefined&quot;"><pre class="notranslate"><code class="notranslate">this in config is: undefined
this in test is: undefined
error when executing line "this.page" since page is "undefined"
</code></pre></div>
<p dir="auto"><strong>When I test the same case in playwright v1.23, it works as expected.</strong></p>