Github Add shadow host consideration for :focus selector by rakina · Pull Reques...

Editorial comments aside, I think this works. The tests in https://github.com/web-platform-tests/wpt/pull/17493/files seem correct, and here is my walkthrough of a couple of them:

Delegated

<div id="outer">
  #shadow delegatesFocus = true
  <div id="mid">
    #shadow delegatesFocus = true
      <div id="inner" tabindex="0">
  
inner.focus()

• inner has the focus because it is the currently focused area of the top-level browsing context
• mid has the focus because its shadow root is not null, its shadow root's delegates focus is true, and its shadow root is the root of inner
• outer has the focus because its shadow root is not null, its shadow root's delegates focus is true, and its shadow root is the root of mid

No delegation

<div id="outer">
  #shadow delegatesFocus = true
  <div id="mid">
    #shadow delegatesFocus = false
      <div id="inner" tabindex="0">
  
inner.focus()

• inner has the focus because it is one of the elements listed in the focus chain of the currently focused area of the top-level browsing context
• mid does not have the focus, because its shadow root's delegates focus is false, and it is not listed in the focus chain of inner. (As Rakian says, focus chains basically only contain the parent BC container elements)
• outer does not have the focus because it is not the root of any element that has the focus, and it is not listed in the focus chain of inner.