0no-co / GraphQLSP

TypeScript LSP plugin that finds GraphQL documents in your code and provides diagnostics, auto-complete and hover-information.
https://gql-tada.0no.co
MIT License
332 stars 13 forks source link

Sourcemaps are ignored when debugging the plugin locally in VS Code #304

Open Maximaximum opened 2 months ago

Maximaximum commented 2 months ago

Hi! First of all, thanks for all the hard work on gql.tada! It's an awesome tool.

I guess this might not be the proper place to ask this question, but I've honestly spent 2 days trying to find out the reason for the issue with no success, so I'd really appreciate any help or guidance.

I want to play around with the plugin and, potentially, implement some minor useful functionality (like adding support for the "Go to definition" command for fragments, adding a refactoring for renaming a fragment etc). The problem I've stumbled upon, though, is that the sourcemaps don't seem to be working while trying to debug the plugin locally.

Steps to reproduce

  1. Clone the repo locally into the D:\Projects\3rd-parties\gqlsp2 folder
  2. Run pnpm i at the root
  3. Call set TSS_DEBUG_BRK=9559 && code packages/example to open the Example VS Code instance
  4. In the Example VS Code instance run pnpm i
  5. Ensured that the Workspace version of Typescript is used in both VS Code instances
  6. Set a breakpoint in the Root VS Code instance's packages\graphqlsp\src\index.ts file, (for instance, at the first line of the getCompletionsAtPosition() method)
  7. Attach to the Example VS Code instance for debugging
  8. Trigger the getCompletionsAtPosition() method from the Example VS Code instance (by typing characters in the gql template literal)

Expected result

The breakpoint set in packages\graphqlsp\src\index.ts should be hit.

Actual result

Attaching the debugger has been successful. However, the breakpoint set on packages\graphqlsp\src\index.ts remains unbound and, therefore, not hit.

However, setting the breakpoint on the corresponding location in the node_modules\.pnpm\file+packages+graphqlsp_typescript@5.3.3\node_modules\@0no-co\graphqlsp\dist\graphqlsp.js file does work. The breakpoint gets hit whenever the method is called.

Obviously, there is some kind of a problem with VS Code reading the sourcemaps, but I haven't been able to find out what is wrong specifically and how to fix / work around this issue. Any help would be appreciated.

Screenshots

imagesd Proper sourcemappingUrl set in the output file

image Breakpoint successfully working in the output file

image Breakpoint NOT working in the source file

image Proper output files, including sourcemaps are being output, but not handled by VS Code for some reason

Software versions

Windows 10 Pro x64 VS Code 1.88.1 NodeJS 20.12.1 pnpm 8.15.7

Maximaximum commented 2 months ago

Another note: sourcemaps for debugging a clean TSServer plugin template work well on the same machine https://github.com/orta/TypeScript-TSServer-Plugin-Template/tree/main