<html><head><meta http-equiv="Content-Type" content="text/html charset=utf-8"></head><body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space;" class="">Also I disagree with your assessment that I should go talk to the vendors. For example Axel R.’s recent post on Function names <a href="http://www.2ality.com/2015/09/function-names-es6.html" class="">http://www.2ality.com/2015/09/function-names-es6.html</a> states in Section 2 the case where there is no name. I clarified on Twitter with him just now <a href="https://twitter.com/JasonKuhrt/status/644312567012323328" class="">https://twitter.com/JasonKuhrt/status/644312567012323328</a> that indeed the first ident assignment to an anon function will set its name. This is all thanks to JS 2015 not vendors (of course we need their compliance next).<div class=""><br class=""></div><div class="">So given the above in the future a compose function such as</div><div class=""><br class=""></div><div class="">```</div><div class="">let compose = (b, a) => (...as) => b(a(...as))</div><div class="">```</div><div class=""><br class=""></div><div class="">that is used like so:</div><div class=""><br class=""></div><div class="">```</div><div class="">const componentFactory = compose(React.createFactory, React.createClass)</div><div class="">```</div><div class=""><br class=""></div><div class="">Should have great stack trace support e.g.:</div><div class=""><br class=""></div><div class="">```</div><div class="">at componentFactory (/Users/jasonkuhrt/code/test/component-factory.js:1:36) </div><div class="">```</div><div class=""><br class=""></div><div class="">So the reason I wrote this email is partially negated by Axel’s helpful information. However I’m still curious in any other thoughts trotting around for near or future about how to make the situation better around naming functions?</div><div class=""><br class=""></div><div class=""><br class=""><div><blockquote type="cite" class=""><div class="">On Sep 16, 2015, at 9:19 PM, James Kyle <<a href="mailto:me@thejameskyle.com" class="">me@thejameskyle.com</a>> wrote:</div><br class="Apple-interchange-newline"><div class="">
<span id="mailbox-conversation" class=""><div class=""><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class="">Okay, let's break this down. Your example stack trace is really not a bad story.</div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> Error: Invariant Violation: createClass(...): Class specification must implement a `render` method.</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>    <span class="Apple-converted-space"> </span>at invariant (/Users/jasonkuhrt/code/test/node_modules/react/lib/invariant.js:42:15)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>    <span class="Apple-converted-space"> </span>at ReactClass.createClass (/Users/jasonkuhrt/code/test/node_modules/react/lib/ReactClass.js:898:46)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> </b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>    <span class="Apple-converted-space"> </span>at /Users/jasonkuhrt/code/test/component-factory.js:4:41</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> </b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>    <span class="Apple-converted-space"> </span>at Object.<anonymous> (/Users/jasonkuhrt/code/test/test.js:4:1)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>    <span class="Apple-converted-space"> </span>at Module._compile (module.js:434:26)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>    <span class="Apple-converted-space"> </span>at normalLoader (/usr/local/lib/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:199:5)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>    <span class="Apple-converted-space"> </span>at Object.require.extensions.(anonymous function) [as .js] (/usr/local/lib/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:216:7)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>    <span class="Apple-converted-space"> </span>at Module.load (module.js:355:32)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>    <span class="Apple-converted-space"> </span>at Function.Module._load (module.js:310:12)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>    <span class="Apple-converted-space"> </span>at Function.Module.runMain (module.js:475:10)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class="">First off, you need to remove all the module loading-related stuff:</div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> Error: Invariant Violation: createClass(...): Class specification must implement a `render` method.</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>     at invariant (/Users/jasonkuhrt/code/test/node_modules/react/lib/invariant.js:42:15)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>     at ReactClass.createClass (/Users/jasonkuhrt/code/test/node_modules/react/lib/ReactClass.js:898:46)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> </b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>     at /Users/jasonkuhrt/code/test/component-factory.js:4:41</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> </b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>     at Object.<anonymous> (/Users/jasonkuhrt/code/test/test.js:4:1)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class="">Now, You're left with test code and the internal stack trace of React. Remove the React stuff and you have:</div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> Error: Invariant Violation: createClass(...): Class specification must implement a `render` method. </b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>     at /Users/jasonkuhrt/code/test/component-factory.js:4:41</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> </b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>     at Object.<anonymous> (/Users/jasonkuhrt/code/test/test.js:4:1)</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class="">I'm assuming that 2nd item is just the test itself so let's kill that too.</div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> Error: Invariant Violation: createClass(...): Class specification must implement a `render` method. </b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">>     at /Users/jasonkuhrt/code/test/component-factory.js:4:41</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class="">So your error is around line 4 of <b class="">`<i class="">/code/test/component-factory.js`</i></b>, and the error is that you created a React class without a render method.</div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class="">I don't see what was bad about that, you certainly wouldn't want remove any of that stack trace as it's all real operations that might need debugging.</div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class="">I also don't see what this has to do with your FP example of:</div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> ```</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> let compose = (b, a) => (...as) => b(a(...as))</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><i class=""><b class="">> ```</b></i></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class="">As that's clearly not the issue in your stack trace.</div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class="">Also, if you want these stack traces to be more meaningful, you should be talking to the JavaScript engine implementor. In your case v8 (since you're using Node).</div><div style="margin-top: 0px; margin-bottom: 0px; line-height: normal; font-family: 'Helvetica Neue'; color: rgb(73, 79, 80);" class=""><br class=""></div>
</div></span><div class="mailbox_signature">
<br class="">—<br class="">This email brought to you by the letters T, J, and K.</div>
<br class=""><br class=""><div class="gmail_quote"><p class="">On Wed, Sep 16, 2015 at 5:16 PM, Jason Kuhrt <span dir="ltr" class=""><<a href="mailto:jasonkuhrt@me.com" target="_blank" class="">jasonkuhrt@me.com</a>></span> wrote:<br class=""></p><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex;"><p class="">For example, today, a stone from the bedrock of FP:
<br class=""><br class="">> ```
<br class="">> let compose = (b, a) => (...as) => b(a(...as))
<br class="">> ```
<br class=""><br class="">will cause a JS Stack Trace to go from something useful (space around useful line) like:
<br class=""><br class="">> ```
<br class=""><br class="">> Error: Invariant Violation: createClass(...): Class specification must implement a `render` method.
<br class=""><br class="">>     at invariant (/Users/jasonkuhrt/code/test/node_modules/react/lib/invariant.js:42:15)
<br class=""><br class="">>     at ReactClass.createClass (/Users/jasonkuhrt/code/test/node_modules/react/lib/ReactClass.js:898:46)
<br class=""><br class="">> 
<br class=""><br class="">>     at componentFactory (/Users/jasonkuhrt/code/test/component-factory.js:1:36)
<br class=""><br class="">> 
<br class=""><br class="">>     at Object.<anonymous> (/Users/jasonkuhrt/code/test/test.js:4:1)
<br class="">>     at Module._compile (module.js:460:26)
<br class="">>     at normalLoader (/usr/local/lib/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:199:5)
<br class="">>     at Object.require.extensions.(anonymous function) [as .js] (/usr/local/lib/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:216:7)
<br class="">>     at Module.load (module.js:355:32)
<br class="">>     at Function.Module._load (module.js:310:12)
<br class="">>     at Function.Module.runMain (module.js:501:10)
<br class=""><br class="">> ```
<br class=""><br class="">To something much less useful like this:
<br class=""><br class="">> ```
<br class=""><br class="">> Error: Invariant Violation: createClass(...): Class specification must implement a `render` method.
<br class="">>     at invariant (/Users/jasonkuhrt/code/test/node_modules/react/lib/invariant.js:42:15)
<br class="">>     at ReactClass.createClass (/Users/jasonkuhrt/code/test/node_modules/react/lib/ReactClass.js:898:46)
<br class="">> 
<br class="">>     at /Users/jasonkuhrt/code/test/component-factory.js:4:41
<br class="">> 
<br class="">>     at Object.<anonymous> (/Users/jasonkuhrt/code/test/test.js:4:1)
<br class="">>     at Module._compile (module.js:434:26)
<br class="">>     at normalLoader (/usr/local/lib/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:199:5)
<br class="">>     at Object.require.extensions.(anonymous function) [as .js] (/usr/local/lib/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:216:7)
<br class="">>     at Module.load (module.js:355:32)
<br class="">>     at Function.Module._load (module.js:310:12)
<br class="">>     at Function.Module.runMain (module.js:475:10)
<br class=""><br class="">> ```
<br class=""><br class="">And ultimately being in a real-life scenario/library/etc. (e.g. Ramda compose) leading to something almost useless:
<br class=""><br class="">> ```
<br class=""><br class="">> Error: Invariant Violation: createClass(...): Class specification must implement a `render` method.
<br class="">>     at invariant (/Users/jasonkuhrt/code/test/node_modules/react/lib/invariant.js:42:15)
<br class="">>     at ReactClass.createClass (/Users/jasonkuhrt/code/test/node_modules/react/lib/ReactClass.js:898:46)
<br class="">> 
<br class="">>     at /Users/jasonkuhrt/code/test/node_modules/ramda/dist/ramda.js:384:35
<br class="">>     at f1 (/Users/jasonkuhrt/code/test/node_modules/ramda/dist/ramda.js:156:27)
<br class="">> 
<br class="">>     at Object.<anonymous> (/Users/jasonkuhrt/code/test/test.js:4:1)
<br class="">>     at Module._compile (module.js:434:26)
<br class="">>     at normalLoader (/usr/local/lib/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:199:5)
<br class="">>     at Object.require.extensions.(anonymous function) [as .js] (/usr/local/lib/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:216:7)
<br class="">>     at Module.load (module.js:355:32)
<br class="">>     at Function.Module._load (module.js:310:12)
<br class=""><br class="">> ```
<br class="">_______________________________________________
<br class="">es-discuss mailing list
<br class=""><a href="mailto:es-discuss@mozilla.org" class="">es-discuss@mozilla.org</a>
<br class=""><a href="https://mail.mozilla.org/listinfo/es-discuss" class="">https://mail.mozilla.org/listinfo/es-discuss</a>
<br class=""></p></blockquote></div><br class=""></div></blockquote></div><br class=""></div></body></html>