search

VulcanJS / Vulcan

🌋 A toolkit to quickly build apps with React, GraphQL & Meteor
http://vulcanjs.org
MIT License
7.98k stars 1.89k forks source link

http://localhost:3000/components page fails to load when hocs is unspecified #2061

Closed mousetraps closed 6 years ago

mousetraps commented 6 years ago

Reproduced using the getting-started and example-movies packages in Vulcan-Starter.

Stack trace below. The error occurs when the component is registered as follows (without specifying hocs)

registerComponent({ name: 'MoviesItem', component: MoviesItem });

Specifying hocs: [] or separating out into multiple arguments works. 

=> App running at: http://localhost:3000/
I20180910-22:38:25.244(-7)? url:  /components
I20180910-22:38:25.267(-7)? { TypeError: Cannot read property 'map' of undefined
I20180910-22:38:25.268(-7)?     at ComponentHOCs (packages/vulcan:debug/lib/components/Components.jsx:11:22)
I20180910-22:38:25.268(-7)?     at walkTree (/Users/itani/src/Vulcan-Starter/node_modules/react-apollo/react-apollo.umd.js:716:21)
I20180910-22:38:25.268(-7)?     at /Users/itani/src/Vulcan-Starter/node_modules/react-apollo/react-apollo.umd.js:729:21
I20180910-22:38:25.269(-7)?     at forEachSingleChild (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:881:8)
I20180910-22:38:25.269(-7)?     at traverseAllChildrenImpl (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:785:5)
I20180910-22:38:25.269(-7)?     at traverseAllChildren (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:856:10)
I20180910-22:38:25.269(-7)?     at Object.forEachChildren [as forEach] (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:901:3)
I20180910-22:38:25.269(-7)?     at walkTree (/Users/itani/src/Vulcan-Starter/node_modules/react-apollo/react-apollo.umd.js:727:28)
I20180910-22:38:25.269(-7)?     at walkTree (/Users/itani/src/Vulcan-Starter/node_modules/react-apollo/react-apollo.umd.js:719:13)
I20180910-22:38:25.269(-7)?     at /Users/itani/src/Vulcan-Starter/node_modules/react-apollo/react-apollo.umd.js:729:21
I20180910-22:38:25.269(-7)?     at forEachSingleChild (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:881:8)
I20180910-22:38:25.270(-7)?     at traverseAllChildrenImpl (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:785:5)
I20180910-22:38:25.270(-7)?     at traverseAllChildrenImpl (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:801:23)
I20180910-22:38:25.270(-7)?     at traverseAllChildrenImpl (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:801:23)
I20180910-22:38:25.270(-7)?     at traverseAllChildren (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:856:10)
I20180910-22:38:25.270(-7)?     at Object.forEachChildren [as forEach] (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:901:3)
I20180910-22:38:25.270(-7)?     at walkTree (/Users/itani/src/Vulcan-Starter/node_modules/react-apollo/react-apollo.umd.js:727:28)
I20180910-22:38:25.271(-7)?     at walkTree (/Users/itani/src/Vulcan-Starter/node_modules/react-apollo/react-apollo.umd.js:719:13)
I20180910-22:38:25.271(-7)?     at /Users/itani/src/Vulcan-Starter/node_modules/react-apollo/react-apollo.umd.js:729:21
I20180910-22:38:25.272(-7)?     at forEachSingleChild (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:881:8)
I20180910-22:38:25.272(-7)?     at traverseAllChildrenImpl (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:785:5)
I20180910-22:38:25.272(-7)?     at traverseAllChildrenImpl (/Users/itani/src/Vulcan-Starter/node_modules/react/cjs/react.development.js:801:23)
I20180910-22:38:25.272(-7)?  => awaited here:
I20180910-22:38:25.272(-7)?     at Function.Promise.await (/Users/itani/.meteor/packages/promise/.0.11.1.gy8c7h.yyj0f++os+web.browser+web.browser.legacy+web.cordova/npm/node_modules/meteor-promise/promise_server.js:56:12)
I20180910-22:38:25.272(-7)?     at Object.preRender (packages/vulcan:routing/lib/server/routing.jsx:58:14)
I20180910-22:38:25.273(-7)?     at generateSSRData (packages/vulcan:routing/lib/server/router.jsx:53:15)
I20180910-22:38:25.273(-7)?     at sendSSRHtml (packages/vulcan:routing/lib/server/router.jsx:87:45)
I20180910-22:38:25.273(-7)?     at match (packages/vulcan:routing/lib/server/router.jsx:150:11)
I20180910-22:38:25.273(-7)?     at /Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/match.js:67:5
I20180910-22:38:25.273(-7)?     at /Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/createTransitionManager.js:108:11
I20180910-22:38:25.273(-7)?     at done (/Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/AsyncUtils.js:79:19)
I20180910-22:38:25.273(-7)?     at /Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/AsyncUtils.js:85:7
I20180910-22:38:25.273(-7)?     at getComponentsForRoute (/Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/getComponents.js:11:5)
I20180910-22:38:25.274(-7)?     at /Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/getComponents.js:35:5
I20180910-22:38:25.275(-7)?     at /Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/AsyncUtils.js:84:5
I20180910-22:38:25.275(-7)?     at Array.forEach (<anonymous>)
I20180910-22:38:25.275(-7)?     at mapAsync (/Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/AsyncUtils.js:83:9)
I20180910-22:38:25.275(-7)?     at getComponents (/Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/getComponents.js:34:28)
I20180910-22:38:25.275(-7)?     at finishEnterHooks (/Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/createTransitionManager.js:102:35)
I20180910-22:38:25.275(-7)?     at runTransitionHooks (/Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/TransitionUtils.js:79:7)
I20180910-22:38:25.276(-7)?     at runEnterHooks (/Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/TransitionUtils.js:112:12)
I20180910-22:38:25.276(-7)?     at /Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/createTransitionManager.js:95:7
I20180910-22:38:25.276(-7)?     at runTransitionHooks (/Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/TransitionUtils.js:79:7)
I20180910-22:38:25.276(-7)?     at runChangeHooks (/Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/TransitionUtils.js:136:12)
I20180910-22:38:25.276(-7)?     at finishMatch (/Users/itani/src/Vulcan-Starter/node_modules/react-router/lib/createTransitionManager.js:92:5) queryErrors: [ [Circular] ] }
mousetraps commented 6 years ago

