Add ability to target es5 and still use generators for async/await

[born2net]

I am targeting es5 in my tsconfig and so when I transpile with tsc I get the long (non generators) version of async / await. So I figured if I added to my tsconfig the following:

 "lib": [
    "dom",
    "es5",
    "es2015.promise",
    "es2015.generator",
    "es2015.core",
    "es2015.collection",
    "es2015.iterable",
    "es2015.promise",
    "es2015.proxy",
    "es2015.reflect",
    "es2015.generator",
    "es2015.symbol",
    "es2015.symbol.wellknown"

so I hoped TS will see that my browser supports generators and thus will take advantage of them, but still I get the longer format of async / await...

is this a bug? missing feature?

regards,

Sean

[mhegazy]

use typescript@2.1, and set --target ES5 along with your --lib values above. see https://github.com/Microsoft/TypeScript/wiki/What%27s-new-in-TypeScript#downlevel-async-functions for more details.

[born2net]

yes that is exactly what I did with ts 2.1.1 and yet my js file is created with:

System.register(["zone.js/dist/zone", "reflect-metadata", "@angular/router", "./App.routes", "@angular/platform-browser-dynamic", "@angular/forms", "@angular/core", "platform", "jspm_packages/github/twbs/bootstrap@3.3.6", "twbs/bootstrap/dist/css/bootstrap.css!", "ng2-toastr/bundles/ng2-toastr.min.css!", "primeng/resources/themes/omega/theme.css!", "primeng/resources/primeng.min.css!", "./styles/style.css!", "./styles/StyleService", "./services/AppInjService", "./services/LocalStorage", "./services/StoreService", "./business/BusinessAction", "./reseller/ResellerAction", "./comps/app1/orders/OrdersAction", "./comps/app1/orders/OrdersReducer", "./stations/StationsAction", "@angular/http", "../src/services/CommBroker", "../src/comps/filemenu/Filemenu", "../src/comps/filemenu/FilemenuItem", "./comps/logo/Logo", "./comps/footer/Footer", "../src/Conts", "angular2-redux-util", "./Lib", "./services/CreditService", "rxjs/add/operator/map", "rxjs/add/operator/debounceTime", "rxjs/add/observable/fromEvent", "rxjs/add/observable/forkJoin", "rxjs/add/operator/distinctUntilChanged", "rxjs/add/operator/catch", "rxjs/add/operator/finally", "rxjs/add/observable/throw", "rxjs/add/operator/switchMap", "rxjs/add/operator/retry", "rxjs/add/operator/mergeMap", "rxjs/add/operator/merge", "rxjs/add/operator/do", "./appdb/NotifyReducer", "./appdb/AppdbReducer", "./business/BusinessReducer", "./reseller/ResellerReducer", "./adnet/AdnetReducer", "./stations/StationsReducer", "./appdb/AppdbAction", "./comps/logo/LogoCompany", "rxjs/Rx", "angular2-google-maps/core/core.umd.js", "./adnet/AdnetActions", "./services/AuthService", "@angular/platform-browser", "./comps/simplelist/Simplelist", "./comps/app1/orders/Orders", "./comps/app1/users/UsersDetails", "./comps/entry/LoginPanel", "./comps/sidemenu/Menu", "./comps/sidemenu/MenuItem", "./comps/app1/whitelabel/Whitelabel", "./comps/app1/apps/Apps", "./comps/app1/privileges/Privileges", "./comps/app1/dashboard/Dashboard", "./comps/logout/Logout", "./comps/tabs/tabs", "./comps/tabs/tab", "./comps/app1/account/Account", "./comps/blurforwarder/BlurForwarder", "./comps/loading/Loading", "./comps/inputedit/InputEdit", "./comps/app1/users/Users", "./comps/app1/adnet/Adnet", "./comps/app1/App1", "./comps/app1/adnet/rates/RatesTable/RatesTable", "./comps/app1/adnet/config/AdnetConfigCustomer", "./comps/app1/adnet/config/AdnetConfig", "./comps/app1/adnet/targets/AdnetConfigTargets", "./comps/app1/adnet/rates/AdnetConfigRates", "./comps/ng2-bs3-modal/ng2-bs3-modal", "./comps/infobox/Infobox", "./comps/app1/dashboard/StationsGrid", "./comps/app1/dashboard/StationsMap", "./comps/app1/dashboard/ServerAvg", "./comps/app1/dashboard/ServerStats", "./comps/app1/dashboard/StationDetails", "./comps/ng2-highcharts/src/directives/ng2-highcharts", "./comps/app1/dashboard/StationSnapshot", "./comps/app1/orders/OrderDetails", "./comps/app1/privileges/PrivilegesDetails", "./comps/app1/users/UserStorage", "./comps/app1/users/ChangePass", "./comps/modaldialog/ModalDialog", "./comps/app1/users/UserInfo", "./comps/app1/users/AddUser", "./comps/app1/users/SampleList", "./comps/imgloader/ImgLoader", "./comps/ng2-highcharts/src/directives/ng2-highmaps", "./comps/ng2-highcharts/src/directives/ng2-highstocks", "./comps/simplelist/SimplelistEditable", "./pipes/OrderBy", "./pipes/SortBy", "./pipes/FilterPipe", "./comps/app1/adnet/targets/AdnetConfigTargetStations", "./comps/app1/adnet/targets/AdnetConfigTargetProps", "./comps/app1/adnet/targets/AdnetLocation", "./comps/mapaddress/MapAddress", "./comps/app1/adnet/network/AdnetNetwork", "./comps/app1/adnet/network/AdnetNetworkPackageEditor", "./comps/app1/adnet/network/AdnetNetworkCustomerSelector", "./comps/app1/adnet/network/AdnetNetworkPackageViewer", "./comps/app1/adnet/network/AdnetNetworkPackageProps", "./comps/app1/adnet/network/AdnetNetworkPackageContent", "./comps/app1/adnet/network/AdnetNetworkPackageContentProps", "./comps/app1/adnet/network/AdnetNetworkTarget", "./comps/app1/adnet/network/AdnetNetworkTargetProps", "ng2-bootstrap/ng2-bootstrap", "./comps/resourceviewer/ResourceViewer", "./App.html!text", "./comps/app1/adnet/network/AdnetNetworkPackageViewProps", "./comps/app1/adnet/network/AdnetNetworkPairProps", "./comps/app1/adnet/network/AdnetNetworkTargetSearch", "./comps/simplegridmodule/SimpleGridModule", "./comps/app1/adnet/targets/AdnetResolver", "./comps/app1/adnet/AdnetLoader", "./comps/inputnumeric/InputNumeric", "./comps/inputstring/InputString", "primeng/primeng", "./comps/dropbox/Dropbox", "./comps/twofactor/Twofactor", "./comps/app1/adnet/network/AdnetReports", "ng2-toastr/ng2-toastr", "./pipes/StringJSPipe", "angular-pipes", "./comps/app1/adnet/billing/AdnetBilling"], function (exports_1, context_1) {
    "use strict";
    var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
        var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
        else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
        return c > 3 && r && Object.defineProperty(target, key, r), r;
    };
    var __metadata = (this && this.__metadata) || function (k, v) {
        if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
    };
    var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
        return new (P || (P = Promise))(function (resolve, reject) {
            function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
            function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
            function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
            step((generator = generator.apply(thisArg, _arguments)).next());
        });
    };
    var __generator = (this && this.__generator) || function (thisArg, body) {
        var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t;
        return { next: verb(0), "throw": verb(1), "return": verb(2) };
        function verb(n) { return function (v) { return step([n, v]); }; }
        function step(op) {
            if (f) throw new TypeError("Generator is already executing.");
            while (_) try {
                if (f = 1, y && (t = y[op[0] & 2 ? "return" : op[0] ? "throw" : "next"]) && !(t = t.call(y, op[1])).done) return t;
                if (y = 0, t) op = [0, t.value];
                switch (op[0]) {
                    case 0: case 1: t = op; break;
                    case 4: _.label++; return { value: op[1], done: false };
                    case 5: _.label++; y = op[1]; op = [0]; continue;
                    case 7: op = _.ops.pop(); _.trys.pop(); continue;
                    default:
                        if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
                        if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
                        if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
                        if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
                        if (t[2]) _.ops.pop();
                        _.trys.pop(); continue;
                }
                op = body.call(thisArg, _);
            } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
            if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
        }
    };

which sure seems like state machine and not generators (no yields)

here is my tsconfig: https://github.com/born2net/studioDashboard/blob/master/tsconfig.json

regards

Sean

[mhegazy]

ah.. sorry, i miss read the issue. i thought you did not want generators, and wanted to target ES5.

But generators are an ES6 feature, and TS does not support granular targeting for transformations.

[born2net]

but my Chrome browser supports generators so why can't I target es5 and specifically tell TS that generators are available in my browsers and use it?

[mhegazy]

Please see https://github.com/Microsoft/TypeScript/issues/4692#issuecomment-248473841 for relevant discussion.

[benjamingr]

@born2net for your Chrome browser can't you just target ES2015?

[born2net]

be nice if I could cherry pick the comparability for async/await...

[benjamingr]

@born2net Chrome also supports native async/await since v55

[born2net]

interesting, so how do you tell TS to not transpile at all? so async / await can run natively?

[mhegazy]

--target ES2017 or --target ESNext

[born2net]

sweet tx!