Getting TypeError

[johncherba]

Hello,

I am getting the following error when using the plugin:

Initializing plugins...
Load sources - 3.89s
TypeError: schemaComposer.get(...).hasInterface is not a function
    at createTypeComposers (/Users/johncherba/IdeaProjects/dotcom-gridsome/node_modules/gridsome/lib/graphql/nodes/index.js:72:41)
    at createNodesSchema (/Users/johncherba/IdeaProjects/dotcom-gridsome/node_modules/gridsome/lib/graphql/nodes/index.js:30:3)
    at createSchema (/Users/johncherba/IdeaProjects/dotcom-gridsome/node_modules/gridsome/lib/graphql/createSchema.js:59:3)
    at Schema.buildSchema (/Users/johncherba/IdeaProjects/dotcom-gridsome/node_modules/gridsome/lib/app/Schema.js:28:28)
    at Plugins.createSchema (/Users/johncherba/IdeaProjects/dotcom-gridsome/node_modules/gridsome/lib/app/Plugins.js:94:22)
    at processTicksAndRejections (internal/process/task_queues.js:94:5)
MacBook-Pro:dotcom-gridsome$ gridsome -v
@gridsome/cli v0.3.1
gridsome v0.7.13

In gridsome.config.js there is:

plugins: [
    {
      use: '@meeg/gridsome-source-kentico-kontent',
      options: {
        deliveryClientConfig: {
          projectId: process.env.KENTICO_KONTENT_PROJECT_ID
        }
      }
    },
  ],

and the schema it's trying to pull is, it should do it automagically but here is the schema.graphql file:

type SystemInfo {
    id: String!
    name: String!
    codename: String!
    language: String!
    type: String!
    lastModified: String!
}
interface ContentItem {
    system: SystemInfo!
}
type MultipleChoiceElementOption {
    name: String!
    codename: String
}
type TaxonomyTerm {
    name: String!
    codename: String
}
type Asset {
    name: String
    type: String
    size: Int
    description: String
    url: String
    width: Int
    height: Int
}
type Link {
    codename: String
    itemID: String
    urlSlug: String
    type: String
}
type RichTextImage {
    imageId: String!
    url: String!
    description: String
    width: Int
    height: Int
}
type TextElement {
    type: String!
    name: String!
    value: String
}
type NumberElement {
    type: String!
    name: String!
    value: Int
}
type DateTimeElement {
    type: String!
    name: String!
    value: String
}
type MultipleChoiceElement {
    type: String!
    name: String!
    value: [MultipleChoiceElementOption]
}
type UrlSlugElement {
    type: String!
    name: String!
    value: String
}
type TaxonomyElement {
    type: String!
    name: String!
    value: [TaxonomyTerm]
    taxonomyGroup: String
}
type AssetElement {
    type: String!
    name: String!
    value: [Asset]
}
type RichTextElement {
    type: String!
    name: String!
    value: String
    linkedItemCodenames: [String]
    links: [Link]
    images: [RichTextImage]
    resolvedHtml: String
}
type LinkedItemsElement {
    type: String!
    name: String!
    value: [ContentItem]
    itemCodenames: [String]
}
type CustomElement {
    type: String!
    name: String!
    value: String
}

type CarouselCardContentType implements ContentItem {
    system: SystemInfo!
    icon: LinkedItemsElement
    customer_story: LinkedItemsElement
    demo: LinkedItemsElement
    solution: TaxonomyElement
    video: LinkedItemsElement
    card_content: LinkedItemsElement
    whitepaper: LinkedItemsElement
    value_proposition: LinkedItemsElement
    url: TextElement
    overview_deck: LinkedItemsElement
    pdf: AssetElement
    use_case: TaxonomyElement
    carousel_content_types: TaxonomyElement
    card_title: TextElement
    original_content_link: TextElement
    visibility: TaxonomyElement
}

