title: querySelector :scope is null
body: <p>I am trying to select a sibling of the current element, but when I use <code>a.querySelector(':scope')</code> on the element it is null. When I try to add a sibling selector to the <code>:scope</code> it is still null, but if I use it within <code>.matches(':scope')</code> it returns true. How can I use the current element within the selector?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>let a = document.querySelector('div &gt; a')
  console.log(a.querySelector(':scope'))
  console.log(a.querySelector(':scope + span'))
  console.log(a.matches(':scope'))</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div&gt;
    &lt;a href=""&gt;&lt;/a&gt;
    &lt;span&gt;&lt;/span&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>