Relay: TypeError: Cannot read property 'id' of undefined at getRequestCacheKey

[Stephen2]

Hi! Just upgrading to 2.0.0 and I've tried to cut down to as basic a case as I can, but still having problems :(

Using:

{
    "react": "^16.7.0",
    "react-relay": "^2.0.0",
    "relay-runtime": "^2.0.0",
    "relay-compiler": "^1.6.2",
}

Simple query:

const TopbarFragmentWrapperQuery = graphql`
  query TopbarFragmentWrapperQuery {
    loggedInUserInfo {
      user {
        name {
          firstName
        }
      }
    }
  }
`;

Simple render:

const TopbarFragmentWrapper = withRouter(({ environment, history, location, mobile }) => (
  <QueryRenderer
    environment={environment}
    query={TopbarFragmentWrapperQuery}
    variables={{}}
    render={({ error, props }) => {
      if (error) {
        return <div>{error.message}</div>;
      } else if (props) {
        return (
          <ComponentGoesHere />
        );
      }
    }}
  />
));

Receiving error:

ReactRelayQueryRenderer.js?36f2:258 Uncaught TypeError: Cannot read property 'id' of undefined
    at getRequestCacheKey (ReactRelayQueryRenderer.js?36f2:258)
    at new ReactRelayQueryRenderer (ReactRelayQueryRenderer.js?36f2:67)
    at constructClassInstance (react-dom.development.js?3156:12628)
    at updateClassComponent (react-dom.development.js?3156:14480)
    at beginWork (react-dom.development.js?3156:15335)
    at performUnitOfWork (react-dom.development.js?3156:18150)
    at workLoop (react-dom.development.js?3156:18190)
    at HTMLUnknownElement.callCallback (react-dom.development.js?3156:149)
    at Object.invokeGuardedCallbackDev (react-dom.development.js?3156:199)
    at invokeGuardedCallback (react-dom.development.js?3156:256)
    at replayUnitOfWork (react-dom.development.js?3156:17437)
    at renderRoot (react-dom.development.js?3156:18309)
    at performWorkOnRoot (react-dom.development.js?3156:19165)
    at performWork (react-dom.development.js?3156:19077)
    at performSyncWork (react-dom.development.js?3156:19051)
    at requestWork (react-dom.development.js?3156:18920)

Sorry, I'm not sure what other information will be helpful and just wondered if that error message triggers anyone to point me in the right direction?

Looks like it's coming from this line:
requestCacheKey = getRequestCacheKey(request.params, props.variables);

Where request.params doesn't exist on the request object at that point.

[Stephen2]

Answer: Dumb mistake! "relay-compiler": "^1.6.2", should be "relay-compiler": "^2.0.0", as well...

Sorry for the time waster :+1:

[kassens]

Maybe we should have a peer dependency or something? But I think we had and there was some reason to remove it. Not clear to me what's the right thing to do.

[jeric17]

I still experience this even though I've upgraded relay compiler to 2.0.0
Deleted node_modules, and re-installed dependencies. still no luck

"dependencies": {
    "arv": "^0.1.1",
    "babel-plugin-relay": "^2.0.0-rc.2",
    "react": "^16.8.1",
    "react-dom": "^16.8.1",
    "react-relay": "^2.0.0",
    "react-scripts": "2.1.5",
    "subscriptions-transport-ws": "^0.9.15"
  },
  "devDependencies": {
    "flow-bin": "^0.89.0",
    "flow-typed": "^2.5.1",
    "graphql": "^14.1.1",
    "relay-compiler": "^2.0.0"
  }

[Stephen2]

After re running yarn or npm install

Did you rerun relay-compiler from CLI to regenerate .graphql.js files?

[jeric17]

You're a life saver! running yarn relay fixed the issue. Thanks for the quick response @Stephen2 !