{"_id":"@openreplay/tracker-graphql","_rev":"11-d7b46047efe771db594f79745a7e31f1","name":"@openreplay/tracker-graphql","dist-tags":{"latest":"4.1.0"},"versions":{"3.0.0":{"name":"@openreplay/tracker-graphql","version":"3.0.0","keywords":["graphql","logging","replay"],"author":{"name":"Alex Tsokurov"},"license":"MIT","_id":"@openreplay/tracker-graphql@3.0.0","maintainers":[{"name":"pandacodes","email":"alex.kaminsky.11@gmail.com"},{"name":"estradino","email":"support@asayer.io"}],"contributors":[{"name":"Aleksandr K","email":"alex@openreplay.com"}],"dist":{"shasum":"0941fd01d49c6de75a49357fbfd2251bbfdcd071","tarball":"https://registry.npmjs.org/@openreplay/tracker-graphql/-/tracker-graphql-3.0.0.tgz","fileCount":8,"integrity":"sha512-5FIKHVFLjzbLsgJxEG298uF6rUAgKf80M13jimp5y2So9iEG19mIaApz0oyRDaKMKLSMWkWtQIe2SmRTC29gmw==","signatures":[{"sig":"MEYCIQCXkcTl4qpgAzFAaBWfOowfovArfJba5Vni53HKiitaCwIhALsYvWASDh+aGFn2SlRfmVubvzfWUuKlY5uoFcoMm0bD","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":5789,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgi+0fCRA9TVsSAnZWagAAsnkP/0L3MwLXDUc0xXMHlr4x\nRwpdgcCmhxCVGENDORy5bNHvaG0cdtM0YlonvJfVQspx7WcmF9mxzDCenuCR\nct91eKXVv34e4rDjDulMTNQiBzsU17NuMnO6NMwCJLlhTHr7n5dC0UwkeLKr\n3u3Xncw0hrWkObp4M+223387Pd8Z9v8vd41AD524o1GxExI3+ST3GKcbFxtD\nhMgHJ/lcBWzOUcgscsWZwt8McahkTOUWkNUWlUYMJhExDBwZP5AomiyFvUyr\nW1LQyjn+AANRwKoq5atg2pBZU+tteCfeBzfcpWSqC9b4UTecsQ6jACGitj57\nqE+GGosgDxBm6OYpzcLbKAKs+MtEv05SzKBslxrDXruT8y9Yq4a2XIoeQQ8O\nwJWqZ9xICAp/TLhqz4VT38UxhL4k1RzLfVmDjUWrJoqY5yW0n1JnRYPi9RUI\neVfNsTIuWFKbqCGuVqNnL2WWuIPzpuvMWRWiNGzf9R/A3tY52/hX68gPkSGX\nIrktn2XfeJ0SXxCe9UDGSvN0JtK/b55raJTJXpVC7cjgJdrr07m49WMjoBaV\n9NJn1M2jKoj180l74BWSxGpSFfn3w/7tKDUjOIBvcyL/skabvgdY19B3STbM\n+2h1kvEyeSvHIb1ZnFtWyknQq2BYzrY3VeNcc8Y1msQznGqubdGvpvSLeOve\nfddT\r\n=QS+v\r\n-----END PGP SIGNATURE-----\r\n"},"main":"./lib/index.js","type":"module","scripts":{"lint":"prettier --write 'src/**/*.ts' README.md && tsc --noEmit","build":"npm run build-es && npm run build-cjs","build-es":"rm -Rf lib && tsc","build-cjs":"rm -Rf cjs && tsc --project tsconfig-cjs.json && echo '{ \"type\": \"commonjs\" }' > cjs/package.json && replace-in-files cjs/* --string='@openreplay/tracker' --replacement='@openreplay/tracker/cjs'","prepublishOnly":"npm run build"},"_npmUser":{"name":"pandacodes","email":"alex.kaminsky.11@gmail.com"},"_npmVersion":"6.14.8","description":"Tracker plugin for GraphQL requests recording","directories":{},"_nodeVersion":"12.20.0","_hasShrinkwrap":false,"devDependencies":{"prettier":"^1.18.2","typescript":"^3.6.4","@openreplay/tracker":"^3.0.0","replace-in-files-cli":"^1.0.0"},"peerDependencies":{"@openreplay/tracker":"^3.0.0"},"_npmOperationalInternal":{"tmp":"tmp/tracker-graphql_3.0.0_1619782942819_0.3380648010827967","host":"s3://npm-registry-packages"}},"3.0.1":{"name":"@openreplay/tracker-graphql","version":"3.0.1","keywords":["graphql","logging","replay"],"author":{"name":"Alex Tsokurov"},"license":"MIT","_id":"@openreplay/tracker-graphql@3.0.1","maintainers":[{"name":"deliriumvt","email":"lyelinn@icloud.com"},{"name":"shekarsiri","email":"sshekarsiri@gmail.com"},{"name":"estradino","email":"support@asayer.io"},{"name":"pandacodes","email":"alex.kaminsky.11@gmail.com"}],"contributors":[{"name":"Aleksandr K","email":"alex@openreplay.com"}],"dist":{"shasum":"649f2bb251aecb971043335122e61d22c1c144f5","tarball":"https://registry.npmjs.org/@openreplay/tracker-graphql/-/tracker-graphql-3.0.1.tgz","fileCount":8,"integrity":"sha512-TyqQ1X9hqSc5OZB1lXHvB3Rc4PFY+55NYvBZa0E12/T6wYWpJe7IPgyPgozRONwQ+4CCncuHuMHl6hE/dAK+IQ==","signatures":[{"sig":"MEUCIQDaXElbDwLayQ5WRkUXhnC3gxhNwZkrJIRsVaH0B2D/BQIgG0CYSDJGJb5WtC27ouWb61tm9uC/gvD54bWyP7jh9ig=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":5771,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjIFmlACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp/kg//VLvKaNeI4zgrHFeo73fKMCmP1hnmyKkH0ggdG8pRL5tTCeq+\r\nM9zFM3mVEDISG29OdCvbWoFH7M082pHG+/Z6fffnk4+t6JzJpt9zca8UdZRY\r\n8Goh46l1VOzZPfFfY//73RXGuqylI5rquMj/1eugFeQnG8UCtxPQ4i64a3Hq\r\ngP4CCNUt9NLZ6Q0hOixLgVk+73pgoomKxgMgi8FucASZCvXAkY+Vg+mBgHXU\r\nqEU9ql0P2BnH2OUWBZyJ9QZ3+c7ZyY/DmJCI8jh6rzkTZNpirvXcDkfq6bxT\r\n2kQ/N9DUNbu+yLxA4QIyX/51dj8WrUHaED//g85OCmjqLil9VoN6iFBzpj0K\r\nxh/OUA8UOsL3sRT06iRqfv4dGCI93G/h4U/NWN8aX0z3nM+DsoVRpNvHx3Ty\r\n9XfX1Xn1nx+32c+IRl+mQh9FvLtkqXZbn7FC76QtR8mLqeg3aWzC7qfWdAnA\r\nHG4gP+w0yd4wjMP6xw3cET92/cTFHgn2qh9vJE1sgDInVlupDJ6gdP2va7kt\r\nHmJVJYnKSNsETpaJFMqAT3rJrzFO5Qghc3mT5rXJaZhdVeTPlZLVekbr3PGY\r\nBabJWWtIAZOxWt3DtBZ6G0dKD3AIdBPUZYhlT01Q04SwZm4TSdMWUsBKa4Ow\r\nqKrepttVS5lQMPCQu2z2WR62TttzEULCruY=\r\n=eMya\r\n-----END PGP SIGNATURE-----\r\n"},"main":"./lib/index.js","type":"module","types":"./lib/index.d.ts","gitHead":"0bac6f65c5443b61aedc4c479a8e876c9162575a","scripts":{"lint":"prettier --write 'src/**/*.ts' README.md && tsc --noEmit","build":"npm run build-es && npm run build-cjs","build-es":"rm -Rf lib && tsc","build-cjs":"rm -Rf cjs && tsc --project tsconfig-cjs.json && echo '{ \"type\": \"commonjs\" }' > cjs/package.json && replace-in-files cjs/* --string='@openreplay/tracker' --replacement='@openreplay/tracker/cjs'","prepublishOnly":"npm run build"},"_npmUser":{"name":"deliriumvt","email":"lyelinn@icloud.com"},"_npmVersion":"8.13.2","description":"Tracker plugin for GraphQL requests recording","directories":{},"_nodeVersion":"17.9.0","_hasShrinkwrap":false,"devDependencies":{"prettier":"^1.18.2","typescript":"^3.6.4","@openreplay/tracker":"file:../tracker","replace-in-files-cli":"^1.0.0"},"peerDependencies":{"@openreplay/tracker":">=3.0.0"},"_npmOperationalInternal":{"tmp":"tmp/tracker-graphql_3.0.1_1663064485765_0.071971587632492","host":"s3://npm-registry-packages"}},"4.0.0":{"name":"@openreplay/tracker-graphql","version":"4.0.0","keywords":["graphql","logging","replay"],"author":{"name":"Alex Tsokurov"},"license":"MIT","_id":"@openreplay/tracker-graphql@4.0.0","maintainers":[{"name":"deliriumvt","email":"nick.delirium@proton.me"},{"name":"shekarsiri","email":"sshekarsiri@gmail.com"},{"name":"estradino","email":"support@asayer.io"}],"contributors":[{"name":"Aleksandr K","email":"alex@openreplay.com"}],"dist":{"shasum":"bc9efb3139546f5dca581892f8949971442d4d72","tarball":"https://registry.npmjs.org/@openreplay/tracker-graphql/-/tracker-graphql-4.0.0.tgz","fileCount":25,"integrity":"sha512-AtvBeKHNFGjakoR472s7Nw3Wmtc8ktkARuFCVQvCh08vCMjg1MDAn3FdK8vkdC3pW2y3hokXGY6ZMadQybNX3Q==","signatures":[{"sig":"MEYCIQD8C+SkPmLOoMqQ7G4zxXUhbtzDUSuYrOdlv+3jDQ0V3AIhALpvink/RXUI7c4WB8gxqJqg04lzw65cgwrd8YijwgnZ","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":263493},"main":"./lib/index.js","type":"module","types":"./lib/index.d.ts","gitHead":"5c46b8e3dfc45353a116c277e99ebf8e9e7daa80","scripts":{"lint":"prettier --write 'src/**/*.ts' README.md && tsc --noEmit","build":"npm run build-es && npm run build-cjs","build-es":"rm -Rf lib && tsc","build-cjs":"rm -Rf cjs && tsc --project tsconfig-cjs.json && echo '{ \"type\": \"commonjs\" }' > cjs/package.json && replace-in-files cjs/* --string='@openreplay/tracker' --replacement='@openreplay/tracker/cjs'","prepublishOnly":"npm run build"},"_npmUser":{"name":"deliriumvt","email":"nick.delirium@proton.me"},"_npmVersion":"9.8.1","description":"Tracker plugin for GraphQL requests recording","directories":{},"_nodeVersion":"18.18.0","dependencies":{"@apollo/client":"^3.9.5","zen-observable":"^0.10.0","@types/zen-observable":"^0.8.7"},"_hasShrinkwrap":false,"devDependencies":{"prettier":"^1.18.2","typescript":"^5.3.3","@openreplay/tracker":"file:../tracker","replace-in-files-cli":"^1.0.0"},"peerDependencies":{"@openreplay/tracker":">=14.0.0"},"_npmOperationalInternal":{"tmp":"tmp/tracker-graphql_4.0.0_1720525262085_0.3770852331250427","host":"s3://npm-registry-packages"}},"4.1.0":{"name":"@openreplay/tracker-graphql","version":"4.1.0","keywords":["graphql","logging","replay"],"author":{"name":"Alex Tsokurov"},"license":"MIT","_id":"@openreplay/tracker-graphql@4.1.0","maintainers":[{"name":"deliriumvt","email":"nick.delirium@proton.me"},{"name":"shekarsiri","email":"sshekarsiri@gmail.com"},{"name":"estradino","email":"support@asayer.io"}],"contributors":[{"name":"Aleksandr K","email":"alex@openreplay.com"}],"dist":{"shasum":"471dabe7909c9172fe318afbdaf760733833f8aa","tarball":"https://registry.npmjs.org/@openreplay/tracker-graphql/-/tracker-graphql-4.1.0.tgz","fileCount":29,"integrity":"sha512-GPzu5UgXy1NLutlDfJ4YvcvWp7EEHl2cz/7fXHMJ+6K/bYCwfGFF7KCmjAkmjryVzo5FqPQKSNC1O1z5fLOZWQ==","signatures":[{"sig":"MEYCIQDTo9DftG1yewCrGGwSWKCymbGojFHi2RZMCjusr6cJVgIhAJQa64xaR+oowOBc2wegzojtVLhQvI6oPHsomouMur1e","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":266505},"main":"./lib/index.js","type":"module","types":"./lib/index.d.ts","gitHead":"a47ff4fcf01d73cf50fee2398f7dc395dc5262d5","scripts":{"lint":"prettier --write 'src/**/*.ts' README.md && tsc --noEmit","build":"npm run build-es && npm run build-cjs","build-es":"rm -Rf lib && tsc","build-cjs":"rm -Rf cjs && tsc --project tsconfig-cjs.json && echo '{ \"type\": \"commonjs\" }' > cjs/package.json && replace-in-files cjs/* --string='@openreplay/tracker' --replacement='@openreplay/tracker/cjs'","prepublishOnly":"npm run build"},"_npmUser":{"name":"deliriumvt","email":"nick.delirium@proton.me"},"_npmVersion":"9.8.1","description":"Tracker plugin for GraphQL requests recording","directories":{},"_nodeVersion":"18.18.0","dependencies":{"@apollo/client":"^3.9.5","zen-observable":"^0.10.0","@types/zen-observable":"^0.8.7"},"_hasShrinkwrap":false,"devDependencies":{"prettier":"^1.18.2","typescript":"^5.3.3","@openreplay/tracker":"file:../tracker","replace-in-files-cli":"^1.0.0"},"peerDependencies":{"@openreplay/tracker":">=14.0.0"},"_npmOperationalInternal":{"tmp":"tmp/tracker-graphql_4.1.0_1721657380957_0.4555878288155213","host":"s3://npm-registry-packages"}}},"time":{"created":"2021-04-30T11:42:22.448Z","modified":"2025-12-09T14:18:04.108Z","3.0.0":"2021-04-30T11:42:22.968Z","3.0.1":"2022-09-13T10:21:25.909Z","4.0.0":"2024-07-09T11:41:02.210Z","4.1.0":"2024-07-22T14:09:41.125Z"},"author":{"name":"Alex Tsokurov"},"license":"MIT","keywords":["graphql","logging","replay"],"description":"Tracker plugin for GraphQL requests recording","contributors":[{"name":"Aleksandr K","email":"alex@openreplay.com"}],"maintainers":[{"email":"sshekarsiri@gmail.com","name":"shekarsiri"},{"email":"support@asayer.io","name":"estradino"},{"email":"nick.delirium@proton.me","name":"deliriumvt"},{"email":"tahayk2@gmail.com","name":"tahayk"}],"readme":"# OpenReplay Tracker GraphQL plugin\n\nThis plugin allows you to capture the GraphQL requests and then search by them.\n\n## Installation\n\n```bash\nnpm i @openreplay/tracker-graphql\n```\n\n## Usage\n\nInitialize the `@openreplay/tracker` package as usual and load the plugin into it.\nThe `plugin` call will return the function, which receives four variables\n`operationKind`, `operationName`, `variables`, `result` and `duration` (default 0)\n\nreturns `result` without changes.\n\n```js\nimport Tracker from '@openreplay/tracker';\nimport { createGraphqlMiddleware } from '@openreplay/tracker-graphql';\n\nconst tracker = new Tracker({\n  projectKey: YOUR_PROJECT_KEY,\n});\n\nexport const recordGraphQL = tracker.use(createGraphqlMiddleware());\n```\n\n### Relay\n\nIf you're using [Relay network tools](https://github.com/relay-tools/react-relay-network-modern),\nyou can simply [create a middleware](https://github.com/relay-tools/react-relay-network-modern/tree/master?tab=readme-ov-file#example-of-injecting-networklayer-with-middlewares-on-the-client-side)\n\n```js\nimport { createRelayMiddleware } from '@openreplay/tracker-graphql';\n\nconst trackerMiddleware = tracker.use(createRelayMiddleware());\n\nconst network = new RelayNetworkLayer([\n  // your middleware\n  // ,\n  trackerMiddleware,\n]);\n```\n\nYou can pass a Sanitizer function to `createRelayMiddleware` to sanitize the variables and data before sending them to OpenReplay.\n\n```js\nconst trackerLink = tracker.use(\n  createRelayMiddleware((variables) => {\n    return {\n      ...variables,\n      password: '***',\n    };\n  }),\n);\n```\n\nOr you can manually put `recordGraphQL` call\nto the `NetworkLayer` implementation. If you are standard `Network.create` way to implement it,\nthen you should do something like below\n\n```js\nimport { createGraphqlMiddleware } from '@openreplay/tracker-graphql'; // see above for recordGraphQL definition\nimport { Environment } from 'relay-runtime';\n\nconst handler = tracker.use(createGraphqlMiddleware());\n\nfunction fetchQuery(operation, variables, cacheConfig, uploadables) {\n  return fetch('www.myapi.com/resource', {\n    // ...\n  })\n    .then((response) => response.json())\n    .then((result) =>\n      handler(\n        // op kind, name, variables, response, duration (default 0)\n        operation.operationKind,\n        operation.name,\n        variables,\n        result,\n        duration,\n      ),\n    );\n}\n\nconst network = Network.create(fetchQuery);\n```\n\nSee [Relay Network Layer](https://relay.dev/docs/en/network-layer) for details.\n\n### Apollo\n\nFor [Apollo](https://www.apollographql.com/) you should create a new `ApolloLink`\n\n```js\nimport { createTrackerLink } from '@openreplay/tracker-graphql';\n\nconst trackerLink = tracker.use(createTrackerLink());\nconst yourLink = new ApolloLink(trackerLink);\n```\n\nYou can pass a Sanitizer function to `createRelayMiddleware` to sanitize the variables and data before sending them to OpenReplay.\n\n```js\nconst trackerLink = tracker.use(\n  createTrackerLink((variables) => {\n    return {\n      ...variables,\n      password: '***',\n    };\n  }),\n);\n```\n\nAlternatively you can use generic graphql handler:\n\n```js\nimport { createGraphqlMiddleware } from '@openreplay/tracker-graphql'; // see above for recordGraphQL definition\nimport { ApolloLink } from 'apollo-link';\n\nconst handler = tracker.use(createGraphqlMiddleware());\n\nconst trackerApolloLink = new ApolloLink((operation, forward) => {\n  operation.setContext({ start: performance.now() });\n  return forward(operation).map((result) => {\n    const time = performance.now() - operation.getContext().start;\n    return handler(\n      // op kind, name, variables, response, duration (default 0)\n      operation.query.definitions[0].operation,\n      operation.operationName,\n      operation.variables,\n      result,\n      time,\n    );\n  });\n});\n\nconst link = ApolloLink.from([\n  trackerApolloLink,\n  // ...\n]);\n```\n\nSee [Apollo Link](https://www.apollographql.com/docs/link/) and\n[Apollo Networking](https://www.apollographql.com/docs/react/networking/network-layer/)\nfor details.\n","readmeFilename":"README.md"}