Bug 262218

In our web application we’ve noticed a significant number of detached DOM subtrees not getting garbage collected when running in Safari Desktop and on iOS. We’ve managed to narrow the issue down to the existence of form input elements within these subtrees. If I remove these form and input elements, the subtrees in question get entirely garbage collected.


The retained (leaking) subtrees in question correspond to panel UI within our application, so you can imagine how the process size of the web application tab grows steadily as the user triggers the showing and hiding of various panels. Our panels are quite large and complex so things sometimes get the point where Safari iOS will reload our web application.


Attached to this bug is a zip file containing a minimal test case that illustrates the issue. The curious thing is that with the minimal test case, in order to see the issue I described, the user must first give the input element focus, either by clicking or tabbing to it, at some point before pressing the Remove button to detach the sample subtree from the DOM. Within our application, I don’t need to interact with the input element to see the issue. Also, the minimal test case using <input type=“search”> to match our application, but I am able to reproduce the same issue with <input type=“text”>.


There is also a video attached to this bug that demonstrates what we see.


I can reproduce this issue in Safari 16.5 as well as WebKit 268505@main.


Instructions:

* Load the test case in a Safari or Webkit build.
* Click all of the Remove buttons on the page.
* Trigger a garbage collection via the terminal with ‘notifyutil -p org.WebKit.lowMemory’
* Observe that all of the test cases turn green
* Reload the test case
* Click on any number of inputs on the page to give them focus
* Click all of the Remove buttons on the page
* Trigger a garbage collection.
* Notice only samples that you did NOT give the input focus will turn green. All others will remain white indicating no garbage collection has happened.
* Click on all of the “Unparent Children” buttons
* Trigger a garbage collection
* Notice how most elements turn red to indicate they have been garbage collected, while only the form and input elements remain white indicating they have not been garbage collected.