7

I'm trying to cancel my async method call in Typescript.

To do this, I have created a new Promise type, which inherits from Promise:

class CancelablePromise<T> extends Promise<T>{

    private cancelMethod: () => void;
    constructor(executor: (resolve: (value?: T | PromiseLike<T>) => void, reject: (reason?: any) => void) => void, cancelMethod: () => void) {
        super(executor);
        this.cancelMethod = cancelMethod;
    }

    //cancel the operation
    public cancel() {
        if (this.cancelMethod) {
            this.cancelMethod();
        }
    }
}

But when I'm trying to use it:

async postFileAjax<T>(file: File): CancelablePromise<T> { ... }

I get the error:

Error Build:Type 'typeof CancelablePromise' is not a valid async function return type in ES5/ES3 because it does not refer to a Promise-compatible constructor value.

If I using the type declaration and return the CancelablePromise, like this then it compiles:

async postFileAjax<T>(file: File): Promise<T>  { 
     ...
     return CancelablePromise(...);
}

What am I doing wrong? I see that in ES6 you could subclass the Promise (see stackoverflow question), so I would expect it also in TypeScript.

Using Typescript 2.1 and targeting es5

Community
  • 1
  • 1
Julian
  • 26,655
  • 14
  • 92
  • 132
  • You can't extend built-in types unless you target `es6` (or above) – Nitzan Tomer Apr 10 '17 at 15:50
  • if you have a reference for that, then that's the accepted answer ;) – Julian Apr 10 '17 at 16:04
  • Try this one: [Extending from Error doesn't work when emitting ES5](https://github.com/Microsoft/TypeScript/issues/10166) – Nitzan Tomer Apr 10 '17 at 16:30
  • I split the compile and runtime error. Compile error has been solved, now runtime error: http://stackoverflow.com/questions/43420175/typescript-subclass-extend-of-promise-gives-typeerror-undefined-is-not-a-prom – Julian Apr 14 '17 at 22:47
  • Again, you cannot simply extend native types when targeting `es5`. Notice that when you target `es6` then the resulting code is different, it uses `es6` classes which makes the inheritance work. – Nitzan Tomer Apr 15 '17 at 00:47
  • 1
    What you should probably do is to implement `PromiseLike` instead of extending `Promise` – Nitzan Tomer Apr 15 '17 at 00:55
  • Then i am missing methods? Any way, I think this compilation issue has been solved (see my own answer). – Julian Apr 15 '17 at 07:55

1 Answers1

11

The error message wasn't fully clear to me at first, but the signature of the constructor should be completely the same as the constructor of Promise.

I've removed the cancelMethod from the constructor and will set it later. This works:

class CancelablePromise<T> extends Promise<T>{

    public cancelMethod: () => void;
    constructor(executor: (resolve: (value?: T | PromiseLike<T>) => void, reject: (reason?: any) => void) => void) {
        super(executor);

    }

    //cancel the operation
    public cancel() {
        if (this.cancelMethod) {
            this.cancelMethod();
        }
    }
}

and call:

async postFileAjax<T>(file: File): CancelablePromise <T> { 

    var promiseFunc = (resolve) => { resolve() };
    var promise = new CancelablePromise<T>(promiseFunc);
    promise.cancelMethod = () => { console.log("cancel!") };

    return promise;
}
Julian
  • 26,655
  • 14
  • 92
  • 132