galaxyproject / galaxyproject/galaxy-language-server
Display Live Tool UI during development
- Dominant language
- Python
- Stars
- 29
- Forks
- 17
- Avg merge
- 2d 19h
- Merged PRs (30d)
- 5
Description
It would be nice to have the ability to see the tool UI rendered beside the code as you made some tweaks with the parameters, the help, etc. as @hexylena proposed [way back in 2015](https://github.com/galaxyproject/galaxy/issues/1195). Maybe not as the core part of the development but as a refining final step to make sure the UI is consistent and all your parameters are well documented and render correctly in the UI.
The initial prototype could be something like this (`Disclaimer: the following image is fake 😝`):

## Feature planning
### Use case
1. The tool developer has a tool that passes `planemo lint` and can be loaded into Galaxy without structural errors.
2. The tool developer executes a vscode command (or press a button in the planemo explorer to `run` the tool).
3. The extension runs `planemo serve` under the hood and opens a [Webview](https://code.visualstudio.com/api/extension-guides/webview) panel beside the current tool document in the editor.
4. After the tool is served by planemo, the tool UI is displayed in the panel.
5. Whenever the developer makes changes in the tool document and saves them, the tool UI is updated.
### Possible difficulties
Using an `iframe` in the Webview to contain the Galaxy tool UI seems like a reasonable solution, however, after exploring a bit this path I found some obstacles, probably more because of my lack of knowledge in the matter than the problem itself:
- The Galaxy used by `planemo serve` must deactivate `x_frame_options` or allow something different than `SAMEORIGIN` in the config to be able to display the Galaxy UI inside the vscode panel.
- Even if the Galaxy `x_frame_options` is disabled... when trying to display the inner `iframe` containing the tool UI still similar problems occur this time in the vscode end:
````
[Embedded Page] Uncaught SecurityError: Blocked a frame with origin "http://127.0.0.1:9090" from accessing a frame with origin "vscode-webview://cc4610ec-582e-44f9-98d5-c5c97cdcf6cd". The frame requesting access has a protocol of "http", the frame being accessed has a protocol of "vscode-webview". Protocols must match.
````
- Is there a way to display only the Galaxy central panel containing the tool UI instead of the whole Galaxy interface with the tools and history panels? Looks like there is some kind of redirection to the main Galaxy frame every time you try to show a tool.
Maybe just opening the Galaxy web served by planemo in the default browser will be just enough, but I think this way we lose the option to auto-refresh the tool when it changes since we are now not in control. Maybe there is another solution for this?
Contributor guide
Research direction
Start with the proposed VS Code command, Webview panel, and planemo serve flow. Review the iframe and browser approaches described in the issue, then define a working prototype that renders the tool UI beside the edited document and refreshes it after saves.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- python, vscode
- Domain
- developer-experience, tooling
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100