Woocommerce products can not be queried in another language

[cankahya]

Describe the bug
It is not possible to query woocommerce products for another locale, using wp-graphql-wpml

To Reproduce
The following query should return the english versions of the products. Instead it returns the main locale (german in this case):
Query
{ products(where: {wpmlLanguage: "en"}) { nodes { id slug name ... on SimpleProduct { id name buecherFields { buchKategorien { nodes { name slug } } } buchInfos { buchInfos } locale { locale id } } } } }

Response

{
"data": {
"products": {
"nodes": [
{
"id": "cHJvZHVjdDoxMDE4Mg==",
"slug": "sollberger-boegli",
"name": "Sollberger Bögli",
"buecherFields": {
"buchKategorien": {
"nodes": [
{
"name": "De aedibus",
"slug": "de-aedibus"
}
]
}
},
"buchInfos": {
"buchInfos": "

Herausgegeben von: Heinz Wirz
\nTextbeitrag: Katharina Marchal

\n"
},
"locale": {
"locale": "de_DE",
"id": "de_DE"
}
},
....

Expected behavior
The products should be returned in english.

Screenshots

Desktop (please complete the following information):

• OS: macOs
• Browser Chrome
• Version 124.0.6367.118 (Offizieller Build) (arm64)

Plugin Versions

[cankahya]

Not sure if this is a bug with wp-graphql-wpml or wp-graphql-woocommerce. Clarifcation would be great!

This is a very crucial feature, which makes the use of graphql for multilangual woocommerce sites impossible.
Please priotize. Also happy Thanks for any tip!

[creative-andrew]

@cankahya I think it might be an issue with wp-graphql-wpml as wp-graphql-woocommerce doesn't interact with translations. Have you tried to contact wpml?

[creative-andrew]

I've also noticed that you are using this version https://github.com/rburgst/wp-graphql-wpml, which seems to be unmaintained.

Have you tried with the official one from here https://wpml.org/documentation/related-projects/wpml-graphql/?

Their version is from 2023 https://wpml.org/compatibility/2023/05/wpml-graphql-build-headless-multilingual-wordpress-sites/

[cankahya]

@creative-andrew Thanks for taking your time looking into this. I will test the plugin you suggested and report my findings :)

[creative-andrew]

@cankahya any news from this?

[dotZak]

I have a suspicion this is happening because of the difference between a Product and a ProductUnion.

The way to test this is to open up WPML GraphQL's wpml-graphql/classes/Hooks/ObjectType/LanguageType.php and add…

register_graphql_field(
    'RootQueryToProductUnionConnectionWhereArgs',
    self::FILTER_NAME,
    [
        'type'        => self::MAIN_FIELD_TYPE,
        'description' => __('Filter product unions by language code', 'wp-graphql-wpml'),
    ]
);

After that, the language query works as expected, e.g.

fragment ProductContentFragment on ProductUnion {
  id
  databaseId
  slug
  name
}

query GetProductsInEnglish {
  products(first: 100, where: {status: "publish", language: "en"}) {
    nodes {
      ...ProductContentFragment
      ... on SimpleProduct {
        name
      }
    }
  }
}

query GetProductsInTraditionalChinese {
  products(first: 100, where: {status: "publish", language: "zh-hant"}) {
    nodes {
      ...ProductContentFragment
      ... on SimpleProduct {
        name
      }
    }
  }
}

Plugins:
WPGraphQL 1.28.1
WPML 4.6.13
WPGraphQL WooCommerce (WooGraphQL) 0.21.0
WPML GraphQL 1.1.1

[dotZak]

Querying individual Products by slug to get their translation

Given the following fragment:

fragment BasicProductContent on Product {
  __typename   # e.g. "SimpleProduct"
  type         # e.g. "SIMPLE"
  id           # The GraphQL ID
  databaseId   # The WP post's database ID
  sku          # A manually configured attribute of the WP post
  
  languageCode # 'en' or 'zh-hant'
  
  guid         # A URI using the WP post's database ID
  link         # The complete URI to the WP post using the slug
  uri          # All the path parameters for the WP post
  slug         # The WP post's slug path parameter
}

Query: Native language

query SimpleProductNativeLanguage {
  product(id: "native-slug", idType: SLUG) {
    ...BasicProductContent

  }
}

Response

{
  "data": {
    "product": {
      "__typename": "SimpleProduct",
      "type": "SIMPLE",
      "id": "graphql-id-obfuscated-native",
      "databaseId": 1234,
      "sku": "SKU0001",
      "languageCode": "en",
      "guid": "https://www.domain.com/?post_type=product&p=1234",
      "link": "https://www.domain.com/shop/native-slug/",
      "uri": "/shop/native-slug/",
      "slug": "native-slug"
    }
  }
}

Query: Translation

query SimpleProductListingTranslation {
  product(id: "translated-slug", idType: SLUG) {
    ...BasicProductContent
  }
}

Response

{
  "data": {
    "product": {
      "__typename": "SimpleProduct",
      "type": "SIMPLE",
      "id": "graphql-id-obfuscated-translated",
      "databaseId": 4321,
      "sku": "SKU0001",
      "languageCode": "zh-hant",
      "guid": "https://www.domain.com/?post_type=product&p=4321",
      "link": "https://www.domain.com/shop/native-slug/",
      "uri": "/shop/native-slug/",
      "slug": "translated-slug"
    }
  }
}

Querying for translations of the base product

GIVEN: the above works, so we know that we have working products and translations.
GIVEN: the following fragment.

fragment TranslationsOfProductContent on Product {
  __typename
  languageCode
  translations {
    language {
      language_code
    }
  }
}

Query: Native Language with translations

query ProductNativeLanguageWithTranslations {
  product(id: "three-languages-matching-board", idType: SLUG) {
    ...TranslationsOfProductContent

  }
}

Response

{
  "errors": [
    {
      "message": "Internal server error",
      "extensions": {
        "category": "internal"
      },
      "locations": [
        {
          "line": 278,
          "column": -11
        }
      ],
      "path": [
        "product",
        "translations",
        0
      ]
    }
  ],
  "data": {
    "product": {
      "__typename": "SimpleProduct",
      "languageCode": "en",
      "translations": [
        null
      ]
    }
  }
}