Fragments are displaying as empty in queries

[nanocatdemen]

Describe the bug Fragments are displaying as empty in queries

To Reproduce

1. Make this query to https://demo.saleor.io/graphql/

   const {
   result,
   loading,
   error,
   } = useQuery(gql`
   fragment Pricing on TaxedMoney {
   currency
   gross {
     amount 
   }
   }
   query GetFeaturedProducts {
   products(first: 4, channel: "default-channel") {
     edges {
       node {
         id
         name
         thumbnail {
           url
           alt
         }
         pricing {
           onSale
           discount {
             ...Pricing
           }
           priceRange {
             start {
               ...Pricing
             }
           }
           priceRangeUndiscounted {
             start {
               ...Pricing
             }
           }
         }
       }
     }
   }
   }
   `);

2. Check result.value?.products.edges[0].node.pricing.priceRange.start. It is empty.

Expected behavior It shouldn't be empty. The response contains the requested data

Versions vue: ^3.0.0 @vue/apollo-composable: ^4.0.0-alpha.19, vue-apollo: -- @apollo/client: ^3.6.9

[websitevirtuoso]

It works for me but I use queries in files

like this

#import "../fragments/listing.fragment.gql"
#import "../fragments/listingMedia.fragment.gql"
#import "../fragments/listingTerm.fragment.gql"
#import "../fragments/listingType.fragment.gql"

mutation ListingUpsert(
  $id: ID
  $description: String!
  $status: listing_status!
  $price: Int!
  $deposit: Int
  $address: String!
  $postal_code: String!
  $term_id: ID
  $lat: Float!
  $lng: Float!
  $pets: [listing_pets]!
  $bedrooms: Int!
  $bathrooms: Float!
  $square_feet: Int!
  $type_id: ID!
  $user_id: ID!
  $city_id: ID!
  $expire_at: Date!
  $available_at: Date
  $features: Json!
  $media: [Media!]!
) {
  listingUpsert(
    id: $id
    description: $description
    status: $status
    price: $price
    deposit: $deposit
    address: $address
    postal_code: $postal_code
    lat: $lat
    lng: $lng
    pets: $pets
    bedrooms: $bedrooms
    bathrooms: $bathrooms
    square_feet: $square_feet
    type_id: $type_id
    term_id: $term_id
    user_id: $user_id
    city_id: $city_id
    expire_at: $expire_at
    available_at: $available_at
    features: $features
    media: $media
  ) {
    ...ListingFragment
    bathrooms
    bedrooms
    description
    initiator {
      id
      name
      url
    }
    available_at
    expire_at
    pets
    lat
    lng
    postal_code
    square_feet
    term {
      ...ListingTermFragment
    }
    media {
      ...ListingMediaFragment
    }
    type {
      ...ListingTypeFragment
    }
  }
}

[quangnmwork]

I have same issue . Looking for solution

[whaaaley]

Same. I made a ticket, then saw this. My notes are here: https://github.com/vuejs/apollo/issues/1525

I'm not super familiar with the code base but it does look concerning that the ref and the output of onResult don't receive the same treatment here. (Fragments work with onResult just fine) https://github.com/vuejs/apollo/blob/v4/packages/vue-apollo-composable/src/useQuery.ts#L339

[whaaaley]

The problem stems from the fetchPolicy. If you set it to "no-cache" they work fine, so the problem could maybe more accurately be "Any fetch policy but "no-cache" breaks fragments" -- Or a misunderstanding of what typeName is for. Do you guys have typeName set to false?

[Akryum]

I can't reproduce, please provide a runnable reproduction.