astq playground with syntax hightlight, autocomplete and several examples #12
Description
I think I never announce a couple of projects I've made using astq some time ago that I think the maintainers will be happy to see In particular this playground which uses monaco-editor so users can edit astq queries with syntax highlight, autocomplete, error handling inline help, and online evaluation against the target code which in my case is TypeScript /JavaScript/JSX/TSX. I thought the author would be happy seeing its creation being represented like this:
https://cancerberosgx.github.io/demos/cannabis/typescript-ast-query-editor/
(use the editor on the left and press ctrl-space for auto-completion of operators, modifiers, literals, etc. hover with the mouse to get help). Provoke some errors - I think more could be done with errors and suggestions).
the monaco configuration is mostly this
this is monaco definitions for those features: https://github.com/cancerberoSgx/cannabis/blob/master/typescript-ast-query-editor/src/editor/query/queryEditor.ts (you can try their playground and this config to play around...)
The playground has several examples of the real project that is a JavaScript/ TypeScript AST query library based on astq and although some uses custom helper functions of my library could be helpful for people understanding this syntax.
I must say that while I'm pretty familiar with AST representations of several languages I had a hard time learning astq syntax to write useful queries in a language like JavaScript
BTW what do you think of a playground like this but with a less complex target language like json/xml that shows real-life examples -I think that should be ideal for non expert users trying to learn the syntax. I would really want to master and document the syntax and BTW was it created by you ? was inspired on another work (form where get more examples) ? - I could easily reproduce that playground and contribute with something similar/simpler here - but first: I would like to know from @rse what's the status of this project but mostly if you are motivated or viable discuss/help me understand the limitations or advance queries that I didn't figure it out how to accomplish (in a single or finite number of queries).
In general I think that by adding 5 or 10 examples - real world targetting asts like JavaScript's could boost this project which IMO has great potential but is hard to grasp (the syntax not the API) for non expert users like me.The docs seems complete and formal, but I think this syntax is beautiful and complex enough to deserve a a getting started like documentation with examples - I understand the basics of several parser languages and their differences and still I found it hard to write simple queries since the syntax is rich and today whey you way queries you tink about html selectors, path, globs - which are pretty different.
BTW ( are you the author of this syntax ? Was it inspired in another works - if so or if there is something similar I would appreciate a reference. ) . I'm would like to contribute with some getting started and example document (but first wanted to ask about the project, limitations, and your motivation/viability, for describe and review my docs)
For example, this other project of mine https://cancerberosgx.github.io/demos/univac/playground/ is a playground to parse several common programming language code and shows their AST structure in different ways. It uses different parsing technologies form peg.js, tree-sitter, antlr4 so the structure of trees varies a lot between them. As a next step I would like to introduce the ability to query the asts using a language which can be relatively useful in all these trees / and language real-world queries (which include imperative, declarative, functional, parser definition, bash, strongly typed, data only, asm). Naturally I thought about this project and my doubt is if the syntax supports something like the following or must I solve it with helper functions:
In the context of C++/TypeScript/JavaScript/Java I would like to build one query (or two) that get me:
"the method declarations_(child-type)_ which
second (child index) parameter (child type) is of type (child-type) X (attribute)
name (child-type) contains Y (attribute)
members of (ancestor-type) of classes (type) that implements_(child-type)_ directly or indirectly the interface named_(attribute)_ U"
The difficult is recursion (directly or indirectly) . With multiple queries or a program the algorithm could be : find all interfaces extending interface I. then and recursively find all interfaces extending those and so and so until all are found. Then form those interfaces do nothing similar to query all the lasses implementing them directly or indirectly. My doubts are in general to this regard, is it possible to recurse like that using the syntax ? or I need to solve this with a helper function and probably a language extension or a second language on top of this?. my library already has helpers for this but slow compared with a solution based on astq
Going back to my typescript parser library It was very intuitive to add a custom adapter
- support interesting features like
- represent files and folders as nodes too
- TS/JS projects (tsconfig.json / package.json and project dependencies
- JSX/TSX syntax support
- a second language to support glob like patterns (so I can filter nodes using expressions like "src//service//specialFileName*/InterfaceDeclaration/**/**MethodSignature"
- previous implies a definition for unique node path - for performance I'm caching each node path but probably I'm already destroying your work performance nevertheless
- query Identifier references and even names in the local scope of a symbol, or the declaration of a symbol or the apparent type of a name or return value, etc (which is inferred by tsc
- so many values here needs to be calculated and some are expensive - so there's a thin cache layer for that but performance.
thanks for the library hoping you are still available/motivated, and with excuses for my long msg which is not an issue, my greetings from Uruguay, Seba