I am trying to access a shadow root element. Here is my html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test</title>
</head>
<body>
<div style="padding:20px;background-color:grey" id="wrapper">
<input type="password">
<div>
<script>
const wrapper = document.getElementById('wrapper');
wrapper.addEventListener("mouseleave", function(event){
console.log('mouseleave');
console.log(event.relatedTarget);
console.log(event.relatedTarget.shadowroot);
console.log(event.relatedTarget.shadowRoot);
});
</script>
</body>
</html>
On my browser, I have keepass plugin enabled, which adds a keepass icon on the input element:
I would like to detect, if the mouse is on the keepass icon when the mouseleave event is triggered, but why is shadowRoot empty? Also firstChild is empty aswell: