{"action":"created","issue":{"url":"https://api.github.com/repos/babel/babel/issues/4723","repository_url":"https://api.github.com/repos/babel/babel","labels_url":"https://api.github.com/repos/babel/babel/issues/4723/labels{/name}","comments_url":"https://api.github.com/repos/babel/babel/issues/4723/comments","events_url":"https://api.github.com/repos/babel/babel/issues/4723/events","html_url":"https://github.com/babel/babel/issues/4723","id":182914788,"number":4723,"title":"Async bound functions in ES6 classes receive arguments of constructor.","user":{"login":"outreach-devin-canterberry","id":20980617,"avatar_url":"https://avatars.githubusercontent.com/u/20980617?v=3","gravatar_id":"","url":"https://api.github.com/users/outreach-devin-canterberry","html_url":"https://github.com/outreach-devin-canterberry","followers_url":"https://api.github.com/users/outreach-devin-canterberry/followers","following_url":"https://api.github.com/users/outreach-devin-canterberry/following{/other_user}","gists_url":"https://api.github.com/users/outreach-devin-canterberry/gists{/gist_id}","starred_url":"https://api.github.com/users/outreach-devin-canterberry/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/outreach-devin-canterberry/subscriptions","organizations_url":"https://api.github.com/users/outreach-devin-canterberry/orgs","repos_url":"https://api.github.com/users/outreach-devin-canterberry/repos","events_url":"https://api.github.com/users/outreach-devin-canterberry/events{/privacy}","received_events_url":"https://api.github.com/users/outreach-devin-canterberry/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":5,"created_at":"2016-10-13T22:00:08Z","updated_at":"2016-10-14T18:27:47Z","closed_at":"2016-10-14T18:27:47Z","body":"### Input Code\r\n\r\nThe following test suite describes the issue:\r\n\r\n```js\r\nimport {expect} from 'chai';\r\n\r\nclass Demo {\r\n  bad = async (x) => arguments[0];\r\n  good = (x) => (async () => (x))();\r\n}\r\n\r\ndescribe('async bound handlers', function() {\r\n  lazy('demo', () => new Demo('Scope leak!'));\r\n\r\n  describe('#bad', function() {\r\n    it('does bad things', async function() {\r\n      const leak = await this.demo.bad(123);\r\n      expect(leak).to.equal('Scope leak!');\r\n    });\r\n  });\r\n\r\n  describe('#good', function() {\r\n    it('does good things', async function() {\r\n      const x = await this.demo.good(123);\r\n      expect(x).to.equal(123);\r\n    });\r\n  });\r\n});\r\n```\r\n\r\n### Babel Configuration (.bablerc, package.json, cli command)\r\n\r\nUsing [broccoli-babel-transpiler](https://github.com/babel/broccoli-babel-transpiler) with the following options:\r\n\r\n```js\r\n{\r\n  nonStandard: true,\r\n  moduleIds: false,\r\n  modules: 'system',\r\n  externalHelpers: true,\r\n  stage: 0,\r\n  // …other project-specific configuration (extensions, directories, etc)\r\n}\r\n```\r\n\r\n### Expected Behavior\r\n\r\nWhen defining a bound async function within an ES6 class, like so:\r\n\r\n```javascript\r\nclass Demo {\r\n  hello = async (name) => `Hello, ${name}!`;\r\n}\r\n```\r\n\r\nI would expect `name` to be defined.\r\n\r\n### Current Behavior\r\n\r\nWith the above example given for *expected behavior*, the value of `name` is bound to the first argument given to the constructor for `Demo`.\r\n\r\n### Possible Solution\r\n\r\nA workaround is to declare the bound function *without* the `async` keyword, and have it return a self-evaluating function *with* the `async` keyword containing the original logic. For example:\r\n\r\n```javascript\r\nclass Demo {\r\n  hello = (name) => (async () => `Hello, ${name}!`)();\r\n}\r\n```\r\n\r\nA possible solution might be for Babel to do this automatically.\r\n\r\n### Context\r\n\r\nIn practice, our React project passes bound functions as callbacks (e.g: `onClick`). Rather than dynamically binding these using `::` or `Function#bind`, which create new objects that violate shallow prop comparisons and trigger needless re-rendering (see [Performance Engineering with React](http://benchling.engineering/performance-engineering-with-react/#functionbindinlineanonymousfunctions)), we bind these using the pattern discussed here.\r\n\r\nA fair number of our handler functions have asynchronous behavior, and we'd like to take advantage of the `async` keyword as we have with our unbound class functions. The obvious way to do this is to declare the assigned function to have the `async` keyword, which triggers the errant behavior.\r\n\r\nIn short, we want the `job` variable in both functions declared below to be consistent:\r\n\r\n```javascript\r\nclass Demo {\r\n  async performAsync(job) {/*…process the given job…*/}\r\n  boundPerformAsync = async (job) => {/*…process the given job…*/}\r\n}\r\n```\r\n\r\n`this.performAsync(job)` and `this.boundPerformAsync(job)` should be functionally equivalent.\r\n"},"comment":{"url":"https://api.github.com/repos/babel/babel/issues/comments/253883538","html_url":"https://github.com/babel/babel/issues/4723#issuecomment-253883538","issue_url":"https://api.github.com/repos/babel/babel/issues/4723","id":253883538,"user":{"login":"danharper","id":510740,"avatar_url":"https://avatars.githubusercontent.com/u/510740?v=3","gravatar_id":"","url":"https://api.github.com/users/danharper","html_url":"https://github.com/danharper","followers_url":"https://api.github.com/users/danharper/followers","following_url":"https://api.github.com/users/danharper/following{/other_user}","gists_url":"https://api.github.com/users/danharper/gists{/gist_id}","starred_url":"https://api.github.com/users/danharper/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/danharper/subscriptions","organizations_url":"https://api.github.com/users/danharper/orgs","repos_url":"https://api.github.com/users/danharper/repos","events_url":"https://api.github.com/users/danharper/events{/privacy}","received_events_url":"https://api.github.com/users/danharper/received_events","type":"User","site_admin":false},"created_at":"2016-10-14T18:27:47Z","updated_at":"2016-10-14T18:27:47Z","body":"Ah just saw your edit :+1:"}}
{"actor":{"display_login":"danharper"}}