Merge pull request #1902 from Automattic/change/datepicker-enqueue-strategy

Standardize datepicker enqueueing logic

Author: jom

includes/admin/class-wp-job-manager-admin.php

@@ -93,8 +93,8 @@ public function admin_enqueue_scripts() {
 			wp_enqueue_style( 'jquery-ui' );
 			wp_enqueue_style( 'select2' );
 			wp_enqueue_style( 'job_manager_admin_css', JOB_MANAGER_PLUGIN_URL . '/assets/css/admin.css', [], JOB_MANAGER_VERSION );
+			wp_enqueue_script( 'wp-job-manager-datepicker' );
 			wp_register_script( 'jquery-tiptip', JOB_MANAGER_PLUGIN_URL . '/assets/js/jquery-tiptip/jquery.tipTip.min.js', [ 'jquery' ], JOB_MANAGER_VERSION, true );
-			wp_enqueue_script( 'job_manager_datepicker_js', JOB_MANAGER_PLUGIN_URL . '/assets/js/datepicker.min.js', [ 'jquery', 'jquery-ui-datepicker' ], JOB_MANAGER_VERSION, true );
 			wp_enqueue_script( 'job_manager_admin_js', JOB_MANAGER_PLUGIN_URL . '/assets/js/admin.min.js', [ 'jquery', 'jquery-tiptip', 'select2' ], JOB_MANAGER_VERSION, true );
 
 			wp_localize_script(
@@ -113,17 +113,6 @@ public function admin_enqueue_scripts() {
 					'search_users_nonce'     => wp_create_nonce( 'search-users' ),
 				]
 			);
-
-			if ( ! function_exists( 'wp_localize_jquery_ui_datepicker' ) || ! has_action( 'admin_enqueue_scripts', 'wp_localize_jquery_ui_datepicker' ) ) {
-				wp_localize_script(
-					'job_manager_datepicker_js',
-					'job_manager_datepicker',
-					[
-						/* translators: jQuery date format, see http://api.jqueryui.com/datepicker/#utility-formatDate */
-						'date_format' => _x( 'yy-mm-dd', 'Date format for jQuery datepicker.', 'wp-job-manager' ),
-					]
-				);
-			}
 		}
 
 		wp_enqueue_style( 'job_manager_admin_menu_css', JOB_MANAGER_PLUGIN_URL . '/assets/css/menu.css', [], JOB_MANAGER_VERSION );

includes/class-wp-job-manager.php

@@ -86,6 +86,7 @@ public function __construct() {
 		add_action( 'widgets_init', [ $this, 'widgets_init' ] );
 		add_action( 'wp_loaded', [ $this, 'register_shared_assets' ] );
 		add_action( 'wp_enqueue_scripts', [ $this, 'frontend_scripts' ] );
+		add_action( 'wp_footer', [ $this, 'maybe_localize_jquery_ui_datepicker' ], 1 );
 		add_action( 'admin_init', [ $this, 'updater' ] );
 		add_action( 'admin_init', [ $this, 'add_privacy_policy_content' ] );
 		add_action( 'wp_logout', [ $this, 'cleanup_job_posting_cookies' ] );
@@ -251,6 +252,9 @@ public function register_shared_assets() {
 
 		$jquery_version = isset( $wp_scripts->registered['jquery-ui-core']->ver ) ? $wp_scripts->registered['jquery-ui-core']->ver : '1.9.2';
 		wp_register_style( 'jquery-ui', '//code.jquery.com/ui/' . $jquery_version . '/themes/smoothness/jquery-ui.min.css', [], $jquery_version );
+
+		// Register datepicker JS. It will be enqueued if needed when a date field is used.
+		wp_register_script( 'wp-job-manager-datepicker', JOB_MANAGER_PLUGIN_URL . '/assets/js/datepicker.min.js', [ 'jquery', 'jquery-ui-datepicker' ], JOB_MANAGER_VERSION, true );
 	}
 
 	/**
@@ -261,6 +265,21 @@ public static function register_select2_assets() {
 		wp_register_style( 'select2', JOB_MANAGER_PLUGIN_URL . '/assets/js/select2/select2.min.css', [], '4.0.10' );
 	}
 
+	/**
+	 * WordPress localizes this script late in `wp_head`. We sometimes enqueue the datepicker later on.
+	 *
+	 * @access private
+	 * @since 1.34.1
+	 */
+	public function maybe_localize_jquery_ui_datepicker() {
+		// Check if this data has already been added. Prevents outputting localization data multiple times.
+		if ( wp_scripts()->get_data( 'jquery-ui-datepicker', 'after' ) ) {
+			return;
+		}
+
+		wp_localize_jquery_ui_datepicker();
+	}
+
 	/**
 	 * Registers and enqueues scripts and CSS.
 	 *

includes/forms/class-wp-job-manager-form-submit-job.php

@@ -465,32 +465,16 @@ protected function validate_fields( $values ) {
 	protected function enqueue_job_form_assets() {
 		wp_enqueue_script( 'wp-job-manager-job-submission' );
 		wp_enqueue_style( 'wp-job-manager-job-submission', JOB_MANAGER_PLUGIN_URL . '/assets/css/job-submission.css', [], JOB_MANAGER_VERSION );
-
-		// Register datepicker JS. It will be enqueued if needed when a date.
-		// field is rendered.
-		wp_register_script( 'wp-job-manager-datepicker', JOB_MANAGER_PLUGIN_URL . '/assets/js/datepicker.min.js', [ 'jquery', 'jquery-ui-datepicker' ], JOB_MANAGER_VERSION, true );
-
-		// Localize scripts after the fields are rendered.
-		add_action( 'submit_job_form_end', [ $this, 'localize_job_form_scripts' ] );
 	}
 
 	/**
 	 * Localize frontend scripts that have been enqueued. This should be called
 	 * after the fields are rendered, in case some of them enqueue new scripts.
+	 *
+	 * @deprecated 1.34.1 No longer needed.
 	 */
 	public function localize_job_form_scripts() {
-		if ( function_exists( 'wp_localize_jquery_ui_datepicker' ) ) {
-			wp_localize_jquery_ui_datepicker();
-		} else {
-			wp_localize_script(
-				'wp-job-manager-datepicker',
-				'job_manager_datepicker',
-				[
-					/* translators: jQuery date format, see http://api.jqueryui.com/datepicker/#utility-formatDate */
-					'date_format' => _x( 'yy-mm-dd', 'Date format for jQuery datepicker.', 'wp-job-manager' ),
-				]
-			);
-		}
+		_deprecated_function( __METHOD__, '1.34.1' );
 	}
 
 	/**