Async Functions

[adaliszk]

targeting es6 the compile removes all the async keywords from functions an leaves the await in place, transformed into a variable. Since that's not created it is a ReferenceError and the whole function just fails.

• The quickest solution would be to remove all await; from the function contents
• The actual solution would be to detect async functions, ether wrap it with Promise or just use as it should be used if the target is es6

[Buslowicz]

Could you provide an example where it removes the async? So I know more about the use case you are talking about.

[adaliszk]

@customElement()
export class MyElement extends Polymer.Element {
    async ready() {
        await this._initialize();
    }

    async _initialize() {
        /* ... */
    }
}

will generate in the current state:

/* ... */
ready: function() {
    await; // <- ReferenceError
    this._initialize();
}
/* ... */

[adaliszk]

it also does wrongly with assigments:

const something = await this.doSomething();

will generate:

var something = await;
this.doSomething();

[Buslowicz]

Got it, I will try to figure out the best way to get around it. Just removing await isn't the best thing as it will break the functionality someone wanted. For Polymer 2 it will be easy as I will just pass the async as is. Polymer 1 will be more tricky, as I am not sure how well will it play with native Polymer markup. Also, I will fix the await being treated as a separate expression :).

[adaliszk]

Well yes, depending on the target if ES6 then leave it as it is. If less than that you can just remove the async and await, that should do the same in functionality. The problem could be when someone not calling an async function just calling a Promise like fetch, that way you have to convert back to the Promse.then... format.

[Buslowicz]

Removing the async/await means making something that was supposed to be asynchronous to work synchronously, which is a bad thing :P. I will let tsc compiler to change it to promises, just need to work out how to keep it with native Polymer 1 syntax.

[adaliszk]

I know that's a downgrade but technically it will work just as it were written in synchronous based on syntax. My blocking issue that the compile now creates syntax errors. First quick fix could be a fix to make it work then you can focus how to convert the format into async on older browsers.

Personally I wont bother for older browsers, the async workflow is a progressive enhancement.

[Buslowicz]

A quick fix will be just making it all work with async transpiled down to promises whatever the target is. After that, an enhancement will be making it Polymer 1 native code, if it makes problems for polymer toolset to recognize it.