type CustomerStoryContentType implements ContentItem {
    system: SystemInfo!
    original_content_link: TextElement
    image: LinkedItemsElement
    use_case: TaxonomyElement
    lob: TaxonomyElement
    industry: TaxonomyElement
    url: TextElement
    content: AssetElement
    description: TextElement
    solution: TaxonomyElement
}

type DemoContentType implements ContentItem {
    system: SystemInfo!
    solution: TaxonomyElement
    description: TextElement
    pdf: AssetElement
    industry: TaxonomyElement
    original_content_link: TextElement
    video: TextElement
    use_case: TaxonomyElement
    image: LinkedItemsElement
    lob: TaxonomyElement
    app: TextElement
}

type HomepagePackageContentType implements ContentItem {
    system: SystemInfo!
    lob_description: TextElement
    metadata__metadata_description: TextElement
    industry_description: TextElement
    lob_industry_title: LinkedItemsElement
    metadata__metadata_title: TextElement
    anaplan_navigator: UrlSlugElement
    industry_tagline: TextElement
    intro_video: LinkedItemsElement
    intro_text: TextElement
    lob_tagline: TextElement
    banner_image: LinkedItemsElement
    intro_title: TextElement
}

type ImageContentType implements ContentItem {
    system: SystemInfo!
    image_use_description: TextElement
    lob: TaxonomyElement
    image: AssetElement
    industry: TaxonomyElement
    accessibility_description: TextElement
}

type IndustrySubSectorContentType implements ContentItem {
    system: SystemInfo!
    short_text: TextElement
    solution_package: LinkedItemsElement
    industry: TaxonomyElement
    medium_text: TextElement
    icon: AssetElement
}

type LobIndustryContentType implements ContentItem {
    system: SystemInfo!
    sitemap: TaxonomyElement
    banner_image: LinkedItemsElement
    industry: TaxonomyElement
    short_text: TextElement
    lob: TaxonomyElement
    medium_text: TextElement
}

type LobIndustryLandingPackageContentType implements ContentItem {
    system: SystemInfo!
    metadata__metadata_description: TextElement
    lob_industry: LinkedItemsElement
    metadata__metadata_title: TextElement
    anaplan_navigator: UrlSlugElement
    industry_sub_sector: LinkedItemsElement
    type: TaxonomyElement
    icon: AssetElement
    solution_package: LinkedItemsElement
}

type NavigationItemContentType implements ContentItem {
    system: SystemInfo!
    metadata__metadata_description: TextElement
    metadata__metadata_title: TextElement
    url: UrlSlugElement
    page_item: LinkedItemsElement
    subitems: LinkedItemsElement
    sitemap: TaxonomyElement
    title: TextElement
    description: TextElement
}

type OverviewContentType implements ContentItem {
    system: SystemInfo!
    description: TextElement
    original_content_link: TextElement
    pdf: AssetElement
}

type SolutionPackageContentType implements ContentItem {
    system: SystemInfo!
    video: LinkedItemsElement
    icon: AssetElement
    use_cases: LinkedItemsElement
    carousel_card_s_: LinkedItemsElement
    multi_length_description__long_text: TextElement
    multi_length_description__medium_text: TextElement
    differentiator___medium_text: TextElement
    sitemap: TaxonomyElement
    multi_length_description__short_text: TextElement
    connections_image: LinkedItemsElement
    solution: TaxonomyElement
    lob: TaxonomyElement
    differentiator___short_text: TextElement
    industry: TaxonomyElement
    differentiator___long_text: TextElement
}

type StandardPackageDescriptionsContentType implements ContentItem {
    system: SystemInfo!
    medium_description: TextElement
    short_description: TextElement
    image: LinkedItemsElement
}

