Intl DateTimeFormatOptions Missing Properties

[nikarc]

Hi guys,

I'm using Intl.DateTimeFormat to format some database dates into human readable format. TS is throwing an error:

Argument of type '{ year: string; month: string; day: string; weekday: string; hour: string; minute: string; dayPeriod: string; }' is not assignable to parameter of type 'DateTimeFormatOptions'.
  Object literal may only specify known properties, and 'dayPeriod' does not exist in type 'DateTimeFormatOptions'.  TS2345

    13 |         hour: 'numeric',
    14 |         minute: 'numeric',
  > 15 |         dayPeriod: 'short'
       |         ^
    16 |     });
    17 |     const date = new Date(eventDate);
    18 |     const [

I noticed that the TS documentation here does not reflect all the options present here

I tried searching the issues but i did not see anything about this specifically. Is this known/intentional? Could I make a quick pr to add the options to the DateTimeFormatOptions interface, if not?

Thanks

TypeScript Version: 3.8.3

Search Terms:
DateTimeFormatOptions, DateTimeFormat

Code

    const dtFormatter = new Intl.DateTimeFormat('en-US', {
        year: 'numeric',
        month: 'short',
        day: 'numeric',
        weekday: 'short',
        hour: 'numeric',
        minute: 'numeric',
        dayPeriod: 'short'
    });

Expected behavior:
dayPeriod is exposed in the DateTimeFormatOptions interface

Actual behavior:
Error is thrown because dayPeriod is not present in DateTimeFormatOptions

Playground Link:
playground

[MartinJohns]

#35865

[typescript-bot]

This issue has been marked as a 'Duplicate' and has seen no recent activity. It has been automatically closed for house-keeping purposes.

[casey6]

@RyanCavanaugh I don't believe this is a duplicate as it's talking about adding missing parameters. The referenced ticket proposes using string literal types to match the exact values allowed, which would be a potential breaking change. I think that would be avoided here when adding these missing parameters.

[devbyray]

I'm also experiencing a issue with the fact, dateStyle property is also giving an error.

In the MDN docs we can see the should exist in the DateTimeFormat https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat#Examples

[JorisWillig]

I am also encountering this issue, with the 'timeStyle' and 'dateStyle' options

[costasovo]

Same here with the 'timeStyle' !

[amychang0401]

same here with timeStyle + dateStyle ! Also one odd thing I found was

// SUCCESS with timeStyle and dateStyle 
new Intl.DateTimeFormat('en-US', {
  timeStyle:'short', dateStyle:'short'
}).format(date)
"11/2/20, 12:13 PM" 

// FAILED with additional `hour` option added
new Intl.DateTimeFormat('en-US', {
  hour:'numeric', timeStyle:'short', dateStyle:'short'
}).format(date)
VM788:1 Uncaught TypeError: Invalid option : dateStyle
    at new DateTimeFormat (<anonymous>)
    at <anonymous>:1:1

[dev99problems]

@amychang0401 seems like one odd thing happens because according to the MDN Doc

dateStyle can be used with timeStyle, but not with other options (e.g. weekday, hour, month, etc.)

So while using Intl.DateTimeFormat there are 2 options — to use dateStyle, timeStyle OR any other options, like hour, month, etc.

[64J0]

Bump, still facing this problem...

Argument of type '{ dateStyle: string; timeStyle: string; }' is not assignable to parameter of type 
'DateTimeFormatOptions'.
Object literal may only specify known properties, and 'dateStyle' does not exist in type 
'DateTimeFormatOptions'.

[64J0]

After reading the MDN docs I think that this lack of properties is intencional because Safari doesn't support those configurations, like illustrated in the figure above:

But idk, maybe it has other explanation.

Here is other table with more descritive informations about the options object of Intl that says the same thing:

[Whobeu]

Just noticed an issue with "fractionalSecondDigits". I am using Node v14.16.0 so there is support for it:

Object literal may only specify known properties, and 'fractionalSecondDigits' does not exist in type 'DateTimeFormatOptions'.

Typescript is 4.1.5

I'll work around it but just something else to be added to the library.

[lukepuplett]

Looks like dateStyle and timeStyle are supported in Safari 14.1 is browser support is the reason for the interface being mishapen.

[nstringham]

@RyanCavanaugh can you explain why this was marked as a duplicate

this issue is requesting that new fields be added to DateTimeFormatOptions

#35865 is requesting that existing fields be made more strict

[omonk]

Certainly a TS version issue.

const d = new Intl.DateTimeFormat("en-gb", { timeStyle: "short" })

• 3.8.3
• 4.4.2