Promise resolution type cannot be inferred inside a function with conditional types

[AmirAsghary]

Bug Report

🔎 Search Terms

conditional, generic

🕗 Version & Regression Information

03/12/2022

• This is a crash
• This is the behavior in every version I tried, and I reviewed the FAQ for entries about common bugs that aren't bugs

⏯ Playground Link

Playground link with relevant code

💻 Code

type Base64Data = FileReader['result'];

// fill-in for actual functions
function base64ToFile (x: any) { return new File([], ''); }
function fileModifier (y: File) { return new Promise<Blob>(res => res('' as unknown as Blob)); }

export function downsizeImageFile<T extends boolean = false>(
  imgFile: File,
  preserveBase64?: T,
  maxSize = 640
): Promise<T extends true ? Base64Data : File> {
  return new Promise(async resolve => {
      const resizedBlob = await fileModifier(imgFile);
      const reader = new FileReader();
      reader.readAsDataURL(resizedBlob);

      reader.onloadend = () => {
        resolve(preserveBase64 ? reader.result : base64ToFile(base64file)); // problem: the correct type cannot be inferred from the conditional statement
      };
  });
}

export async function downsizeImage<T extends boolean = false>(
  base64Img: Base64Data,
  preserveBase64?: T,
  maxSize = 640
): Promise<T extends true ? Base64Data : File> {
  return downsizeImageFile(base64ToFile(base64Img), preserveBase64, maxSize);
}

🙁 Actual behavior

The promise resolution type is not inferred correctly from the conditional statement.

🙂 Expected behavior

The promise resolution type must be Base64Data if the preserveBase64 argument is true, otherwise it must be File

[MartinJohns]

Resolving of conditional types is deferred when they involve unbound generic types. This is a design limitation. You should use overloads instead in this case.

[Zamralik]

To expand on @MartinJohns reply, it's better to narrow the return type and widen the input type than the opposite.

async function downsizeImage(source: File|Base64Data, maxSize:number = 640): Promise<Base64Data>
{
	if (!(source instanceof File))
	{
		source = base64ToFile(source);
	}

	const resizedBlob = await fileModifier(source);
	const reader = new FileReader();
	reader.readAsDataURL(resizedBlob);

	const loadend_promise = new Promise<void>(
		(resolve) =>
		{
			reader.onloadend = () =>
			{
				resolve();
			};
		}
	);

	await loadend_promise;

	return reader.result;
}

async function downsizeImageFile(source: File|Base64Data, maxSize:number = 640): Promise<File>
{
	const data: Base64Data = await downsizeImage(source, maxSize);

	return base64ToFile(data);
}