GraphQL Error field type must be Input Type but got:

JavascriptGraphql

Javascript Problem Overview


Here is the mutation:

const createNotebook = mutationWithClientMutationId ({
    name: 'CreateNotebook',
    inputFields: {
        token: {
            type: GraphQLString,
        },

        details: {
            type: NotebookDetails,
        },
    },
    outputFields: {

    },
    async mutateCRNotebook(input, context) {
        const data = getJSONFromRelativeURL(input.token);

    },
});

Here is the schema used in the details field of the mutation:

const NotebookDetails = new GraphQLObjectType({
    name: 'NotebookDetails',
    interfaces: [nodeInterface],

    fields: () => ({
		id: globalIdField('NotebookDetails'),

		description: {
			type: GraphQLString,
			description: '...',
			resolve(obj) {
				return obj.description;
			},
		},

		language: {
			type: GraphQLString,
			description: '...',
			resolve(obj) {
				return obj.language;
			},
		},

	}),

});

Error I am getting on running this code is :

api_1    | Error: CreateNotebookInput.details field type must be Input Type but got: NotebookDetails.
api_1    |     at invariant (/usr/src/app/node_modules/graphql/jsutils/invariant.js:19:11)
api_1    |     at /usr/src/app/node_modules/graphql/type/definition.js:698:58
api_1    |     at Array.forEach (native)
api_1    |     at GraphQLInputObjectType._defineFieldMap (/usr/src/app/node_modules/graphql/type/definition.js:693:16)
api_1    |     at GraphQLInputObjectType.getFields (/usr/src/app/node_modules/graphql/type/definition.js:682:49)
api_1    |     at typeMapReducer (/usr/src/app/node_modules/graphql/type/schema.js:224:26)
api_1    |     at typeMapReducer (/usr/src/app/node_modules/graphql/type/schema.js:190:12)
api_1    |     at Array.reduce (native)
api_1    |     at /usr/src/app/node_modules/graphql/type/schema.js:217:36
api_1    |     at Array.forEach (native)
api_1    |     at typeMapReducer (/usr/src/app/node_modules/graphql/type/schema.js:210:27)
api_1    |     at Array.reduce (native)
api_1    |     at new GraphQLSchema (/usr/src/app/node_modules/graphql/type/schema.js:98:34)
api_1    |     at Object.<anonymous> (/usr/src/app/src/schema/index.js:39:16)
api_1    |     at Module._compile (module.js:569:30)
api_1    |     at Object.Module._extensions..js (module.js:580:10)

I have used this syntax with queries and they worked correctly. But, they are returning error with a mutation. What is incorrect in my code and how do I correct it?

Javascript Solutions


Solution 1 - Javascript

In GraphQL, an input cannot be used as a type and a type cannot be used as an input. Unfortunately, even if the fields appear identical to an existing type, you always have to define a separate input to use as an argument. Try something like this:

const NotebookDetailsInput = new GraphQLInputObjectType({
  name: 'NotebookDetailsInput',
  fields: () => ({
    id:          { type: GraphQLID },
    description: { type: GraphQLString },
    language:    { type: GraphQLString }, 
  })
});

If using SDL, the same type would look like this:

input {
  id: ID
  description: String
  language: String
}

Please see this answer for an extensive explanation of why it's necessary to do this.

Solution 2 - Javascript

For those who are using graphql-tools and stumble accross this post, documentation is here at GraphQL's Website.

My Example using graphQL tools is here below: (this has an input inside of an input AKA an ImageInput inside the SocialPostInput)

//mutation file

extend type Mutation {
    SchedulePost ( 
        socialPost: SocialPostInput,
        schedule: ScheduleInput
     ): ScheduledPost
}`

//Schedule and SocialPost file

type Image {
    id: String
    url: String
}
type SocialPost {
    id: String
    GCID: String
    message: String
    image: Image
}
input ImageInput {
    url: String
}
input SocialPostInput {
    GCID: String
    message: String
    image: ImageInput
}
type Schedule {
    id: String
    month: Int
    date: Int
    hour: Int
    minute: Int
}
input ScheduleInput {
    id: String
    month: Int
    date: Int
    hour: Int
    minute: Int
}`

Solution 3 - Javascript

If you describe schema within schema.graphql file, just replace type to input:

Wrong:

type SomeData {
  someField: String!
}

Right:

input SomeData {
  someField: String!
}

Solution 4 - Javascript

Here is the schema used in the details field of the mutation

const NotebookDetails = new GraphQLObjectType({
    name: 'NotebookDetails',
    fields: () => ({
        id: { type: GraphQLID },
        description: { type: GraphQLString },
        language: { type: GraphQLString },

    }),

});

Solution 5 - Javascript

Please change type CreateNotebookInput to input CreateNotebookInput

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionlee huangView Question on Stackoverflow
Solution 1 - JavascriptDaniel ReardenView Answer on Stackoverflow
Solution 2 - JavascriptKevin DanikowskiView Answer on Stackoverflow
Solution 3 - JavascriptzemilView Answer on Stackoverflow
Solution 4 - JavascriptMD SHAYONView Answer on Stackoverflow
Solution 5 - JavascriptPhuc TrinhView Answer on Stackoverflow