Я не понимаю первую часть вашего вопроса.Пожалуйста, подробно расскажите о том, что вам нужно, а также попробуйте добавить какой-нибудь пробный код.
Что касается второй части вашего кода, вы всегда можете сделать что-то вроде этого:
function getHtml() {
return document.documentElement.outerHTML;
}
document.querySelector('#clickme').addEventListener('click',
()=>{
console.log(getHtml());
}
);
<button id="clickme">Click Me</button>
document.documentElement - это элемент <html> для вашей страницы, и получение outerHTML этого элемента даст вам весь текущий HTML.
Вместо того, чтобы делать console.log, вы можете делать с ним все, что хотите.
Это не получит все shadowDOM, оно получит толькоразоблаченный HTML.