ui-mask in shadow dom
Opened this issue · 0 comments
chesminsky commented
Hello.
I know it can sound weird, but i need to use ui-mask in shadow dom.
I use web components spec and i created component that wraps angular app
pls take a look at this plunkr (works in chrome)
https://plnkr.co/edit/N4j9R2ZhTYNKAyZBa7E6?p=preview]
The problem here I find is at line 64 of mask.js document.activeElement
now points to wrong element (custom element in this case, not an input element)
I found a solution as mentioned in this article https://developers.google.com/web/fundamentals/getting-started/primers/shadowdom
function deepActiveElement() {
var a = document.activeElement;
while (a && a.shadowRoot && a.shadowRoot.activeElement) {
a = a.shadowRoot.activeElement;
}
return a;
}
function isFocused (elem) {
return elem === deepActiveElement() &&
(!document.hasFocus || document.hasFocus()) &&
!!(elem.type || elem.href || ~elem.tabIndex);
}
this fix may solve the problem.
Will you consider using ui-mask in shadow dom ?