Changeset 41374 for trunk/tests/qunit/index.html

Timestamp:

09/12/2017 07:02:49 AM (7 years ago)

Author:

westonruter

Message:

Customize: Add global notifications area.

• Displays an error notification in the global area when a save attempt is rejected due to invalid settings. An error notification is also displayed when saving fails due to a network error or server error.
• Introduces wp.customize.Notifications subclass of wp.customize.Values to contain instances of wp.customize.Notification and manage their rendering into a container.
• Exposes the global notification area as wp.customize.notifications collection instance.
• Updates the notifications object on Control to use Notifications rather than Values and to re-use the rendering logic from the former. The old Control#renderNotifications method is deprecated.
• Allows notifications to be dismissed by instantiating them with a dismissible property.
• Allows wp.customize.Notification to be extended with custom templates and render functions.
• Triggers a removed event on wp.customize.Values instances _after_ a value has been removed from the collection.

Props delawski, westonruter, karmatosed, celloexpressions, Fab1en, melchoyce, Kelderic, afercia, adamsilverstein.
See #34893, #39896.
Fixes #35210, #31582, #37727, #37269.

File:

• trunk/tests/qunit/index.html (modified) (2 diffs)

trunk/tests/qunit/index.html

@@ -210 +210 @@
                 <# } ); #>
             </ul>
+        </script>
+        <script type="text/html" id="tmpl-customize-notification">
+            <li class="notice notice-{{ data.type || 'info' }} {{ data.altNotice ? 'notice-alt' : '' }} {{ data.dismissible ? 'is-dismissible' : '' }}" data-code="{{ data.code }}" data-type="{{ data.type }}">
+                {{{ data.message || data.code }}}
+                <# if ( data.dismissible ) { #>
+                    <button type="button" class="notice-dismiss"><span class="screen-reader-text"><?php _e( 'Dismiss' ); ?></span></button>
+                <# } #>
+            </li>
         </script>
 
@@ -387 +395 @@
         <div hidden>
             <div id="customize-preview"></div>
+            <div id="customize-notifications-test"><ul></ul></div>
         </div>