Add '| undefined' to optional properties

src/TypeScriptGenerator.ts

@@ -24,15 +24,15 @@ import {
 
 type Selection = {
   key: string;
-  schemaName?: string;
-  value?: any;
-  nodeType?: TypeID;
-  conditional?: boolean;
-  concreteType?: string;
-  ref?: string;
-  nodeSelections?: SelectionMap | null;
-  kind?: string;
-  documentName?: string;
+  schemaName?: string | undefined;
+  value?: any | undefined;
+  nodeType?: TypeID | undefined;
+  conditional?: boolean | undefined;
+  concreteType?: string | undefined;
+  ref?: string | undefined;
+  nodeSelections?: SelectionMap | null | undefined;
+  kind?: string | undefined;
+  documentName?: string | undefined;
 };
 
 type SelectionMap = Map<string, Selection>;
@@ -309,10 +309,31 @@ function exactObjectTypeAnnotation(
 
 const idRegex = /^[$a-zA-Z_][$a-z0-9A-Z_]*$/;
 
+// union optional types with undefined for compat with exactOptionalPropertyTypes
+function createInexactOptionalType(type: ts.TypeNode): ts.TypeNode {
+  if (ts.isUnionTypeNode(type)) {
+    return ts.factory.updateUnionTypeNode(
+      type,
+      ts.factory.createNodeArray([
+        ...type.types,
+        ts.factory.createKeywordTypeNode(ts.SyntaxKind.UndefinedKeyword),
+      ])
+    );
+  } else {
+    return ts.factory.createUnionTypeNode([
+      type,
+      ts.factory.createKeywordTypeNode(ts.SyntaxKind.UndefinedKeyword),
+    ]);
+  }
+}
+
 function objectTypeProperty(
   propertyName: string,
   type: ts.TypeNode,
-  options: { readonly?: boolean; optional?: boolean } = {}
+  options: {
+    readonly?: boolean | undefined;
+    optional?: boolean | undefined;
+  } = {}
 ): ts.PropertySignature {
   const { optional, readonly = true } = options;
   const modifiers = readonly
@@ -325,7 +346,7 @@ function objectTypeProperty(
       ? ts.factory.createIdentifier(propertyName)
       : ts.factory.createStringLiteral(propertyName),
     optional ? ts.factory.createToken(ts.SyntaxKind.QuestionToken) : undefined,
-    type
+    optional ? createInexactOptionalType(type) : type
   );
 }
 

src/TypeScriptTypeTransformers.ts

@@ -9,7 +9,7 @@ export type ScalarTypeMapping = {
 export type State = {
   generatedFragments: Set<string>;
   generatedInputObjectTypes: {
-    [name: string]: ts.TypeNode | "pending";
+    [name: string]: ts.TypeLiteralNode | "pending";
   };
   matchFields: Map<string, ts.TypeNode>;
   runtimeImports: Set<string>;
@@ -37,9 +37,7 @@ export function transformScalarType(
   } else {
     return ts.factory.createUnionTypeNode([
       transformNonNullableScalarType(schema, type, state, objectProps),
-      ts.factory.createLiteralTypeNode(
-        ts.factory.createToken(ts.SyntaxKind.NullKeyword)
-      ),
+      ts.factory.createLiteralTypeNode(ts.factory.createNull()),
     ]);
   }
 }
@@ -115,20 +113,29 @@ function transformGraphQLEnumType(
 export function transformInputType(
   schema: Schema,
   type: TypeID,
-  state: State
+  state: State,
+  options: {
+    inputObjectProperty?: boolean | undefined;
+  } = {}
 ): ts.TypeNode {
+  const { inputObjectProperty } = options;
   if (schema.isNonNull(type)) {
     return transformNonNullableInputType(
       schema,
       schema.getNullableType(type),
       state
     );
+  } else if (inputObjectProperty) {
+    return ts.factory.createUnionTypeNode([
+      transformNonNullableInputType(schema, type, state),
+      ts.factory.createLiteralTypeNode(ts.factory.createNull()),
+      // add undefined to support exactOptionalPropertyTypes
+      ts.factory.createKeywordTypeNode(ts.SyntaxKind.UndefinedKeyword),
+    ]);
   } else {
     return ts.factory.createUnionTypeNode([
       transformNonNullableInputType(schema, type, state),
-      ts.factory.createLiteralTypeNode(
-        ts.factory.createToken(ts.SyntaxKind.NullKeyword)
-      ),
+      ts.factory.createLiteralTypeNode(ts.factory.createNull()),
     ]);
   }
 }
@@ -169,7 +176,9 @@ function transformNonNullableInputType(
           !schema.isNonNull(fieldType)
           ? ts.factory.createToken(ts.SyntaxKind.QuestionToken)
           : undefined,
-        transformInputType(schema, fieldType, state)
+        transformInputType(schema, fieldType, state, {
+          inputObjectProperty: true,
+        })
       );
 
       return property;