facebook / facebook/relay

Field being overridden when using Aliases and Directives

Open
#2,737 6 comments 0 reactions 0 assignees View on GitHub
wontfix
Dominant language
Rust
Stars
19k
Forks
1.9k
PR merge metrics
No merged PRs in 30d

Description

We have an issue when trying to use a GraphQL query that contains a field twice, once the field as in the schema and the second time used fwith a directive to be asinged to an alias.

The fragment of the query looks like the following:
`fragment evAccountsTransactionsFilters on EvAccount {
availableProducts {
contractId
productId
productName: productId @translate
}
}
`

The @translate directive returns a translated version of the productId.
The result from the server is this:
`availableProducts: [{contractId: "0010000000", productId: "SLPUP", productName: "Swiss Life FlexSave Uno"},{contractId: "0010000001", productId: "SLHUP", productName: "Swiss Life Champion Uno"},{contractId: null, productId: null, productName: null}]`

So we do get it back from the server as expected.
The `data` object in the `` contains both fields but with the same value:

`availableProducts: [{contractId: "0010000000", productId: "Swiss Life FlexSave Uno", productName: "Swiss Life FlexSave Uno"},{contractId: "0010000001", productId: "Swiss Life Champion Uno", productName: "Swiss Life Champion Uno"},{contractId: null, productId: null, productName: null}]`

If I place the alias line before the line with the field itself in the query it is the other way round. Then both properties of the data object contain just the product code but not the translation.

Also, when debugging with the Relay DevTools, the store contains only the field productId where we would have expected the alias productName to be there, too.

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the fragment with both the schema field and the aliased @translate field, then inspect the data object in QueryRenderer and the corresponding Relay DevTools store entry. Done means productId retains its original value while productName retains the translated value, regardless of query field order.

Written by the indexing model from the issue text.

Assessment

Tech stack
graphql, javascript, react
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.