Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add preview API #813

Merged
merged 52 commits into from
Jul 3, 2023
Merged

Add preview API #813

merged 52 commits into from
Jul 3, 2023

Conversation

jmcphers
Copy link
Collaborator

This change adds an API, service, and user interface for Positron's Preview panel.

The Preview API is modeled closely after VS Code's existing WebviewPanel API. Rather than try to co-opt that API to work in the Preview pane, which would have involved a lot of internal changes to VS Code's API to add new types and special cases, I've chosen to implement our own parallel API so we can discard the irrelevant options and add preview-specific logic.

Though we have our own PreviewPanel class, the actual WebView inside the panel that hosts the content is not a special Positron type; it is a standard VS Code WebView. This makes the PreviewPanel a sort of cousin of several other APIs that handle webviews.

graph TD
WebviewPanel --> WebView
WebviewView --> WebView
PreviewPanel --> WebView
WebView --> ExtHostWebView 
ExtHostWebView --> MainThreadWebView
Loading

Because Positron's API and VS Code's API are completely separate, getting them to use the same backend for WebViews was challenging. This PR takes the (possibly controversial) approach of punching a hole in the RpcProtocol -- getRaw() -- that allows Positron's API to extract the actors created when VS Code's API initializes.

The user interface uses React, like our other view panes do, with hooks to repaint the pane when previews are opened/closed. Because you can't really attach/detach a WebView without losing content and state, we rely on VS Code's IOverlayWebview, which effectively paints the webview on top of an existing DOM element using absolute positioning. This, unfortunately, requires us to redraw the preview container every time its size or position changes.

Note that the Preview service lives in /contrib/ since it interacts heavily with webviews (which are also a contrib).

The Preview API includes some interactive demos you can run from the Zed console. Here are the new commands:

  • preview open will open the Preview pane.
  • preview show will reveal the Preview pane if it is currently closed.
  • preview status will show the current status of the preview, including whether there is currently a preview and whether it is visible.
  • preview close will close the preview if it's open.
  • preview message will send a postMessage to the preview pane, which will appear in the pane itself.

jmcphers added 30 commits May 31, 2023 15:57
Copy link
Contributor

@jjallaire jjallaire left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I am not sufficiently conversant in the internals to really comment, but in any case LGTM.

After this is merged here are the outstanding would allow me to ship the Quarto extension to the marketplace w/ Positron support:

@jmcphers jmcphers merged commit 53dadd2 into main Jul 3, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants