Apollo:codegen – Unknown directive "argumentDefinitions"

[ajacquierbret]

It seems that the apollo-tooling codegen feature doesn't properly recognize "arguments" and "argumentDefinitions" directives.

.../src/navigation/authenticated/AuthenticatedContextRealTime.tsx: Unknown directive "arguments".
.../src/navigation/authenticated/AuthenticatedContextRealTime.tsx: Unknown directive "arguments".
.../src/navigation/authenticated/AuthenticatedContextRealTime.tsx: Unknown directive "argumentDefinitions".
Validation of GraphQL query document failed
    at Object.validateQueryDocument (/Users/a.jacquier.bret/Documents/Git Repos/user-mobile-app/node_modules/apollo-language-server/lib/errors/validation.js:35:38)
    at Object.generate [as default] (/Users/a.jacquier.bret/Documents/Git Repos/user-mobile-app/node_modules/apollo/lib/generate.js:23:18)
    at write (/Users/a.jacquier.bret/Documents/Git Repos/user-mobile-app/node_modules/apollo/lib/commands/client/codegen.js:78:54)
    at Task.task (/Users/a.jacquier.bret/Documents/Git Repos/user-mobile-app/node_modules/apollo/lib/commands/client/codegen.js:98:46)
  ✔ Loading Apollo Project
  ✔ Generating query files with 'typescript' target - wrote 29 files
✨  Done in 13.99s.

Generation can be done but without GraphQL document validation.

Here's my apollo client configuration :

import { ApolloClient } from 'apollo-client';
import { InMemoryCache, defaultDataIdFromObject } from 'apollo-cache-inmemory';
import { HttpLink } from 'apollo-link-http';
import { ApolloLink, split } from 'apollo-link';
import { ApolloProvider } from '@apollo/react-hooks';
import { createFragmentArgumentLink } from 'apollo-link-fragment-argument';

const AppApolloClient = new ApolloClient({
  cache: new InMemoryCache({
    dataIdFromObject: object => {
      switch (object.__typename) {
        case 'Heater':
          return (object as any).serialNumber;
        case 'OffPeakHours':
          return null;
        case 'HeatingProgramEntry':
          return object.id === null ? null : defaultDataIdFromObject(object);
        default:
          return defaultDataIdFromObject(object);
      }
    },
  }),
 link: ApolloLink.from([
    // Order matters
    createFragmentArgumentLink(),
    errorHandlerLink,
    cleanTypenameLink,
    new DebounceLink(0),
    new SerializingLink(),
    requestHandlerLink,
    networkLink,
  ]),
});

export default AppApolloClient;

export const AppApolloClientProvider = ({
  children,
}: {
  children: ReactNode;
}) => <ApolloProvider client={AppApolloClient}>{children}</ApolloProvider>;

And my graphql fragment :

const AuthenticatedHomeRealTimeFragment = gql`
fragment AuthenticatedHomeRealTimeFragment on IndividualHome
    @argumentDefinitions(
      energyFrom: { type: "DateTime!" }
      energyTo: { type: "DateTime!" }
    ) {
energyConsumption(from: $energyFrom, to: $energyTo)
`};

const AuthenticatedRealTimeQueryLiteral = gql`
  query AuthenticatedRealTimeQuery(
    $energyFrom: DateTime!
    $energyTo: DateTime!
  ) {
    me {
      id
      homes: individualHomes {
        ...AuthenticatedHomeRealTimeFragment
          @arguments(from: $energyFrom, to: $energyTo)
      }
    }
  }
  ${AuthenticatedHomeRealTimeFragment}
`;

const AuthenticatedSubscriptionsGraphQL = gql`
  subscription AuthenticatedSubscriptions(
    $energyFrom: DateTime!
    $energyTo: DateTime!
  ) {
    homeUpdated: individualHomeUpdated {
      ...AuthenticatedHomeRealTimeFragment
        @arguments(from: $energyFrom, to: $energyTo)
    }
  }
  ${AuthenticatedHomeRealTimeFragment}
`;

const useAuthenticatedContextRealTimeSubscriptions = () => {
    return useSubscription<
    AuthenticatedSubscriptions,
    AuthenticatedSubscriptionsVariables>(AuthenticatedSubscriptionsGraphQL, {
    variables: {
      energyFrom: '2011-10-05T14:48:00.000Z',
      energyTo: '2011-11-05T14:48:00.000Z',
    },
    onSubscriptionData: ({ subscriptionData }) => {
      //console.debug('AuthenticatedSubscriptions data', subscriptionData);
      if (subscriptionData.error) {
        reportError(subscriptionData.error);
      }
    },
  });
};