[wp-trac] [WordPress Trac] #50040: Localize the jQuery datepicker when enqueued in the footer

[WordPress Trac]

#50040: Localize the jQuery datepicker when enqueued in the footer
-------------------------------------------------+-------------------------
 Reporter:  jadpm                                |       Owner:  (none)
     Type:  defect (bug)                         |      Status:  new
 Priority:  normal                               |   Milestone:  Awaiting
                                                 |  Review
Component:  I18N                                 |     Version:
 Severity:  normal                               |  Resolution:
 Keywords:  needs-patch good-first-bug           |     Focuses:
  reporter-feedback                              |
-------------------------------------------------+-------------------------

Comment (by changwoo):

 Hello,

 Following up on @gautam23's comment, I created a plugin to confirm if
 localization is correctly performed in the footer.

 Below is the plugin code I wrote and tested.

 **Environment Tested On:**
     WordPress Version: 6.9
     PHP Version: 8.3


 **Steps to Reproduce/Test:**
 1. Log in as an Administrator and activate the 'Issue #50040' plugin.
 2. Please ensure you download the jQuery UI CSS file separately (as it is
 required for the Datepicker).
 3. A new menu item, 'Issue #50040', will be created. Click this menu to
 navigate to the test page.
 4. You should see the Datepicker visible on the page.
 5. In the plugin code, you can adjust the constant value
 ISSUE_50040_FOOTER to control whether the JavaScript code is enqueued in
 the header or the footer.

 **My Finding:**
 I confirmed that the output is correctly displayed in my language (Korean)
 regardless of whether the script is enqueued in the header or the footer.

 https://imgur.com/e9AICLB

 {{{#!php
 <?php
 /**
  * Plugin Name: Issue #50040
  * Description: <a
 href="https://core.trac.wordpress.org/ticket/50040">WordPress Core issue
 #50040</a>
  */

 const ISSUE_50040_FOOTER = true;

 add_action( 'init', 'issue_50040_init' );

 function issue_50040_init(): void {
         add_action( 'admin_menu', 'issue_50040_admin_menu' );
         add_action( 'admin_enqueue_scripts',
 'issue_50040_admin_enqueue_scripts' );
 }

 function issue_50040_admin_menu(): void {
         add_menu_page(
                 page_title: 'Issue #5540',
                 menu_title: 'Issue #50040',
                 capability: 'administrator',
                 menu_slug: 'issue_50040',
                 callback: 'issue_50040_output_page'
         );
 }

 function issue_50040_output_page(): void {
         echo '<div id="issue-50040"><h3>OKAY</h3><div
 id="issue-50040-datepicker"></div></div>';
 }

 function issue_50040_admin_enqueue_scripts( string $hook ): void {
         if ( 'toplevel_page_issue_50040' === $hook ) {
                 if ( ISSUE_50040_FOOTER ) {
                         // footer
                         wp_enqueue_script( 'jquery-ui-datepicker', args: [
 'in_footer' => true] );
                         wp_enqueue_script(
                                 'issue-50040',
                                 plugins_url( 'script.js', __FILE__ ),
                                 [ 'jquery', 'jquery-ui-datepicker' ],
                                 args: [ 'in_footer' => true ]
                         );
                 } else {
                         // header
                         wp_enqueue_script( 'jquery-ui-datepicker' );
                         wp_enqueue_script(
                                 'issue-50040',
                                 plugins_url( 'script.js', __FILE__ ),
                                 [ 'jquery', 'jquery-ui-datepicker' ]
                         );
                 }

                 // CSS does not matter.
                 wp_enqueue_style(
                         'issue-50040-datepicker',
                         plugins_url( 'jquery-ui.css', __FILE__ ),
                         [],
                         '1.13.3'
                 );
                 wp_enqueue_style( 'issue-50040', plugins_url( 'style.css',
 __FILE__ ) );
         }
 }
 }}}

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