Explore the call hierarchy in Theia
Having written a lot of code in Java with Eclipse, one thing that I have really been missing with TypeScript in VSCode was the call hierarchy: Show all callers of a method, then the callers of the callers etc. in a tree. This view is very useful when browsing code to get an understanding of the control flow. It answers questions like “who changed this value?” or “where does this endless recursion come from?” during debugging. It helps to estimate the impact of a refactoring and find code that could be inlined.
Unfortunately, the Language Server Protocol does not provide a service for the call hierarchy. So developers like me end up using find references repeatedly, getting a new context each time and becoming increasingly annoyed by the embedded reference widget. Looking at the problem more closely, the LSP seems to provide all services needed to compute such a call hierarchy try. Definition brings you from a reference to its definition. Filtering the result of documentSymbols to yields all candidates for callers within a document. References does the actual work. So with a bit of glue logic, we have implemented a call hierarchy in Theia.
Watch it in action: The call hierarchy currently works with TypeScript and the external Go extension. The implementation is generic and can be easily reused and adapted to all oddities of your language server. It is completely implemented on the client side, but we might propose a language server extension to move it to the server in the future.
About the Author
Dr. Jan Köhnlein
Jan is one of the founders of TypeFox. Specialized in IDE development and language engineering, he is a long-term committer to various open-source projects, such as Xtext, Xtend and Theia. Jan also initiated the visualisation projects Sprotty and FXDiagram.
Read more about this topic
Jan 3rd 2024
Markus Rudolph
Add views to a Langium-powered VS Code extension
Markus gives a simple introduction about webviews in VS Code and how to interact with Langium.
read the articleDec 13th 2023
Dennis Hübner
Enhancing communication between extensions and webviews using VS Code Messenger
Dennis introduces the VS Code Messenger library and explains how to use it for a better intercommunication between VS Code extension and its webviews.
read the articleNov 16th 2023
Mark Sujew
Embracing remote systems in local IDEs
Mark discusses remote development and collaborative editing. He introduces a new collaboration protocol to enable compatibility between IDEs.
watch the video