<p dir="auto">Is there an ability to query for a selector that has extraneous space around it? I'm left to "test" some legacy Angular.js apps, which are notorious for this.</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/599459/97960076-6ba6f500-1dfc-11eb-912b-57717d26d509.png"><img src="https://user-images.githubusercontent.com/599459/97960076-6ba6f500-1dfc-11eb-912b-57717d26d509.png" alt="image" style="max-width: 100%;"></a></p>
<p dir="auto">my <code class="notranslate">await page.waitForSelector('"What does your Ford Focus need?"')</code> is never resolving, and upon DEBUG mode it never resolves.</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/599459/97960120-84170f80-1dfc-11eb-8f36-8633ffc6c3ec.png"><img src="https://user-images.githubusercontent.com/599459/97960120-84170f80-1dfc-11eb-8f36-8633ffc6c3ec.png" alt="image" style="max-width: 100%;"></a></p>
<p dir="auto">other elements I query do however work, so it could either be the dodgy space in there—or the fact that part of the "text" is nested in a span?</p>
<p dir="auto"><strong>Context:</strong></p>
<ul dir="auto">
<li>Playwright Version: 0.16.0</li>
<li>Operating System: Mac</li>
<li>Node version: v13.11.0</li>
<li>Browser: All</li>
</ul>
<p dir="auto"><strong>Code Snippet</strong></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="const { chromium } = require('playwright');

(async () =&gt; {
  const browser = await chromium.launch()
  const context = await browser.newContext()
  const page = await context.newPage()

  await page.setContent(`
&lt;div class=&quot;wrapper&quot;&gt;
  &lt;div&gt;
    &lt;span&gt;Should&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;span&gt;match&lt;/span&gt;
  &lt;/div&gt;
&lt;/div&gt;`)

  const elementByClass = await page.$('.wrapper')
  const innerText = await elementByClass.innerText()
  console.log('Inner Text matches regex:', /Should.*match/is.test(innerText))

  const elementByText = await page.$('text=/Should.*match/is')
  console.log('element not found:', elementByText === null)

  await browser.close()
})()"><pre class="notranslate"><span class="pl-k">const</span> <span class="pl-kos">{</span> chromium <span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'playwright'</span><span class="pl-kos">)</span><span class="pl-kos">;</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">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-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-k">await</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">setContent</span><span class="pl-kos">(</span><span class="pl-s">`</span>
<span class="pl-s">&lt;div class="wrapper"&gt;</span>
<span class="pl-s">  &lt;div&gt;</span>
<span class="pl-s">    &lt;span&gt;Should&lt;/span&gt;</span>
<span class="pl-s">  &lt;/div&gt;</span>
<span class="pl-s">  &lt;div&gt;</span>
<span class="pl-s">    &lt;span&gt;match&lt;/span&gt;</span>
<span class="pl-s">  &lt;/div&gt;</span>
<span class="pl-s">&lt;/div&gt;`</span><span class="pl-kos">)</span>

  <span class="pl-k">const</span> <span class="pl-s1">elementByClass</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">$</span><span class="pl-kos">(</span><span class="pl-s">'.wrapper'</span><span class="pl-kos">)</span>
  <span class="pl-k">const</span> <span class="pl-s1">innerText</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> <span class="pl-s1">elementByClass</span><span class="pl-kos">.</span><span class="pl-en">innerText</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">'Inner Text matches regex:'</span><span class="pl-kos">,</span> <span class="pl-pds"><span class="pl-c1">/</span>Should.<span class="pl-c1">*</span>match<span class="pl-c1">/</span>is</span><span class="pl-kos">.</span><span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s1">innerText</span><span class="pl-kos">)</span><span class="pl-kos">)</span>

  <span class="pl-k">const</span> <span class="pl-s1">elementByText</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">$</span><span class="pl-kos">(</span><span class="pl-s">'text=/Should.*match/is'</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">'element not found:'</span><span class="pl-kos">,</span> <span class="pl-s1">elementByText</span> <span class="pl-c1">===</span> <span class="pl-c1">null</span><span class="pl-kos">)</span>

  <span class="pl-k">await</span> <span class="pl-s1">browser</span><span class="pl-kos">.</span><span class="pl-en">close</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>Output</strong></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Inner Text matches regex: true
element not found: true"><pre class="notranslate"><code class="notranslate">Inner Text matches regex: true
element not found: true
</code></pre></div>
<p dir="auto"><strong>Describe the bug</strong><br>
Since regex matches innerText of <code class="notranslate">.wrapper</code> element I expect it to be matched by selector.</p>