PR incoming. The fix is two-fold:

  1. ensure that hocs gets initialized with an empty array when it's unspecified
  2. Update starter examples to use multiple arguments rather than passing in an object (not required after 1, but it's more consistent that way)
mousetraps commented 6 years ago

Actually, nevermind - missed this PR :) https://github.com/VulcanJS/Vulcan/pull/2031

Edit: I'll keep the issue open anyways since it hasn't been merged.

Apollinaire commented 6 years ago

As you pointed out in the issue, #2031 is supposed to solve this issue. The syntax registerComponent( {name:'MoviesList', component: MoviesList }) is the new syntax since v1.12.0 , which is why I used this syntax when updating the package example-movies. I think it's good to keep it with the new syntax to help enforce it and avoid teaching the old way to the new people. So just wait until @SachaG merges #2031 ;)

mousetraps commented 6 years ago

Ahh, I see - thanks! Didn’t realize that was the new syntax. I’ll update the PR to do the opposite, then. I’d assumed the preferred syntax was the one most commonly used in the starter.

Sent from my Rotary Phone

From: Apollinaire Lecocq notifications@github.com Sent: Tuesday, September 11, 2018 2:51 AM To: VulcanJS/Vulcan Cc: Sara Itani; State change Subject: Re: [VulcanJS/Vulcan] http://localhost:3000/components page fails to load when hocs is unspecified (#2061)

As you pointed out in the issue, #2031https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2FVulcanJS%2FVulcan%2Fpull%2F2031&data=02%7C01%7C%7C62233c40bfc6445cff0508d617cc23ab%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636722562863933664&sdata=lWU25N0gl5z26KCfYUyAdDtV6ZrviRF%2FjvAGfhZsfcQ%3D&reserved=0 is supposed to solve this issue. The syntax registerComponent( {name:'MoviesList', component: MoviesList }) is the new syntax since v1.12.0 https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fmedium.com%2F%40sachagreif%2Fvulcan-js-1-12-a-better-graphql-api-for-crud-operations-fae82e03a7e9%23772f&data=02%7C01%7C%7C62233c40bfc6445cff0508d617cc23ab%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636722562863933664&sdata=r1JpM2e%2B0zgjNnN54pFgLlyXOux9%2FwgpeL51lX264%2Fo%3D&reserved=0 , which is why I used this syntax when updating the package example-movies. I think it's good to keep it with the new syntax to help enforce it and avoid teaching the old way to the new people. So just wait until @SachaGhttps://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2FSachaG&data=02%7C01%7C%7C62233c40bfc6445cff0508d617cc23ab%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636722562863933664&sdata=43Pva64M3j6nQceJHkRYrmxhtpnHDTxcdHC4zSo34nQ%3D&reserved=0 merges #2031https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2FVulcanJS%2FVulcan%2Fpull%2F2031&data=02%7C01%7C%7C62233c40bfc6445cff0508d617cc23ab%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636722562863933664&sdata=lWU25N0gl5z26KCfYUyAdDtV6ZrviRF%2FjvAGfhZsfcQ%3D&reserved=0 ;)

— You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHubhttps://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2FVulcanJS%2FVulcan%2Fissues%2F2061%23issuecomment-420215448&data=02%7C01%7C%7C62233c40bfc6445cff0508d617cc23ab%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636722562864089916&sdata=m6BYXrefzpXmHUJGYZ13OZOdS4ejNI7TnXEchW0Ekkw%3D&reserved=0, or mute the threadhttps://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FAAuj4D8lzUxv8oZoa__YN5xZks9tOGZ0ks5uZ4ecgaJpZM4Wir5Y&data=02%7C01%7C%7C62233c40bfc6445cff0508d617cc23ab%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636722562864089916&sdata=xTSX85ipyu0sT2zdfyCB6JIJVXmvTm%2FQBQPluFEMuNI%3D&reserved=0.

Apollinaire commented 6 years ago

I’d assumed the preferred syntax was the one most commonly used in the starter.

Most of the starters have not been updated yet, since v1.12 has been released only 2 weeks ago, but eventually they will be updated and fixed ;)