WP_Customize_Date_Time_Control class - date format ignores day of the month suffix (S)

[F.Ilona]

When adding a date time control to the customizer using the WP_Customize_Date_Time_Control class with the add_control() method, the character for the day of the month suffix (S) is not replaced/stripped when formatting the date and gets displayed in the customizer.

See attached image.

Like other date formatting characters, the suffix should either be replaced with the get_option( 'date_format' ) value or be removed completely.

[F.Ilona]

preview of the day suffix being displayed in the customizer

[dlh]

Hi @filona, and welcome to WordPress Trac! Thanks for submitting this report.

46596.diff​ would add some special handling to WP_Customize_Date_Time_Control for a date_format with jS. Are you able to test the patch against your use case?

[ozgursar]

Reproduction Report

Environment

• WordPress: 7.0-alpha-61215-src
• PHP: 8.2.29
• Server: nginx/1.29.4
• Database: mysqli (Server: 8.4.7 / Client: mysqlnd 8.2.29)
• Browser: Chrome 144.0.0.0
• OS: macOS
• Theme: Twenty Twenty-One 2.7
• MU Plugins: None activated
• Plugins:
  • Code Snippets 3.9.4
  • Test Reports 1.2.1

Steps taken

1. Choose any classic theme
2. Add the following snippet via Code Snippets plugin or via functions.php

/**
 * Test for WP_Customize_Date_Time_Control date format bug
 */
add_action( 'customize_register', function( $wp_customize ) {
    // Add a test section
    $wp_customize->add_section( 'test_datetime_section', array(
        'title'    => 'Date Time Test',
        'priority' => 30,
    ) );

    // Add a test setting
    $wp_customize->add_setting( 'test_datetime_setting', array(
        'default'   => current_time( 'Y-m-d H:i:s' ),
        'transport' => 'postMessage',
    ) );

    // Add the Date Time Control
    $wp_customize->add_control( new WP_Customize_Date_Time_Control( $wp_customize, 'test_datetime_control', array(
        'label'       => 'Test Date Time Control',
        'section'     => 'test_datetime_section',
        'settings'    => 'test_datetime_setting',
        'description' => 'Check the date format issue for the S suffix',
    ) ) );
} );

3. Change the date/time format to check for dd/mm/yyy or mm/dd/yyyy formats separately
4. Go to Appearance > Customize > Date Time Test
5. View the date field for the S suffix
6. ❌ Bug is not occurring

Expected behavior

• According to the ticket information S suffix should have displayed next to date field but it did not appear.

Screenshots/Screencast with results