type UseCasePackageContentType implements ContentItem {
    system: SystemInfo!
    scoping_checklist_description: LinkedItemsElement
    anaplan_navigator: UrlSlugElement
    metadata__metadata_description: TextElement
    carousel_card_s_: LinkedItemsElement
    solution: TaxonomyElement
    architectural_overview_description: LinkedItemsElement
    architectural_overview___original_content_link: TextElement
    metadata__metadata_title: TextElement
    banner_image: LinkedItemsElement
    scoping_checklist_pdf: AssetElement
    icon: AssetElement
    sitemap: TaxonomyElement
    scoping_checklist___original_content_link: TextElement
    multi_length_description__long_text: TextElement
    multi_length_description__medium_text: TextElement
    best_practices_video: LinkedItemsElement
    architectural_overview_pdf: AssetElement
    architectural_overview_image: LinkedItemsElement
    industry: TaxonomyElement
    multi_length_description__short_text: TextElement
    best_practices_description: LinkedItemsElement
    use_case: TaxonomyElement
    lob: TaxonomyElement
}

type ValuePropositionContentType implements ContentItem {
    system: SystemInfo!
    url: TextElement
    pdf: AssetElement
    description: TextElement
    original_content_link: TextElement
}

type VideoContentType implements ContentItem {
    system: SystemInfo!
    caption: TextElement
    lob: TaxonomyElement
    use_case: TaxonomyElement
    visibility: TaxonomyElement
    description: TextElement
    industry: TaxonomyElement
    solution: TaxonomyElement
    video_url: TextElement
}

type WhitepaperContentType implements ContentItem {
    system: SystemInfo!
    pdf: AssetElement
    description: TextElement
    original_content_link: TextElement
    url: TextElement
}

On newly created projects gridsome has worked great. I think it may be an issue with this plugin trying to parse data that has not had logic written for it in the plugin, I've tried to debug but need to learn more on how to get verbose output if that's possible from plugin.

Thanks! Any help appreciated.

[markcoole]

Hey @johncherba,

Not sure if i'll be able to help. Do you have any custom elements, nested content types or additional languages?

[johncherba]

Hey @markcoole

Thanks for the reply. We do not have custom elements or additional languages. I did talk to the person who said we had nested content types but I am not sure how to identify them by looking at the schema I posted above. Could this be the issue of having to many nested content types or require a cleaner way to organize data? This is a port from a previous solution that we are building.

Thanks for your help!

[johncherba]

@markcoole I also was looking at debug. Would that be an option in this case to see specifically where it's breaking? If so, would this be easy to set up for the project? (maybe an example of how to configure?)

[markcoole]

@johncherba I've not used the debug npm package before so I can't advise.

You can clone the plugin and point your local build to it. Then log where the schema is built and see what is output and at what point it breaks. That might yield some idea on where it's failing.

I've tried creating some heavily nested content types but they appear to work fine.

Is this a new project or existing? Is there currently any front end code to it?

Just wondering if it's an existing code project can you create a new gridsome project, install the plugin, point it to your existing Kentico Kontent project and build the schema?

Is there a way you can set up something similar with nested types? Trying to think of a good way to help but I need to replicate it first.

[johncherba]

@markcoole I did get debug to work, it's easy to do to see what the plugin is doing without cloning the plugin. Thanks for pointing that out though and it will be useful if I can actually break on the function. If your interested you can see debug info by putting this in terminal:

DEBUG=gridsome-source-kentico-kontent:* gridsome develop or similar...might need to install debug npm.

It gives really good output so I'm looking for clues. I might have narrowed it down to the Content Type that is throwing the error.

I started a new project and tried it. I also forked another project and tried it. I have other gridsome projects and PoC that are working fine and pointing to less complicated Kontent projects. I will see if I can share or replicate existing Kontent that does break it.

Thanks for your help and I hope you are having a good monday.

[markcoole]

@johncherba Yeah. It suggests something is missing when the node is being made. I tried the debug mode that you suggested. Pretty good to see the output. I've tried to break it my end as much as I can but no success. I wondered if it had something to do with file types. There's an enum in the asset resolver which doesn't include pdfs. I saw you have an asset element which is pdf. Nested content types with file types it's not sure what to do with? Not sure. If you do find the cause please let me know!

