Typescript ES7 descriptors with ES3 output?

Question

After looking through the issues it seems TS should support ES3 with decorators, and I have a scenario where I have an existing codebase in typescript which uses decorators and targets ES5 but I now need to apparently support IE6 which requires ES3.

Now according to: https://github.com/Microsoft/TypeScript/issues/4681

It seems that ES3 should be supported, but if I output to target ES3 I get:

error TS1241: Unable to resolve signature of method decorator when called as an expression. Supplied parameters do not match any signature of call target.

I get 0 errors and everything works in ES5, so do you need to do anything to get it working in ES3 or is it just not supported?

Here is a cloud 9 example of the issue:

https://ide.c9.io/grofit/knockout-decorators-es3-example

just run gulp on the command line, if you change the tsconfig target to es5 it will work.

Answer 1

It looks like when you target ES3, method decorators are not properly supported, or not supported at all. Unfortunately, the error message you get isn't super helpful. Looks like there was some discussion about the error message. Also, it isn't clear to me if they intended partial support for decorators when targeting ES3 or full support.

For example, if you try to use a method decorator targeting ES3:

function myMethodDecorator(target: Object, propertyKey: string, descriptor: TypedPropertyDescriptor<any>): TypedPropertyDescriptor<any> {
    // do something
    return descriptor;
};

class MyClass {
    @myMethodDecorator
    myMethod(arg: string) { 
        return "Message -- " + arg;
    }
}

You get the error message you reported:

error TS1241: Unable to resolve signature of method decorator when called as an expression. Supplied parameters do not match any signature of call target.

But if you try to apply a property descriptor, despite the fact that you are applying it to a method, the compiler is strangely OK with that. This compiles targeting ES3 without errors:

function myPropertyDecorator(target: Object, propertyKey: string): void {
    // something
};

class MyClass {
    @myPropertyDecorator
    myMethod(arg: string) { 
        return "Message -- " + arg;
    }
}

However, you can get it to compile to ES3 when using method decorators by:

let myMethodDecorator: any = function(target: Object, propertyKey: string, descriptor: TypedPropertyDescriptor<any>): TypedPropertyDescriptor<any> {
    // do something
    return descriptor;
};

class MyClass {
    @myMethodDecorator
    myMethod(arg: string) { 
        return "Message -- " + arg;
    }
}