question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Inline Fragments aren't exported

See original GitHub issue

I was led to this plugin due to an issue I had over at gatsby-plugin-graphql-codegen. The author recommended I try this plugin to see if it solved it, and it didn’t, so I figured I’d open an issue here as well.

There’s more context on the other issue, but generally the inline fragments that are generated on subtypes of an interface aren’t exported, leading to a need to duplicate those types.

//
// the inline fragments below generate useful types that aren't exported
//
export const WidgetFragment = graphql`
  fragment WidgetFragment on Widget {
    widgetId
    widgetType
    ... on ImageListWidget {
      images {
        ...ImageFragment
      }
    }
    ... on ImageWidget {
      image {
        ...ImageFragment
      }
    }
  }
`;

//
// these types aren't exported, so cannot be used as WidgetProps
//
type WidgetFragment_ImageSliderWidget_Fragment = (
  Pick<ImageSliderWidget, 'widgetId' | 'widgetType'>
  & { images: Array<Maybe<ImageFragmentFragment>> }
);

type WidgetFragment_ImageWidget_Fragment = (
  Pick<ImageWidget, 'widgetId' | 'widgetType'>
  & { image: Maybe<ImageFragmentFragment> }
);

//
// only this type is exported
//
export type WidgetFragmentFragment = WidgetFragment_ImageSliderWidget_Fragment | WidgetFragment_ImageWidget_Fragment;

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

2reactions
johnromcommented, Feb 20, 2020

Looks like the missing config setting is below. I wonder if this can be configured outside of your plugin in a config file? I’m not sure if codegen.yml can be inherited by CLI configuration. Let me know if there’s some way to override the configuration or if you’re willing to export these types in the default configuration, in which case I can open a PR.

I confirmed making this change in node_modules/gatsby-plugin-typegen/workers/codegen.js does what I need.

@graphql-codegen/typescript-operations: config.exportFragmentSpreadSubTypes

0reactions
johnromcommented, Feb 22, 2020

Yes, in the example I gave in the initial descriptions, you can see the exact prop types for <ImageWidget /> and <ImageSliderWidget /> are created but not exposed. This is for spread subtype fragments. I could maybe go with a union type as a workaround if those fragments are exported (haven’t tried), but it doesn’t make that much sense since these types inherit from a common interface.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Fragments - Apollo GraphQL Docs
You can declare fragments in any file of your application. The example above export s the fragment from a fragments. js file. We...
Read more >
Exporting and Importing Fragments
To export individual Fragments, Click on the Collection that you want to export the fragment from. ) Export next to the Collection name....
Read more >
Flow errors on <React.Fragment> or <></>, but not ...
When I dig into the react.js lib def referenced in the error it does appear that the error is factually correct - the...
Read more >
GraphQL Directives
@arguments is a directive used to pass arguments to a fragment that ... that [JSModule].relayprovider.js exists and exports a get() function.
Read more >
Understanding C++ Modules: Part 3: Linkage and Fragments
Taking the address of an inline function will yield the same ... Entities earn module linkage if they are not internal, not export...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found