Intl.DisplayNames options object type needs to be split

[tchetwin]

Bug Report

🔎 Search Terms

DisplayNames, Intl, locale

🕗 Version & Regression Information

The behaviour was altered in TypeScript 4.6.2, but it was differently incorrect prior to that:

• Originally introduced in Intl 2021 Updates #45647, merged 8th Sep -> 4.5 (probably)
• An Issue reported in Intl.DisplayNamesOptions missing property locale #46845, resulted in fix(46845): Add missing "locale" field to Intl.DisplayNamesOptions #46849, merged 3rd Jan -> 4.6

⏯ Playground Link

Playground link with relevant code

💻 Code

const displayNameOptions: Partial<Intl.DisplayNamesOptions> = {
    type: "language",
    // @ts-expect-error - this should *not* be valid. The Intl API seems to cope with excess properties
    locale: "en-GB",
};

const i = new Intl.DisplayNames(["tr"], displayNameOptions);

const resolvedOptions = i.resolvedOptions();
console.log(resolvedOptions); // prints an object containing `locale`, `style`, `type`, `fallback`, `languageDisplay`

// This should be valid
resolvedOptions.languageDisplay;

// @ts-expect-error - this should not be valid
const localMatcher = resolvedOptions.localeMatcher;
console.log(localMatcher); // prints `undefined`

🙁 Actual behavior

Type errors in the above code for valid patterns, no type errors for invalid patterns.

🙂 Expected behavior

Only valid type errors, accurate representation of the API

Notes

The DisplayNamesOptions interface:

TypeScript/src/lib/es2020.intl.d.ts

Lines 294 to 300 in a4f5555

	interface DisplayNamesOptions {
	locale: UnicodeBCP47LocaleIdentifier;
	localeMatcher: RelativeTimeFormatLocaleMatcher;
	style: RelativeTimeFormatStyle;
	type: "language" | "region" | "script" | "currency";
	fallback: "code" | "none";
	}

...is currently shared by Intl.DisplayNames() constructor, and Intl.DisplayNames.prototype.resolvedOptions(). While the underlying objects share several properties, they are not a perfect match as the types suggest.

Per MDN:

• Intl.DisplayNames() constructor should accept an object with (Partial<>):
  • localeMatcher
  • style
  • type
  • languageDisplay
  • fallback
• Intl.DisplayNames.prototype.resolvedOptions() should return an object with:
  • locale
  • style
  • type
  • fallback

ECMA-402 links:

• Intl.DisplayNames() constructor
• Intl.DisplayNames.prototype.resolvedOptions()

Shoutout to @mkubilayk who spotted this during our TypeScript update!

Suggested Fix

These types are not compatible, suggesting they should be split into something like (bikeshed) DisplayNamesOptions and DisplayNamesResolvedOptions.

Probably a Good First Issue™

[tchetwin]

CC: @gfyoung

[gfyoung]

Thanks @tchetwin for filing this: just opened a PR to update these.