[johncherba]

@markcoole Thanks for the file type suggestion. I did try a pdf file type upload, created an asset Content Type and then added it to another containing Content Type in another project and it worked. :/

Still hunting it down, I'm going to look at your 'something is missing when the node is being made'...

[markcoole]

@johncherba is this a new issue? Do you have more than 2000 content items?

From the 1st of February the /items endpoint is limited to 2000 (incl. linked items) as described in Kontent API changes.

Can you try going to https://deliver.kontent.ai/{projectID}/items and see if the object that returns is complete and whole?

[johncherba]

@markcoole wow, okay. Thanks again. Here's what I found in Headers:

x-request-charge: 432

and when I search the deliver url and search for modular_content I get 1/1,939 hits... hmmm.

It appears complete and whole (i'm going to check with another dev), could this be the issue?

[markcoole]

@johncherba I'm not sure. I remember at one point they said it would be limited to 1000 but docs now say 2000. 432 seems fine though.

You could try lowering the depth and see if that helps. It would at least rule it out maybe. I think you set it in the config.

plugins: [ { use: '@meeg/gridsome-source-kentico-kontent', options: { deliveryClientConfig: { projectId: process.env.KENTICO_KONTENT_PROJECT_ID, contentItemsDepth: 1 } } }, ]

By default it is set to 3 so try 1 or 0 maybe? I'm clutching at straws but it's all trial and error.

[johncherba]

@markcoole okay found what the issue was! We were using Kontent from a couple iterations back. We had an 'Image' Content Type so we could add alt, etc. to an Asset. The 'Image' Content Type was then used in another Content Type and declared as an Asset when it should be a Linked Item. It really should be just an Asset and not an embedded 'Image' Content Type is the best approach and not use a custom 'Image' Content Type because this has been resolved. Sorry if this is confusing. Let me know if I can explain better.

Thanks for all your help. Let me know if I can return the favor in any way.

[CMeeg]

Hi @johncherba, sorry to hear you've been having issues and I'm glad it sounds like you have sorted them out. Thanks @markcoole for helping out - I appreciate it.

It may be a moot point now you've sorted this out, but if it's helpful for future this is how I've been debugging (when the log output from the debug module is not enough):

• Open up your Gridsome project that is having the issue in VS Code
• Click the "Run & Debug" view
• Click the "create a launch.json file" link in the sidebar and select any environment (it doesn't matter because we will replace the generated output)
• Add the config from this GitHub issue to your launch.json file, replacing the generated output
• In the "Explorer" view open node_modules/@meeg/gridsome-source-kentico-kontent/src/KenticoKontentSource.js
• Attach a breakpoint at the start of the load function (or anywhere you fancy really!)
• Back in the "Run & Debug" view click "Start Debugging"
• Your breakpoint should get hit - occasionally the debugger attaches, but the Gridsome process doesn't start so I just stop and start debugging when that happens

If there is an issue that you need to work around you can also at that point fork the plugin repo, use yarn link, change the source code, test using your project and submit a PR (if you want to!).

I will add the above to the readme as it occurs to me that would be useful to have that documented.

I have been inactive on this project for a little while, but hoping to get some time to get back on top of things soon and catch up with all things Gridsome and Kontent. If you have any further feedback or suggestions for this plugin I'd be glad to hear from you (and you @markcoole - I will review your PR this week)!

[johncherba]

@CMeeg No issues! lol. Just doing my job. Thanks for the debug info. I did use your debug documentation that currently exists in the readme and it did help me track down the offending Kontent data, so thank you. Appreciate you letting me and @markcoole collaborate on this repo even though it was an issue with the data in Kontent and not with your awesome plugin. Thanks for all your work on this and I will try the debug solution you provided when needed.

Again, thanks @markcoole and @CMeeg for helping out! Really appreciate the dev community sometimes!!