rrweb
rrweb copied to clipboard
Support top-layer <dialog> recording & replay
Fixes #1381.
Adds support for recording & replaying Top Layer <dialog> elements. These elements float over any other elements no matter the z-index.
What this PR does not do:
- trigger
showModal()on rrweb-snapshot'srebuild- when rebuild is called we have no guarantee the element is added to the dom, and
.showModal()has to be attached to be called, so the responsibility to do this is hoisted to rrweb & rrdom.
- when rebuild is called we have no guarantee the element is added to the dom, and
- add support for
popoverelements. - add support for
requestFullScreenelements. - register order of top layer dialog elements, this is impossible to do without monkey patching
HTMLDialogElement.showModal, and although that is possible I didn't have time to implement it. However most of the time this PR should sufficient. Unfortunately there is no way to query the dom for the order of elements in the top layer, as that would have made this doable without monkey patch, and recordable in rrweb-snapshot.- exact case where this breaks:
-
const dialog1 = document.createElement('dialog') as HTMLDialogElement; dialog1.className = 'dialog1'; document.body.appendChild(dialog1); const dialog2 = document.createElement('dialog') as HTMLDialogElement; dialog1.className = 'dialog2'; document.body.appendChild(dialog2); dialog2.showModal(); // <== Note that dialog TWO is being triggered first, if dialog 1 was triggered first, this would have replayed as expected. dialog1.showModal();