search

VulcanJS / Vulcan-Starter

VulcanJS starter repo. Use as a base for your own VulcanJS projects.
MIT License
127 stars 88 forks source link

Starter Step 15 #103

Closed jmpolitzer closed 5 years ago

jmpolitzer commented 5 years ago

When uncommenting the SmartForm component in Step 15, I receive the following error:

Warning: Expected server HTML to contain a matching <div> in <div>.
warningWithoutStack @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:113330
warnForInsertedHydratedElement @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:120995
didNotFindHydratableContainerInstance @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:121658
insertNonHydratedInstance @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:125937
tryToClaimNextHydratableInstance @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:126005
updateHostComponent @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:126445
beginWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:126919
performUnitOfWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129231
workLoop @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129269
renderRoot @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129348
performWorkOnRoot @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130202
performWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130110
performSyncWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130082
requestWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129970
scheduleWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129764
scheduleRootUpdate @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130452
updateContainerAtExpirationTime @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130479
updateContainer @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130506
ReactRoot.render @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130772
(anonymous) @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130912
unbatchedUpdates @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130333
legacyRenderSubtreeIntoContainer @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130908
hydrate @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130964
Meteor.startup @ router.jsx:71
Meteor.startup @ meteor.js?hash=0504f43f667698535416b00eb44eb6f53161cb63:978
run @ router.jsx:15
Meteor.startup @ routing.jsx:79
maybeReady @ meteor.js?hash=0504f43f667698535416b00eb44eb6f53161cb63:927
loadingCompleted @ meteor.js?hash=0504f43f667698535416b00eb44eb6f53161cb63:939
FormWrapper.jsx:106 Uncaught TypeError: Cannot read property 'slice' of undefined
    at convertFields (FormWrapper.jsx:106)
    at Array.map (<anonymous>)
    at FormWrapper.getFragments (FormWrapper.jsx:113)
    at FormWrapper.getComponent (FormWrapper.jsx:182)
    at new FormWrapper (FormWrapper.jsx:59)
    at constructClassInstance (modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:124584)
    at updateClassComponent (modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:126306)
    at beginWork (modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:126905)
    at performUnitOfWork (modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129231)
    at workLoop (modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129269)
