Don't run scripts while DOM tree is undergoing mutations (#34505)

* script: Implement node insertion post-connection hook. Ensure script elements only run scripts when the DOM has stabilized.

Signed-off-by: Josh Matthews <josh@joshmatthews.net>

* script: Make iframe element use post-connection steps when handling initial document insertion.

Signed-off-by: Josh Matthews <josh@joshmatthews.net>

* script: Use a delayed task when running post-connection steps.

Signed-off-by: Josh Matthews <josh@joshmatthews.net>

* script: Add explanatory comment.

Signed-off-by: Josh Matthews <josh@joshmatthews.net>

* Tidy.

Signed-off-by: Josh Matthews <josh@joshmatthews.net>

---------

Signed-off-by: Josh Matthews <josh@joshmatthews.net>
This commit is contained in:
Josh Matthews 2024-12-26 01:06:09 -05:00 committed by GitHub
parent 20d67bdc44
commit 981616f918
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
10 changed files with 117 additions and 51 deletions

View file

@ -13529,6 +13529,13 @@
{}
]
],
"layout_blocker_operations.html": [
"2df68bf1c13179688708c97eab19361608b0de82",
[
null,
{}
]
],
"lenient_this.html": [
"960c74613f3c2809bb1f2ee6121bf14f28267051",
[

View file

@ -0,0 +1,34 @@
<html>
<head>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
</head>
<body>
<div id="foo"></div>
<script>
function verifyLayoutAllowed(t) {
t.step(() => {
assert_equals(getComputedStyle(document.querySelector('#foo')).display, "block");
t.done();
})
}
var insertionTest;
async_test(function(t) {
insertionTest = t;
let script = document.createElement('script');
document.body.appendChild(script);
script.appendChild(document.createTextNode("verifyLayoutAllowed(insertionTest)"));
}, "Insertion");
var replacementTest;
async_test(function(t) {
replacementTest = t;
let script = document.createElement('script');
document.body.appendChild(script);
script.innerHTML = "verifyLayoutAllowed(replacementTest)";
}, "Replace");
</script>
</body>
</html>