| <!DOCTYPE HTML> |
| <html> |
| <head> |
| <style> |
| * { |
| border: none; |
| } |
| :focus-within { |
| border: 2px solid green; |
| } |
| </style> |
| </head> |
| <body> |
| <div id="root"> |
| </div> |
| <script> |
| let rootElement = document.getElementById('root'); |
| let firstRoot = rootElement.attachShadow({mode: 'closed'}); |
| let insideDiv = document.createElement("div"); |
| insideDiv.innerText = "Foobar"; |
| let inputElement = document.createElement("input") |
| insideDiv.appendChild(inputElement); |
| firstRoot.appendChild(insideDiv); |
| inputElement.focus(); |
| </script> |
| </body> |
| </html> |
