Opened 3 months ago

#15343 new bug

References held to select and option elements after selectmenu('destroy') call

Reported by: garycuthbert Owned by:
Priority: minor Milestone: none
Component: ui.selectmenu Version: 1.12.1
Keywords: Cc:
Blocked by: Blocking:

Description

Following feedback from a question i posted on the forum: https://forum.jquery.com/topic/selectmenu-widget-correct-usage-of-destroy I thought it would be worth raising this as a potential issue.

I am looking at memory usage in our web app and have been using the chrome developer memory tool (under windows 10) to take heap snapshots before and after certain actions. One such issue appears to be coming from the selectmenu widget.

I have created a codepen that shows the behaviour seen: https://codepen.io/garycuthbert/pen/dEjvyq

If you:

  1. Run the codepen under chrome (i used incognito mode) and access the memory developer tools.
  2. Collect the garbage (dustbin icon) and take an initial heap snapshot.
  3. Click 'Create Combobox' and observe that a combo box is added to the output.
  4. Click 'Remove ComboBox' and observe that the combo box is removed from the output.
  5. Return to the memory tools and collect the garbage (you may need to wait a few seconds and click the icon a couple of times until the heap size stops reducing).
  6. Take another heap snapshot.
  7. Select the second snapshot, view the summary with 'Detached' in the view filter and select 'Objects allocated between Snapshot 1 and Snapshot 2'
  8. Expand the 'Detached HTMLSelectElement' node and hover over the 'Detached' text of the sub item, you should see 'select.soloComboSelect'.

Screenshot: https://monosnap.com/file/4sHYv6pl6LTWQMMVfzalDILYazIHNE

I believe i am making the necessary calls to clear the DOM of the combobox but the heap comparison appears to suggest that the selectmenu widget is holding onto a reference to the select node.

In the codepen function 'destroyCombo' you can see that i explicitly clear the select node of options and call selectmenu('refresh') before calling selectmenu('destroy), without this extra step i see detached option elements that correspond to each of the 7 options added to the select node, screen shot: https://monosnap.com/file/CkztRik4XBuoNoanFJDhKtvFjEfPNK

Our app and the codepen both use v1.12.1 of jqueryui. Our app uses this with jquery v3.1.0 but the same behaviour is seen on the codepen using jquery v3.4.1.

Change History (0)

Note: See TracTickets for help on using tickets.