Date.prototype.toLocaleString missing default time components for ECMA-402

[ricmatsui]

Which package?

@formatjs/intl-datetimeformat@6.10.3

Describe the bug

The polyfill for Date.prototype.toLocaleString differs from the ECMA-402 Intl specifications on whether time components are included by default. The polyfill does not include any time components by default when it should.

To Reproduce

Codesandbox URL

N/A

Reproducible Steps/Repo

Here is a test case to reproduce the issue:

diff --git a/packages/intl-datetimeformat/tests/format.test.ts b/packages/intl-datetimeformat/tests/format.test.ts
index fb2c1b0d..54227ce6 100644
--- a/packages/intl-datetimeformat/tests/format.test.ts
+++ b/packages/intl-datetimeformat/tests/format.test.ts
@@ -317,7 +317,13 @@ describe('toLocaleString', function () {
       expect(toLocaleString(new Date(TS), 'en', options)).toBe(en)
     })
   })
+
+  it('includes default time components', function () {
+    const date1 = new Date(1592265600000);
+    expect(toLocaleString(date1, 'en')).toBe('6/16/2020, 12:00:00 AM')
+  })
 })

Output:

 ● toLocaleString › includes default time components

    expect(received).toBe(expected) // Object.is equality

    Expected: "6/16/2020, 12:00:00 AM"
    Received: "6/16/2020"

Expected behavior

The default time components of "hour", "minute", and "second" are included when calling Date.prototype.toLocaleString without any time components specified.

> console.log(new Date(1592265600000).toLocaleString('en'));
6/16/2020, 12:00:00 AM

ECMA-402 specifies Date.prototype.toLocaleString should create a date format with all default components when none are specified

https://tc39.es/ecma402/#sup-date.prototype.tolocalestring

3. Let dateFormat be ? CreateDateTimeFormat(%DateTimeFormat%, locales, options, any, all).

https://tc39.es/ecma402/#sec-createdatetimeformat

• If needDefaults is true and defaults is either time or all, then
  • For each property name prop of « "hour", "minute", "second" », do
    • Set formatOptions.[[<prop>]] to "numeric".

MDN Web Docs also describe this expected behavior:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString#parameters

If weekday, year, month, day, dayPeriod, hour, minute, second, and fractionalSecondDigits are all undefined, then year, month, day, hour, minute, second will be set to "numeric".

Screenshots

N/A

Desktop (please complete the following information):

• OS: N/A
• Browser N/A
• Version N/A

Smartphone (please complete the following information):

• Device: Pixel 3 Emulator
• OS: Android 12
• Browser React Native, Hermes disabled
• Version 0.68.7

Additional context

rrule package requires Intl support for timezones and refers users to formatjs polyfill https://github.com/jkbrzt/rrule#timezone-support . However, when rrule uses the polyfill .toLocaleString, the time components are not included, which causes this rrule function to fail:
https://github.com/jkbrzt/rrule/blob/dae185cd213a0b2a9575fbf4b6cbe3055b55c4b9/src/dateutil.ts#L205-L210

const dateTZtoISO8601 = function (date: Date, timeZone: string) {
  // date format for sv-SE is almost ISO8601
  const dateStr = date.toLocaleString('sv-SE', { timeZone })
  // '2023-02-07 10:41:36'
  return dateStr.replace(' ', 'T') + 'Z'
}

Related issue #2996

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.