Changeset 36796

Timestamp:

03/01/2016 10:03:27 PM (9 years ago)

Author:

westonruter

Message:

Customize: Ensure autofocus deep-linking applies for dynamically-created panels, sections, and controls.

Removes overly-zealous filtering of autofocus panels, sections, and controls which are unrecognized or for which the user doesn't have the capability to focus (in which case it would no-op anyway). Also defers autofocus logic until instances are created, even after initial ready event. This ensures that autofocus can apply for any panels, sections, or controls that get created via the loaded preview.

See #28650.
Fixes #36018.

Location:

trunk/src

Files:

• wp-admin/js/customize-controls.js (modified) (1 diff)
• wp-includes/class-wp-customize-manager.php (modified) (2 diffs)

trunk/src/wp-admin/js/customize-controls.js

@@ -3469 +3469 @@
 
         // Focus the autofocused element
-        _.each( [ 'panel', 'section', 'control' ], function ( type ) {
-            var instance, id = api.settings.autofocus[ type ];
-            if ( id && api[ type ]( id ) ) {
-                instance = api[ type ]( id );
-                // Wait until the element is embedded in the DOM
-                instance.deferred.embedded.done( function () {
-                    // Wait until the preview has activated and so active panels, sections, controls have been set
-                    api.previewer.deferred.active.done( function () {
+        _.each( [ 'panel', 'section', 'control' ], function( type ) {
+            var id = api.settings.autofocus[ type ];
+            if ( ! id ) {
+                return;
+            }
+
+            /*
+             * Defer focus until:
+             * 1. The panel, section, or control exists (especially for dynamically-created ones).
+             * 2. The instance is embedded in the document (and so is focusable).
+             * 3. The preview has finished loading so that the active states have been set.
+             */
+            api[ type ]( id, function( instance ) {
+                instance.deferred.embedded.done( function() {
+                    api.previewer.deferred.active.done( function() {
                         instance.focus();
                     });
                 });
-            }
+            });
         });
 

trunk/src/wp-includes/class-wp-customize-manager.php

@@ -1729 +1729 @@
             'sections' => array(),
             'nonce'    => $this->get_nonces(),
-            'autofocus' => array(),
+            'autofocus' => $this->get_autofocus(),
             'documentTitleTmpl' => $this->get_document_title_template(),
             'previewableDevices' => $this->get_previewable_devices(),
@@ -1751 +1751 @@
                     }
                 }
-            }
-        }
-
-        // Pass to front end the Customizer construct being deeplinked.
-        foreach ( $this->get_autofocus() as $type => $id ) {
-            $can_autofocus = (
-                ( 'control' === $type && $this->get_control( $id ) && $this->get_control( $id )->check_capabilities() )
-                ||
-                ( 'section' === $type && isset( $settings['sections'][ $id ] ) )
-                ||
-                ( 'panel' === $type && isset( $settings['panels'][ $id ] ) )
-            );
-            if ( $can_autofocus ) {
-                $settings['autofocus'][ $type ] = $id;
             }
         }