Display a result of debugger's step as an inline text - visual-studio-code

For my debugger extension I'd like to implement a functionality from the following image where a step can ask a debugger client to show an inlined text with the result of the step.
I've read the DAP documentation thoroughly but still don't have a clue how this can be implemented or if it's even possible to implement. What request or event do I have to implement?
By the way, how is this function of debbuger client called?

With vscode v1.54, see Inline value provider
Today the Show Inline Values feature of VS Code's debugger is based on
a generic implementation in VS Code core, and doesn't provide
customizability through settings or extensibility via extensions. As a
consequence, it is not a perfect fit for all languages and sometimes
shows incorrect values because it doesn't understand the underlying
source language. For this reason, we are working on an extension API
that allows to replace the built-in implementation completely or to
replace parts of the implementation with custom code.
In this milestone we've made a first implementation of the proposed
API available.
And much more at the first link including sample code. So vscode is adding a true API for inline values rather than depending on Decorations anymore.

Related

Textmate scopes in custom hover-provider for vscode extension

I've created a custom language extension for my own script language. I've written a tmlanguage file to tokenize my script and do custom highlighting. I created a hover-provider that currently only shows the word that is hovered for testing the provider itself. I want to react on the textmate scopes of the current position in this hover, like the vs code Developer tool "Inspect Editor Token and Scopes" does.
At the end I want to react to one particular scope whose value I want to read and show a corresponding image of this value in the hover.
Fore example a line in my script could look like:
setImage(dic_1/dic_2/testImg)
Now I want to show the image that correlates with the path in the brackets if I hover over it.
I tried to find something in the documentation (https://code.visualstudio.com/api/references/vscode-api#languages) if there is something that would help me but couldn't see anything related.
I tried to ask ChatGPT for help after he suggested "possible internal and not public available methods" it suggested to create a custom hover provider with the help of the library "oniguruma" and tokenize the document again.
However, this feels a bit like an overkill. If vscode has a internal tool that does return the textmate scopes I would guess there is a easy way to access those tokens.
I found this thread (Is there a way to find the textmate scope from within my VSCode extension language functions?) but I don't rally understand why I need to write another parser.
Is there any way to access this textmate scopes in a hover-provider?

How can I add these code completion features my VSCode extension?

I'm in the process of creating a VSCode extension to do code completion for an existing Lua API.
I'm having a bit of trouble achieving the following (examples are JavaScript):
I've been looking for examples and tutorials but haven't come up with much. I assume I may need to do a fair amount of string processing, around the current cursor position, to get enough data to lookup the appropriate documentation (which I stored in an array of json objects). But presently I don't know how to get the meta-data dialog to show when entering parameters.
P.S. I have reviewed the official extension samples.
Your screenshots show two VS Code features:
The first screenshot shows a hover / quick info. It is used to display information about the current word the user is hovering over. To add a hover, your extension should implement and register a HoverProvider
The second screenshot shows parameter hints / signature help. It displays information to the user as they complete a function call. To add signature help, your extension should implement and register a SignatureHelpProvider
In both cases, how you implement the functionality is entirely up to your extension. Most language extensions maintain a structural representation of the file (such as an AST) and use this to provide hover and signature help info.
You can also either implement your extension as a direct VS Code extension or using the language server protocol (which works across editors). See VS Code's Language Extensions Overview for more information about developing a language extension and why you may want to consider the Language Server Protocol

How to reverse engineer a progressive web app ?

I found this free PWA https://www.the-qrcode-generator.com and now wonder how I could do one such myself.
Since I couldn't find any access to its source code I wondered if it'd be difficult to reverse engineer.
I'm interested in building a PWA with QRCode functionality.
This one was created with AngularJS v1.3.20. You can find the source in your console windows under Sources tab. You can easily beautify the code inside the window to make it readable.
If you want to know how they organized their rest API, the browser network tab will help a lot, just filter by XHR and examine all the call from the front end to be.
The front end is very hard to revers engineer, because most sites are served as minified bundles, so you can't see the original code.
You can however find some other information about what they used to build it, for example in the html source you can see some ng-* tags, which indicates that this is angular, you can also see that body has attribute data-ng-app meaning this is angularjs and so on.
For the QR logic you can see that there are no back end calls, meaning that it is written entirely in the client. I would search for already available solutions for that.

How to redirect the data from "vscode.previewHtml" in VSCode extension

The obvious way is written in Working with the HTML preview, to use some link, so how to send data to the base running program without clicking links? I want to make some seamless extension between editor and previewer.
A few possible ways:
Open a local communications channel between your extension and the page. The extension could setup a simple server for example that the webview hits. This is best if you have lots of data to send or need to support more complex scenarios.
Inside the webview, you can instead post a message simulating a click with a command. Here's what VSCode's built-in markdown extension does for example:
window.parent.postMessage({
command: 'did-click-link',
data: `command:_markdown.revealLine?${encodeURIComponent(JSON.stringify(args))}`
}, 'file://');
The second approach is pretty hacky but it works well to just trigger events every so often.
We are also considering a better API for this. Please let us know if you have any thoughts or suggestions for this

Best approach to test GWT localization?

I have a set of GWT UIs, some created directly in Java and others created using UI Binder ui.xml files.
I localized them following the official GWT guidelines (e.g. creating interface extending Messages interface).
I now wonder if there is an easy way to write a unit test to validate that message keys get replaced by the corresponding values from property files?
I guess I could do that using GWTTestCase, but actually I don't need a browser to render the page. Instead, it would be enough to get the raw string output and check with some regex that the messages are present.
Is that possible? Or is it better to test such things in running application like using Selenium?
Just a note. Besides the important things you are trying to validate, one of the critical points in my project during messages localization tests is to see: if the translated text fits the allocated space. If it's a box of fixed size, overlapping texts don't look nice. And this cannot be checked with unit tests. That's why the manual review is in to-do list when new locale is added or certain labels/messages are changed.
I'd recommend Selenium. Checking that the messages are present could be tricky, because in that case you should know the place where the label is located, in which tags. In my opinion, using GWTTestCase makes sense when it comes to testing controllers' behavior. Simple search by value guarantees only presence but not correct placement.
I think, it also makes sense to use those translation properties in the tests, so the strings are not duplicates in the tests.