<h3 dir="auto">Your question</h3>
<p dir="auto">As we can see in the documentation<br>
<code class="notranslate">https://playwright.dev/docs/api/class-elementhandle#element-handle-wait-for-element-state</code><br>
We have WaitForSelector() has<br>
1.'attached'<br>
2.'detached'<br>
3.'visible'<br>
4.'hidden'<br>
But while writing the script I can only view Visible and attached options only.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="protected async invisiblity(ele) {
    const element = await this.page.$(ele);
    await element.waitForSelector(ele,{state:&quot; &quot;})
  }"><pre class="notranslate"><code class="notranslate">protected async invisiblity(ele) {
    const element = await this.page.$(ele);
    await element.waitForSelector(ele,{state:" "})
  }
</code></pre></div>
<p dir="auto">is there any way we can use detached of a selector.<br>
Thank u .</p>
<p dir="auto">See here:</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/17984549/122956249-1fa3c300-d381-11eb-9a49-5e4ecc46e099.png"><img src="https://user-images.githubusercontent.com/17984549/122956249-1fa3c300-d381-11eb-9a49-5e4ecc46e099.png" alt="image" style="max-width: 100%;"></a></p>
<p dir="auto">Not sure if its a TypeScript bug or if our types can be improved there. It's about prioritisation of the method type overloads afaik.</p>