{"action":"created","issue":{"url":"https://api.github.com/repos/apollostack/apollo-client/issues/488","repository_url":"https://api.github.com/repos/apollostack/apollo-client","labels_url":"https://api.github.com/repos/apollostack/apollo-client/issues/488/labels{/name}","comments_url":"https://api.github.com/repos/apollostack/apollo-client/issues/488/comments","events_url":"https://api.github.com/repos/apollostack/apollo-client/issues/488/events","html_url":"https://github.com/apollostack/apollo-client/issues/488","id":168544015,"number":488,"title":"TypeError: fragments is undefined","user":{"login":"margaretmoser","id":2442348,"avatar_url":"https://avatars.githubusercontent.com/u/2442348?v=3","gravatar_id":"","url":"https://api.github.com/users/margaretmoser","html_url":"https://github.com/margaretmoser","followers_url":"https://api.github.com/users/margaretmoser/followers","following_url":"https://api.github.com/users/margaretmoser/following{/other_user}","gists_url":"https://api.github.com/users/margaretmoser/gists{/gist_id}","starred_url":"https://api.github.com/users/margaretmoser/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/margaretmoser/subscriptions","organizations_url":"https://api.github.com/users/margaretmoser/orgs","repos_url":"https://api.github.com/users/margaretmoser/repos","events_url":"https://api.github.com/users/margaretmoser/events{/privacy}","received_events_url":"https://api.github.com/users/margaretmoser/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":3,"created_at":"2016-07-31T23:23:07Z","updated_at":"2016-08-01T00:15:19Z","closed_at":null,"body":"I've been trying (and trying and trying) to get a mutation+updateQuery combination to work, and I'm encountering unexpected issues. I've been following the example provided in the apollo-client doc (\"Updating query results with updateQueries\").\r\n\r\nThis is a React application where a logged-in user can save and retrieve bookmarks, which are simple objects with a few scalar properties. I have a BookmarkMenu component that shows the user's bookmarks as a list. A separate component (GraphViewer) has a button allowing them to save a new one. The query for the list goes through fine, but the mutation throws 'TypeError: fragments is undefined' and then every further action gets 'Interrupted by an error up the chain'.\r\n\r\nI've put the various parts of my code below. I've read through all the doc and issues I can find, and I've tried everything I can think of, including providing empty objects/arrays in the `fragments` param. But nothing has worked. I am not even sure why fragments are getting involved here (they're apparently not needed in the documentation example I'm following), so maybe that's where I'm going wrong. Can you help?\r\n\r\nThe gory details (error message is at the bottom):\r\nMy setup is based on react-apollo-starter-kit. Here's the client instantiation:\r\n```\r\nconst ApolloApiClient = new ApolloClient({\r\n  networkInterface,\r\n  shouldBatch: true,\r\n  dataIdFromObject: (obj) => obj.uuid\r\n});\r\n```\r\nHere is the query I'm using in the bookmark menu:\r\n```\r\n    bookmarks:\r\n    {\r\n        query: graphql[tick]\r\n          query getUserBookmarks($userId: String!) {\r\n            user (userId:$userId) {\r\n              uuid\r\n              bookmarks {\r\n                uuid\r\n                [... other properties]\r\n              }\r\n            }\r\n          }\r\n        [tick],\r\n        variables: {\r\n          userId: state.auth.user.userId\r\n        },\r\n        forceFetch: false,\r\n        returnPartialData: true,\r\n      }\r\n```\r\nWhen I submit this query in my GraphiQL server, it returns this:\r\n```\r\n{\r\n  \"data\": {\r\n    \"user\": {\r\n      \"uuid\": \"ba88e490-4e07-...\",\r\n      \"bookmarks\": [\r\n        { \"uuid\": \"933d9670-5761-...\", [other properties] },\r\n        { \"uuid\": \"964337c0-56d1-...\", [other properties] },\r\n        [...more bookmarks]\r\n      ]}}}\r\n```\r\nThis displays correctly in my React app (i.e. the list renders). The store shows:\r\n```\r\napollo:\r\n  data:\r\n    [an entry for each bookmark]\r\n    \"ba88e490-4e07-...\": {\r\n      \"uuid\": \"ba88e490-4e07-...\"\r\n      \"bookmarks\" [an entry for each bookmark]\r\n    }\r\n```\r\nSo far so good (I think). Now I want to add a bookmark and have it appear in the UI menu, preferably with optimistic rendering but definitely upon server response. Here's my mutation:\r\n```\r\nsaveBookmark: ([bookmark properties]) => ({\r\n  mutation: graphql[tick]\r\n    mutation createBookmark(\r\n      $createdBy: String!\r\n      [...other bookmark properties]\r\n    ) {\r\n      createBookmark(\r\n        createdBy: $createdBy\r\n        [...other bookmark properties]\r\n      ) {\r\n        uuid\r\n        [...other bookmark properties]\r\n      }\r\n    }\r\n  [tick],\r\n  variables: {\r\n    createdBy: state.auth.user.userId,\r\n    [...other properties]\r\n  },\r\n  updateQueries: {\r\n    getUserBookmarks: (previousQueryResult, { mutationResult }) => {\r\n        const bookmarks = [...previousQueryResult.user.bookmarks,\r\n                            mutationResult.data.createBookmark];\r\n        return { uuid: \"ba88e490-4e07-...\", bookmarks: bookmarks };\r\n    }\r\n  },\r\n  optimisticResponse: { [...other properties], uuid: '' }\r\n})\r\n```\r\nThis is what GraphiQL returns for that mutation:\r\n```\r\n{\r\n  \"data\": {\r\n    \"createBookmark\": {\r\n      \"uuid\": \"55aea0c0-5765-...\",\r\n      [...other properties]\r\n    }\r\n  }\r\n}\r\n```\r\nWhen I start the add from the UI, I can see from console logging that the mutation returns this:\r\n```\r\n{ \r\n  uuid: \"ba88e490-4e07-...\"\r\n  bookmarks: [\r\n    { uuid: \"130dfa70-5767-...\",  [...other properties]},\r\n    [...more bookmarks...]\r\n    { uuid: \"55aea0c0-5765-...\", [...other properties]}      <- the one I just created\r\n] }\r\n```\r\nIn Redux devtools, I see this:\r\n```\r\nAPOLLO_MUTATION_INIT\r\naction:\r\n  mutationString:[exactly as above]\r\n  mutationId:\"2\"\r\n  type:\"QUERY_RESULT\"\r\n  optimisticResponse: { [exactly as above] }\r\n  [...other properties...]\r\n  resultBehaviors/0/newResult: [exactly what's in the console log]\r\n  queryFragments:undefined\r\nTypeError: fragments is undefined\r\n\r\nAPOLLO_MUTATION_RESULT\r\naction: [...most of the 'action' property as above]\r\nInterrupted by an error up the chain\r\n```\r\nHere's the console stack trace:\r\n```\r\ncreateFragmentMap@[apollo-client/queries/getFromAST.js]\r\nmutationResultQueryResultReducer@[apollo-client/data/mutationResults.js]\r\ndata/<@[apollo-client/data/store.js, line 65]\r\ndata@[apollo-client/data/store.js, line 55]\r\noptimistic@[apollo-client/optimistic-data/store.js, line 19]\r\napolloReducer@[apollo-client/data/store.js, line 27]\r\n...\r\n```\r\nI've tried commenting out my optimisticResponse and I get the same result, erroring at the same line."},"comment":{"url":"https://api.github.com/repos/apollostack/apollo-client/issues/comments/236465952","html_url":"https://github.com/apollostack/apollo-client/issues/488#issuecomment-236465952","issue_url":"https://api.github.com/repos/apollostack/apollo-client/issues/488","id":236465952,"user":{"login":"margaretmoser","id":2442348,"avatar_url":"https://avatars.githubusercontent.com/u/2442348?v=3","gravatar_id":"","url":"https://api.github.com/users/margaretmoser","html_url":"https://github.com/margaretmoser","followers_url":"https://api.github.com/users/margaretmoser/followers","following_url":"https://api.github.com/users/margaretmoser/following{/other_user}","gists_url":"https://api.github.com/users/margaretmoser/gists{/gist_id}","starred_url":"https://api.github.com/users/margaretmoser/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/margaretmoser/subscriptions","organizations_url":"https://api.github.com/users/margaretmoser/orgs","repos_url":"https://api.github.com/users/margaretmoser/repos","events_url":"https://api.github.com/users/margaretmoser/events{/privacy}","received_events_url":"https://api.github.com/users/margaretmoser/received_events","type":"User","site_admin":false},"created_at":"2016-08-01T00:15:19Z","updated_at":"2016-08-01T00:15:19Z","body":"I'll give that a shot, thank you.\nOn Jul 31, 2016 5:06 PM, \"Tim Kennedy\" <notifications@github.com> wrote:\n\n> This looks like it's related to #470\n> <https://github.com/apollostack/apollo-client/issues/470> and #475\n> <https://github.com/apollostack/apollo-client/pull/475>, but I was able\n> to circumvent that by writing something similar to\n>\n> export default connect({  mapQueriesToProps: () => ({    data: {      query: gql`        query foos {          foos {            id          }        }      `,      fragments: [], // fix for https://github.com/apollostack/apollo-client/pull/475\n>     },\n>   }),  mapMutationsToProps: () => ({    deleteFoos: (id) => {\n>       return {        mutation: gql`          mutation DeleteFooMutation($input: DeleteFooMutationInput!) {            deleteFoo(input: $input) {              fooId            }          }        `,        variables: {          input: {            id,\n>           },\n>         },        updateQueries: {          foos: (previousQueryResult, { mutationResult }) => {\n>             const newResult = cloneDeep(previousQueryResult);\n>             const newFoos = previousQueryResult.foos.filter(\n>               foo => foo.id !== mutationResult.data.deleteFoo.fooId\n>             );            newResult.foos = newFoos;            return newResult;\n>           },\n>         },        optimisticResponse: {          deleteFoo: {            fooId: id,\n>           },\n>         },\n>       };\n>     },\n>   }),\n> })(ManageFoosComponent);\n>\n> The empty array of fragments had to be provided *to the query*, not to\n> the mutation.\n>\n> —\n> You are receiving this because you authored the thread.\n> Reply to this email directly, view it on GitHub\n> <https://github.com/apollostack/apollo-client/issues/488#issuecomment-236465430>,\n> or mute the thread\n> <https://github.com/notifications/unsubscribe-auth/ACVEbGMoc87fEB8YAtTcFnYK2EpUyt1Xks5qbTh9gaJpZM4JZJX6>\n> .\n>\n"}}
{"actor":{"display_login":"margaretmoser"}}