Babel 6 - Async arrow function "this" points to function

Question

Babel 6 with these settings

require("babel-register")({
  extensions: [".es6", ".es", ".jsx", ".js"],
  plugins: ['transform-runtime'],
  presets: ["es2015", "stage-0"]
});

Acts unexpectedly, The this reference differs between a regular arrow function and a async arrow function. So my question really is, can someone else confirm this as a bug with latest babel and where should I report this issue.

class TestClass
{   
    name = "John Doe";

    testMethodSuccess()
    {
        return new Promise((resolve) => {
            console.log(this);
            setTimeout(resolve, 1000);
        });
    }

    testMethodFailure()
    {
        return new Promise(async (resolve) => {
            console.log(this);
            setTimeout(resolve, 1000);
        });
    }
}

(async () => {
    try{
        var testObject = new TestClass();
        await testObject.testMethodSuccess();
        await testObject.testMethodFailure();
    }catch(e){
        console.error(e);
    }
})();

And here is the result of code above

"use strict";

var _regenerator = require("babel-runtime/regenerator");

var _regenerator2 = _interopRequireDefault(_regenerator);

var _asyncToGenerator2 = require("babel-runtime/helpers/asyncToGenerator");

var _asyncToGenerator3 = _interopRequireDefault(_asyncToGenerator2);

var _promise = require("babel-runtime/core-js/promise");

var _promise2 = _interopRequireDefault(_promise);

var _classCallCheck2 = require("babel-runtime/helpers/classCallCheck");

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require("babel-runtime/helpers/createClass");

var _createClass3 = _interopRequireDefault(_createClass2);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var TestClass = function () {
    function TestClass() {
        (0, _classCallCheck3.default)(this, TestClass);
        this.name = "John Doe";
    }

    (0, _createClass3.default)(TestClass, [{
        key: "testMethodSuccess",
        value: function testMethodSuccess() {
            var _this = this;

            return new _promise2.default(function (resolve) {
                console.log(_this);
                setTimeout(resolve, 1000);
            });
        }
    }, {
        key: "testMethodFailure",
        value: function testMethodFailure() {
            return new _promise2.default(function () {
                var _this2 = this;

                var ref = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee(resolve) {
                    return _regenerator2.default.wrap(function _callee$(_context) {
                        while (1) {
                            switch (_context.prev = _context.next) {
                                case 0:
                                    console.log(_this2);
                                    setTimeout(resolve, 1000);

                                case 2:
                                case "end":
                                    return _context.stop();
                            }
                        }
                    }, _callee, _this2);
                }));
                return function (_x) {
                    return ref.apply(this, arguments);
                };
            }());
        }
    }]);
    return TestClass;
}();

(0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee2() {
    var testObject;
    return _regenerator2.default.wrap(function _callee2$(_context2) {
        while (1) {
            switch (_context2.prev = _context2.next) {
                case 0:
                    _context2.prev = 0;
                    testObject = new TestClass();
                    _context2.next = 4;
                    return testObject.testMethodSuccess();

                case 4:
                    _context2.next = 6;
                    return testObject.testMethodFailure();

                case 6:
                    _context2.next = 11;
                    break;

                case 8:
                    _context2.prev = 8;
                    _context2.t0 = _context2["catch"](0);

                    console.error(_context2.t0);

                case 11:
                case "end":
                    return _context2.stop();
            }
        }
    }, _callee2, undefined, [[0, 8]]);

Answer 1

Thanks James Thorpe

https://phabricator.babeljs.io/T2765

This is a well known bug since december