Expected prop to be data fetched by Relay

[fenos]

Hi, after i upgraded to isomorphic-relay v0.5.1 All my components started to complain asking that the data has to be data fetched by relay.

Warning: RelayContainer: Expected propmesupplied toNavbarto be data fetched by Relay. This is likely an error unless you are purposely passing in mock data that conforms to the shape of this component's fragment.

Any idea about this? After hours of debugging still i couldn't find the reason

[thelordoftheboards]

I am seeing the same on my project after an upgrade, I did not want to say anything because I thought I just messed up something. So ... +1 I guess?

[denvned]

@fenos, @thelordoftheboards, thanks for the report. Any ideas on how I can reproduce the error? How your setup is different from the examples (star-wars, todo)? I suppose you have tried to remove the node_modules and do clean install, right? Did v0.5.0 work ok for you?

[thelordoftheboards]

Let me try to see how I can make it easiest to reproduce for you, I will follow up with you. Clean install after deleting node_modules did not help in my case.

[thelordoftheboards]

Definitely does not happen with the todo example from isomprohic-relay-router. I will keep digging to find why and where it happens.

[thelordoftheboards]

As an experiment I tried to modify the todo sample to use exactly the same packages as my project, and it did not cause it to break ... will continue looking.

[thelordoftheboards]

Here is where my warning comes from: At this point I do not think it is necessarily related to isomorphic-relay, could be something to do with relay 0.7. I will post more when I find out more.

[denvned]

@thelordoftheboards, Does the warning show if you comment out the call to IsomorphicRelay.injectPreparedData?

[thelordoftheboards]

I will test that tomorrow. However, if I initially call a page that is not using, for instance, ToDos, and then in the browser navigate to ToDos I see the warnings in the browser console. I would think by that time we would be done with the server rendering. That said, I will try it anyway.

[fenos]

@denvned thanks for your promptness and support, I will do trials this evening and try to find out more @thelordoftheboards thanks to you as well to move forward with debugging

[fenos]

I tried to remove IsomorphicRelay.injectPreparedData but it doesn't seem the problem. I also tried to downgrade to v.0.50 with no luck.

I can say that my project is more similar to the Isomorphic-relay-router repo, I'm exporting queries as a playing object and pass them to the routes from the queires prop.

[thelordoftheboards]

Haven't had any time for more detailed troubleshooting, but I noticed that at the same time as this project converted to 7 they added ; after the class definition and before the relay wrapper. I am not sure of the meaning of this ...

https://github.com/ryancole/league/commit/af0c63e2f334aec79cc08b2ece72c466e62d373a

Does it matter?

[denvned]

Does it matter?

No, it shouldn't.

[jkempff]

Just FYI, I'm having the exact same problems, after upgrading to 0.5.1. The warning also appears on the server side, so .injectPreparedData cannot be the cause of the problem.

[denvned]

@jkempff, sorry you faced it too. Maybe you have any ideas how I can reproduce the error?

@fenos, @thelordoftheboards, @jkempff Maybe any of you can create a small repro project and upload it to GitHub?

[fenos]

@denvned fair enough, i'll do it this evening when i came back from work if no one would do it before me. Thanks again

[thelordoftheboards]

@denvned I tried to reproduce the issue outside of my main project using the ToDo example at no avail. I will prepare my 'full' project with the problem. The size should not be an issue hopefully, the problem is fairly isolated.

[thelordoftheboards]

@denvned here is my repository: https://github.com/codefoundries/isomorphic-material-relay-starter-kit/tree/develop

Here are the steps to reproduce the problem:

• Clone the develop branch locally.
• Run:

npm run install
npm run config-local
npm run dev

• Navigate to http://localhost:4444/.
• Click on top left button in nav bar.
• Choose Examples, then Ensayo.
• The following message will appear in the console 4 times (for each item):

Warning: RelayContainer: Expected prop `Ensayo` supplied to `Ensayo_Item` to be data fetched by Relay. This is likely an error unless you are purposely passing in mock data that conforms to the shape of this component's fragment.

I could not make it any simpler than that, my attempts to reproduce it outside of the project so far have been in vain. The same project works perfectly well in 6.1 (master branch).

[denvned]

@thelordoftheboards You forgot to update babel-relay-plugin-loader to version 0.7. With the correct version your repo does not produce the warnings.

As it turned out, it was a user error, so closing for now.

@fenos, @jkempff What version of babel-relay-plugin are you using?

[thelordoftheboards]

I am sooo dumb. Sorry to waste your time.

[thelordoftheboards]

Just for everyone else's reference, I will be using npm-check-updates from now on to make sure I am not missing anything. Seems to work fairly well.

[fenos]

I feel dumb as well :( Thanks denvned to point that thing out, I tried as well to replicate the issue with no luck but that was the cause!! Thanks so much to both of you guys

[jkempff]

Same here, after updating all dependencies - which was kind of a hassle - everything works as expected!