relay
relay copied to clipboard
@relay_test_operation fragment `query` doesn't work as expected.
originally brought to GraphQL discord, but nobody seems to understand why there so wondering if anybody else can shed light on this.
Getting an error related to a missing fragment with the below test setup. The query works fine when not used in a test setting and hydrates the component with the result, but in my test rig, I get:
Error: Uncaught [Invariant Violation: Relay: Expected to receive an object where ...FileUpload_files was spread, but the fragment reference was not found. This is most likely the result of: - Forgetting to spread FileUpload_files in usePaginationFragment()'s parent's fragment. - Conditionally fetching FileUpload_files but unconditionally passing a fragment reference prop to usePaginationFragment().
Test setup looks like:
const testQuery = graphql`
query fileUploadTestQuery(
$first: Int
$after: String
$filter: FileUploadFilter
) @relay_test_operation {
...FileUpload_files
@arguments(first: $first, after: $after, filter: $filter)
}
`;
describe("File Upload Intergration", () => {
const TestRenderer = () => {
const data = useLazyLoadQuery(testQuery, {
first: 20,
after: null,
filter: null,
});
console.log(data);
return <FileUpload files={data.bank} />;
};
const filesFragment = graphql`
fragment FileUpload_files on Query
@argumentDefinitions(
first: { type: "Int", defaultValue: 20 }
after: { type: "String", defaultValue: null }
filter: { type: "FileUploadFilter", defaultValue: null }
)
@refetchable(queryName: "FileUploadPaginationQuery") {
bank {
fileUploads(first: $first, after: $after, filter: $filter)
@connection(key: "FileUpload_fileUploads") {
edges {
__typename
}
...FileUploadTable_fileDetails
}
}
}
`;
The filesFragment is consumed by a usePaginationFragment, which I'm unsure makes a difference here since the only difference would be the connection and argument fields.