Got TS 2739 error while returning value from promise. Type 'Promise<any>' is missing the following properties from type

user_8931607 0
Viewed 656

Currently I'm writing code for request login to server and receive it's session data and send to global context.

Basic principle is 1)Request and get Promise 2)Validate fetch result itself and response status. 3)Provide value to external component. And I'm working on 1) and 2).

But I got an error about data typing Type 'Promise<any>' is missing the following properties from type 'SessionInfo': userEmail, userName, sessionToken, duets(2739) at code that returns result data to external components. Despite of strict data typing(Maybe I think), I'm not sure why linter says Promise not Promise>. I think TS fails to assert it's type.

When I run very similar code with Javascript(without typing), it works in past. I'm not sure why this happens and I don't know what's wrong. Can you check my code?

Codes are below, there's 4 files -- interface definition file related to User, interface definition for handling response json, Actual request fetch, Response validation and evaluation.

When I checked linting at return res.data at actionHandler.ts, linter succeed to predict it's type. res.data is ResponseSet<SessionInfo>.data?: userTypes.SessionInfo as linter said.

In userTypes.ts


export interface SessionInfo {
    userEmail: string,
    userName: string,
    sessionToken: string,
    due: number,
}

In commonTypes.ts

export interface ResponseSet<T> { // Response wrapper when it returns with code 200
    statusCode: ResponseStatusCode, // ResponseStatusCode is custom typed status code not for request it self.
    data?: T,
    description?: string,
};

In userReq.ts

const login = async (email: string, password: string): Promise<commonTypes.ResponseSet<userTypes.SessionInfo>> => {
    try {
        const request: Request = new Request(
            composeUri(`user/login`, { email, password }),
            {
                method: 'GET',
                headers: { 'Content-type': 'application/json' },
                mode: 'cors',
            }
        );

        const response: Response = await fetch(request);
        if (response.status != 200) throw response.status;

        return await response.json();

    } catch {
        return {
            statusCode: 1,
        };
    }
}

In actionHandler.ts

export const doLogin = (email: string, password: string): userTypes.SessionInfo => {
    const result: userTypes.SessionInfo = userReq.login(email, password)
        .then(res => {
            if (res.statusCode != 0) throw new Error(res.description || 'UnknownError');
            return res.data;
        })
        .catch(err => {
            return null;
        });
    return result;
}

Where I got an error is const result:.... I got Type 'Promise<any>' is missing the following properties from type 'SessionInfo': userEmail, userName, sessionToken, due ts(2739). I'm not sure why it is recognized as 'Promise` despite of strict type definition of my code.

promise typescript node.js
1 Answers

the issue is that result isn't SessionInfo. It is a Promise of it.

const result: Promisse<userTypes.SessionInfo | null>;

doLogin is async due to used promise, you should follow async await inside and it can't return userTypes.SessionInfo, result will be a promise.

export const doLogin = async (email: string, password: string): Promise<userTypes.SessionInfo | null> => {
  try {
    const result: commonTypes.ResponseSet<userTypes.SessionInfo> = await userReq.login(email, password);
    if (res.statusCode != 0) throw new Error(res.description || 'UnknownError');
  } catch (e) {
    return null;
  }
  return res.data;
}

// somewhere in the code (async env)
await doLogin(email, password);
user_131120180
Related