apollographql / apollographql/apollo-client
MockedProvider matches queries with fragments only if fragments are included in the same order as they're used
- Dominant language
- TypeScript
- Stars
- 19.8k
- Forks
- 2.9k
- Avg merge
- 11h 14m
- Merged PRs (30d)
- 18
Description
**Intended outcome:**
`MockedProvider` should successfully match the mock to the query regardless of where fragments are included (`${...}`) in the query.
**Actual outcome:**
Mock is not returned by `MockProvider`. The hook `{ data, error } = useQuery(...)` retruns `data === undefined` and `error === null`
**How to reproduce the issue:**
This query works using the "standard" provider in production, but fails to match when using `MockProvider`
```graphql
query FileUploadPage($hash: String!) {
currentAccount: getCurrentAccount {
...FileUploadCard_Account
}
dataProvider: getDataProviderByHash(hash: $hash) {
id
name
isEnabled
dataSources {
items {
...FileUploadCard_DataSource
}
}
uploadPage {
welcomeText
}
version
}
}
${FileUploadCardDataSourceFragment}
${FileUploadCardAccountFragment}
`;
```
Flipping the order in which fragments are included will make it work:
instead of
```graphql
${FileUploadCardDataSourceFragment}
${FileUploadCardAccountFragment}
```
use
```graphql
${FileUploadCardAccountFragment}
${FileUploadCardDataSourceFragment}
```
**Versions**
```
System:
OS: Linux 5.4 Ubuntu 20.04.2 LTS (Focal Fossa)
Binaries:
Node: 15.8.0 - /usr/bin/node
Yarn: 1.22.5 - /usr/bin/yarn
npm: 7.5.1 - /usr/bin/npm
Browsers:
Chrome: 88.0.4324.150
Firefox: 85.0.1
npmPackages:
@apollo/client: ^3.2.1 => 3.3.7
apollo-link-schema: ^1.2.4 => 1.2.5
apollo-link-serialize: ^3.1.1 => 3.1.1
apollo-sentry-link: ^1.2.1 => 1.2.1
react-apollo: ^2.5.8 => 2.5.8
storybook-addon-apollo-client: ^4.0.3 => 4.0.6
```
Contributor guide
Research direction
Start by reproducing the reported query with MockedProvider, using the two fragment inclusion orders shown in the issue, and compare the matching behavior with the standard provider. The issue is done when MockedProvider returns the mock successfully regardless of fragment order, without changing the production query.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- graphql, typescript
- Domain
- testing-qa
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100