An issue with modals with Chrome on Windows
I've had a enduser report issues when selecting a modal action on a Table view.
Here's what Sentry has to say. Seems like it's when attempting to attach a listener to the modal, seemingly that modal hasn't been created yet? 🤔
# NoModificationAllowedError: Failed to set the 'outerHTML' property on 'Element': This element has no parent node.
**Issue ID:** 48278874
**Project:** web
**Date:** 04/09/2025, 10:36:41
## Tags
- **DOMException.code:** 7
- **browser:** Chrome 139.0.0
- **browser.name:** Chrome
- **environment:** production
- **handled:** no
- **level:** error
- **mechanism:** instrument
- **os:** Windows >=10
- **os.name:** Windows
## Exception
### Exception 1
**Type:** NoModificationAllowedError
**Value:** Failed to set the 'outerHTML' property on 'Element': This element has no parent node.
#### Stacktrace
# NoModificationAllowedError: Failed to set the 'outerHTML' property on 'Element': This element has no parent node.
**Issue ID:** 48278874
**Project:** web
**Date:** 04/09/2025, 10:36:41
## Tags
- **DOMException.code:** 7
- **browser:** Chrome 139.0.0
- **browser.name:** Chrome
- **environment:** production
- **handled:** no
- **level:** error
- **mechanism:** instrument
- **os:** Windows >=10
- **os.name:** Windows
## Exception
### Exception 1
**Type:** NoModificationAllowedError
**Value:** Failed to set the 'outerHTML' property on 'Element': This element has no parent node.
#### Stacktrace
HTMLDivElement.<anonymous> in ../js/request/modal.js [Line 40] (In app)
iframe.contentWindow.document.open()
iframe.contentWindow.document.write(page.outerHTML)
iframe.contentWindow.document.close()
// Close on click.
modal.addEventListener('click', () => hideHtmlModal(modal)) <-- SUSPECT LINE
// Close on escape key press.
modal.setAttribute('tabindex', 0)
modal.addEventListener('keydown', e => {
if (e.key === 'Escape') hideHtmlModal(modal)
HTMLDivElement.r in /build/assets/sentry-DVz_Chrl.js [Line 486] (In app)
}
.editor__rect:hover button {
opacity: 1;
}
{snip} st r=function(...o){try{const i=o.map(s=>_t(s,t));return e.apply(this,i)}catch(i){throw Ll(),Hr(s=>{s.addEventProcessor(a=>(t.mechanism&&(ur {snip} <-- SUSPECT LINE
Type: ${e}
Name: ${ke(r)}
{snip} =ee["mark.fid"];c&&ee.fid&&(xe(e,c.value,c.value+z(ee.fid.value),{name:"first input delay",op:"ui.action",attributes:{[Z]:"auto.ui.browser.m {snip}
HTMLDivElement.<anonymous> in ../js/request/modal.js [Line 40] (In app)
iframe.contentWindow.document.open()
iframe.contentWindow.document.write(page.outerHTML)
iframe.contentWindow.document.close()
// Close on click.
modal.addEventListener('click', () => hideHtmlModal(modal)) <-- SUSPECT LINE
// Close on escape key press.
modal.setAttribute('tabindex', 0)
modal.addEventListener('keydown', e => {
if (e.key === 'Escape') hideHtmlModal(modal)
HTMLDivElement.r in /build/assets/sentry-DVz_Chrl.js [Line 486] (In app)
}
.editor__rect:hover button {
opacity: 1;
}
{snip} st r=function(...o){try{const i=o.map(s=>_t(s,t));return e.apply(this,i)}catch(i){throw Ll(),Hr(s=>{s.addEventProcessor(a=>(t.mechanism&&(ur {snip} <-- SUSPECT LINE
Type: ${e}
Name: ${ke(r)}
{snip} =ee["mark.fid"];c&&ee.fid&&(xe(e,c.value,c.value+z(ee.fid.value),{name:"first input delay",op:"ui.action",attributes:{[Z]:"auto.ui.browser.m {snip}
0 Replies