Что это за страшный термин? Про обычное DOM древо слышал уже давно, а вот с shadow DOM сталкиваюсь впервые, подскажите что это такое, и давно оно вообще есть?)
Применяли shadow DOM уже давно внутри самих браузеров, например, когда ты пытаешься добавить какой то инпут, например input type=date, браузер внутри конструирует структуру из обычных блоков, просто мы их не видим, но их можно увидеть если выбрать показ Shadow DOM в настройках dev tools твоего браузера, находится такой код обычно под вот такой строкой:
#shadow-root
То что будет ниже это и есть shadow DOM, Вот пример где я изменяю базовые настройки input type=date
input::-webkit-datetime-edit {
background: black;
color: #20e81b;
}
<input type="date">