{"id":47815,"library":"graphql-code-generator-unmask-fragment","title":"graphql-code-generator-unmask-fragment","description":"A helper library for graphql-code-generator client-preset that provides the `UnmaskFragment` utility type and `makeFragmentData` function to work around the nested fragment masking issue (https://github.com/dotansimha/graphql-code-generator/issues/9702). Version 1.2.0 is current; the package is stable with no frequent releases. It is an interim solution until the upstream PR is merged. Key differentiator: resolves typing problems with nested fragments in client-preset without workarounds.","status":"active","version":"1.2.0","language":"javascript","source_language":"en","source_url":"https://github.com/tnyo43/graphql-code-generator-unmask-fragment","tags":["javascript","graphql","gql","typescript","d.ts"],"install":[{"cmd":"npm install graphql-code-generator-unmask-fragment","lang":"bash","label":"npm"},{"cmd":"yarn add graphql-code-generator-unmask-fragment","lang":"bash","label":"yarn"},{"cmd":"pnpm add graphql-code-generator-unmask-fragment","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Provides core types for GraphQL document nodes used by graphql-code-generator","package":"@graphql-typed-document-node/core","optional":false},{"reason":"Core GraphQL library required for TypeScript types","package":"graphql","optional":true}],"imports":[{"note":"Named export, not default. Use with graphql-code-generator client-preset.","wrong":"import UnmaskFragment from 'graphql-code-generator-unmask-fragment'","symbol":"UnmaskFragment","correct":"import { UnmaskFragment } from 'graphql-code-generator-unmask-fragment'"},{"note":"Named export; CommonJS require also works but ESM is preferred.","wrong":"const { makeFragmentData } = require('graphql-code-generator-unmask-fragment')","symbol":"makeFragmentData","correct":"import { makeFragmentData } from 'graphql-code-generator-unmask-fragment'"},{"note":"Re-exported from graphql-code-generator for convenience.","symbol":"FragmentType","correct":"import { FragmentType } from 'graphql-code-generator-unmask-fragment'"}],"quickstart":{"code":"import { UnmaskFragment, makeFragmentData } from 'graphql-code-generator-unmask-fragment';\nimport { graphql } from 'gql.tada'; // or from your generated code\n\nconst UserFragment = graphql(`\n  fragment UserFragment on User {\n    id\n    username\n  }\n`);\n\nconst PostWithUserFragment = graphql(`\n  fragment PostWithUserFragment on Post {\n    id\n    body\n    author {\n      ...UserFragment\n    }\n  }\n`);\n\ntype User = UnmaskFragment<typeof UserFragment>;\n// { __typename?: \"User\" | undefined; id: string; username?: string | null | undefined; }\n\ntype PostWithUser = UnmaskFragment<typeof PostWithUserFragment>;\n// Includes nested fragment fields unmasked\n\nconst testData = makeFragmentData(\n  { id: 'post1', body: 'Hello', author: { id: 'user1', username: 'Alice' } },\n  PostWithUserFragment\n);\n// testData: FragmentType<typeof PostWithUserFragment>","lang":"typescript","description":"Demonstrates how to use UnmaskFragment to get unmasked types and makeFragmentData to create fragment data for testing."},"warnings":[{"fix":"Migrate to the built-in unmasking feature from graphql-code-generator when available in a future version.","message":"This package is an interim solution; once the graphql-code-generator PR (#9708) is merged, usage of this package will become obsolete.","severity":"deprecated","affected_versions":"all"},{"fix":"Ensure fragments are defined using `graphql()` from a library that returns TypedDocumentNode, e.g., `gql.tada` or `@graphql-typed-document-node/core`.","message":"The `UnmaskFragment` type works only with fragments defined using the `graphql()` function from `gql.tada` or similar TypedDocumentNode-based generators. Using raw `gql` strings will not produce the correct types.","severity":"gotcha","affected_versions":"all"},{"fix":"Use TypeScript to ensure type safety when constructing data.","message":"The `makeFragmentData` function validates data at runtime only loosely; it does not check that the data matches the fragment structure exactly.","severity":"gotcha","affected_versions":"all"},{"fix":"Use `import` syntax instead of `require`. Ensure your project supports ESM.","message":"Version 1.0.0 requires graphql-code-generator v0.6.0+ and changes the package to ESM-only.","severity":"breaking","affected_versions":">=1.0.0"}],"env_vars":null,"search_vec":"'/dotansimha/graphql-code-generator/issues/9702).':37 '1.2.0':39 'around':29 'client':16,71 'client-preset':15,70 'code':3,13 'current':41 'd.ts':79 'differenti':62 'fragment':6,32,68 'frequent':48 'function':26 'generat':4,14 'github.com':36 'github.com/dotansimha/graphql-code-generator/issues/9702).':35 'gql':77 'graphql':2,12,76 'graphql-code-gener':11 'graphql-code-generator-unmask-frag':1 'helper':8 'interim':53 'issu':34 'javascript':75 'key':61 'librari':9 'makefragmentdata':25 'mask':33 'merg':60 'nest':31,67 'packag':43 'pr':58 'preset':17,72 'problem':65 'provid':19 'releas':49 'resolv':63 'solut':54 'stabl':45 'type':23,64 'typescript':78 'unmask':5 'unmaskfrag':21 'upstream':57 'util':22 'version':38 'without':73 'work':28 'workaround':74","created_at":"2026-06-07T16:53:27.526491+00:00","updated_at":"2026-06-07T16:53:27.526491+00:00","problems":[{"fix":"Run `npm install graphql-code-generator-unmask-fragment` and ensure tsconfig.json includes \"moduleResolution\": \"node\" or \"bundler\".","cause":"The package may not be installed or TypeScript cannot resolve it due to missing @types.","error":"Cannot find module 'graphql-code-generator-unmask-fragment' or its corresponding type declarations."},{"fix":"Define fragments using `graphql()` from a TypedDocumentNode library (e.g., `gql.tada`).","cause":"Using the `UnmaskFragment` type with a fragment defined using `gql` instead of the typed `graphql()` function.","error":"Type 'typeof import(\"...\")' is not a valid fragment type."},{"fix":"Ensure the data object has the correct shape and all required fields as defined in the fragment.","cause":"Data passed to `makeFragmentData` does not match the expected type of the fragment.","error":"Argument of type '{ ... }' is not assignable to parameter of type 'FragmentType<...>'."},{"fix":"Use `import type { UnmaskFragment } from 'graphql-code-generator-unmask-fragment'` for type-only usage.","cause":"Using `UnmaskFragment` as both a namespace and type, likely due to import confusion.","error":"Cannot use namespace 'UnmaskFragment' as a type."}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://github.com/tnyo43/graphql-code-generator-unmask-fragment#readme","github":"https://github.com/tnyo43/graphql-code-generator-unmask-fragment","docs":null,"changelog":null,"pypi":null,"npm":"graphql-code-generator-unmask-fragment","openapi_spec":null,"status_page":null,"smithery":null,"categories":["devops"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-07","next_check":"2026-09-05","install_tag":null}}