convertFields @ FormWrapper.jsx:106
getFragments @ FormWrapper.jsx:113
getComponent @ FormWrapper.jsx:182
FormWrapper @ FormWrapper.jsx:59
constructClassInstance @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:124584
updateClassComponent @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:126306
beginWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:126905
performUnitOfWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129231
workLoop @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129269
callCallback @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:112960
invokeGuardedCallbackDev @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:113010
invokeGuardedCallback @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:113063
replayUnitOfWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:128560
renderRoot @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129363
performWorkOnRoot @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130202
performWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130110
performSyncWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130082
requestWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129970
scheduleWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129764
scheduleRootUpdate @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130452
updateContainerAtExpirationTime @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130479
updateContainer @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130506
ReactRoot.render @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130772
(anonymous) @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130912
unbatchedUpdates @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130333
legacyRenderSubtreeIntoContainer @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130908
hydrate @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130964
Meteor.startup @ router.jsx:71
Meteor.startup @ meteor.js?hash=0504f43f667698535416b00eb44eb6f53161cb63:978
run @ router.jsx:15
Meteor.startup @ routing.jsx:79
maybeReady @ meteor.js?hash=0504f43f667698535416b00eb44eb6f53161cb63:927
loadingCompleted @ meteor.js?hash=0504f43f667698535416b00eb44eb6f53161cb63:939
modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:127365 The above error occurred in the <FormWrapper> component:
    in FormWrapper (created by CollectionPropsWrapper)
    in CollectionPropsWrapper (created by withRouter(CollectionPropsWrapper))
    in withRouter(CollectionPropsWrapper) (created by withApollo(withRouter(CollectionPropsWrapper)))
    in withApollo(withRouter(CollectionPropsWrapper)) (created by withCurrentUser(withApollo(withRouter(CollectionPropsWrapper))))
    in withCurrentUser(withApollo(withRouter(CollectionPropsWrapper))) (created by MoviesNew)
    in div (created by MoviesNew)
    in MoviesNew (created by MoviesApp)
    in div (created by MoviesApp)
    in div (created by MoviesApp)
    in MoviesApp (created by Layout)
    in div (created by Layout)
    in Layout (created by App)
    in div (created by App)
    in IntlProvider (created by App)
    in App (created by withCookies(App))
    in withCookies(App) (created by withApollo(withCookies(App)))
    in withApollo(withCookies(App)) (created by withUpdateUser(withApollo(withCookies(App))))
    in withUpdateUser(withApollo(withCookies(App))) (created by withCurrentUser(withUpdateUser(withApollo(withCookies(App)))))
    in withCurrentUser(withUpdateUser(withApollo(withCookies(App)))) (created by RouterContext)
    in RouterContext (created by Router)
    in ScrollBehaviorContext (created by Router)
    in Router
    in CookiesProvider
    in QueryRecyclerProvider (created by ApolloProvider)
    in ApolloProvider

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries.
logCapturedError @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:127365
logError @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:127401
update.callback @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:128088
callCallback @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:123948
commitUpdateEffects @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:123987
commitUpdateQueue @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:123978
commitLifeCycles @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:127536
commitAllLifeCycles @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:128720
callCallback @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:112960
invokeGuardedCallbackDev @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:113010
invokeGuardedCallback @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:113063
commitRoot @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:128890
completeRoot @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130278
performWorkOnRoot @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130206
performWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130110
performSyncWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130082
requestWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129970
scheduleWork @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129764
scheduleRootUpdate @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130452
updateContainerAtExpirationTime @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130479
updateContainer @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130506
ReactRoot.render @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130772
(anonymous) @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130912
unbatchedUpdates @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130333
legacyRenderSubtreeIntoContainer @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130908
hydrate @ modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130964
Meteor.startup @ router.jsx:71
Meteor.startup @ meteor.js?hash=0504f43f667698535416b00eb44eb6f53161cb63:978
run @ router.jsx:15
Meteor.startup @ routing.jsx:79
maybeReady @ meteor.js?hash=0504f43f667698535416b00eb44eb6f53161cb63:927
loadingCompleted @ meteor.js?hash=0504f43f667698535416b00eb44eb6f53161cb63:939
modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:130171 Uncaught TypeError: Cannot read property 'slice' of undefined
    at convertFields (FormWrapper.jsx:106)
    at Array.map (<anonymous>)
    at FormWrapper.getFragments (FormWrapper.jsx:113)
    at FormWrapper.getComponent (FormWrapper.jsx:182)
    at new FormWrapper (FormWrapper.jsx:59)
    at constructClassInstance (modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:124584)
    at updateClassComponent (modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:126306)
    at beginWork (modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:126905)
    at performUnitOfWork (modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129231)
    at workLoop (modules.js?hash=6eeb54e0f9bd340f89732b1e7b755536e39370b0:129269)
yukio4192 commented 5 years ago

I have same issue. :(

daveit commented 5 years ago

+1 -> getting this error too! Tested on both Windows and Mac (I tried on my Mac in case it was an issue with Windows, but now find it mentioned here!)

SachaG commented 5 years ago

Can someone upload their code at that stage of the tutorial and post the link here?

daveit commented 5 years ago

Thanks, can you elaborate more Sacha - do you mean the whole project, or just the MoviesNew.jsx ?

SachaG commented 5 years ago

MoviesNew.jsx for starters, or the whole project if the bug is not obvious.

jeremycare commented 5 years ago

Hi,

I just followed the tutorial, but when uncommenting the children in MoviesNew.jsx i got the same error. https://github.com/jeremycare/Vulcan-Starter

yukio4192 commented 5 years ago

I found solution on slack channel. Just update meteor, and I got it.

meteor update

2018年12月12日(水) 23:06、jeremycare さん（notifications@github.com）のメッセージ:

Hi,

I just followed the tutorial, but when uncommenting the children in MoviesNew.jsx i got the same error. https://github.com/jeremycare/Vulcan-Starter

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/VulcanJS/Vulcan-Starter/issues/103#issuecomment-446599111, or mute the thread https://github.com/notifications/unsubscribe-auth/AV0Ti8J9FGEiyW1Lb5oQ8ehnW27wjRlXks5u4Q1ZgaJpZM4ZJuR9 .

jeremycare commented 5 years ago

Thanks !

daveit commented 5 years ago

After I installed Vulcan, I got a message to update meteor to 1.8.0.1, so i did, and that was before I started working through the steps. So that does not appear to be a solution for me!

SachaG commented 5 years ago

Sorry about that, if someone posts some code we'll be able to see if it's a problem in that specific file or something else.

eric-burel commented 5 years ago

Closing as stale, let me know if it still doesn't work. Currently step 15 is blocking due to a change in the UI, will be fixed very soon after we update to 1.13.3.