[wp-trac] [WordPress Trac] #32841: Partial refresh <div> in menu customizer breaks some theme designs

[WordPress Trac]

#32841: Partial refresh <div> in menu customizer breaks some theme designs
-------------------------------------+--------------------------
 Reporter:  greenshady               |       Owner:  westonruter
     Type:  defect (bug)             |      Status:  accepted
 Priority:  normal                   |   Milestone:  4.3
Component:  Customize                |     Version:  trunk
 Severity:  normal                   |  Resolution:
 Keywords:  has-patch needs-testing  |     Focuses:  javascript
-------------------------------------+--------------------------

Comment (by westonruter):

 Replying to [comment:4 greenshady]:
 > It's close.  It fixes the primary issue I opened this ticket for.
 >
 > However, the issue with the patch is that it wipes JS-added attributes
 from the element when adding/removing items.  For example, there's a
 `style="display:none;"` or `style="display:block;"` on the element there,
 which gets wiped.  Same with a jQuery-added `.open` or `.close` class.
 >
 > Here's the original:
 >
 > {{{
 > <div class="wrap partial-refreshable-nav-menu-1 partial-refreshable-nav-
 menu open" style="display:block;">
 > }}}
 >
 > After adding/removing an item, it becomes this:
 >
 > {{{
 > <div class="wrap partial-refreshable-nav-menu-1 partial-refreshable-nav-
 menu">
 > }}}
 >
 > The `open` class and `style` attribute is gone.

 I don't think there's anything that Core can do to support this other than
 what has already been done. Take a look at [32807] for a change made to
 Twenty Fifteen to re-initialize the JS-added behaviors once a menu has
 been partially-refreshed. So for your theme to support partial refresh,
 you'd need to include the same:

 {{{#!js
 jQuery( document ).on( 'customize-preview-menu-refreshed', function( e,
 params ) {
     /* params.wpNavArgs has info on which menu item is being refreshed re-
 initialize menus */
 } );
 }}}

 The question then remains as to whether themes should explicitly say they
 support partial-refresh for menus in the Customizer, or if it can be
 enabled by default. Up until now it has seemed that the vast majority of
 themes work fine with it enabled by default. Thoughts?

 BTW, I think the properties on this `params` object may need to be
 revisited. Like, in addition to the `wpNavArgs` object it would be handy
 to have the actual `container` for the nav menu element that was injected.

--
Ticket URL: <https://core.trac.wordpress.org/ticket/32841#comment:5>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform