WebView optionally add "allow-modals" to iframe sandbox options

[GordonSmith]

The ability to enable "allow-modals" as a sandbox attribute of the webview hosting iframe.

This would be similar to the "enableScripts" options currently available in the WebView options:

  enableScripts: true,
  enableModals: true

Would produce:

<iframe id="active-frame" frameborder="0" sandbox="allow-scripts allow-modals allow-forms allow-same-origin" style="display: block; margin: 0px; overflow: hidden; position: absolute; width: 100%; height: 100%; visibility: visible;"></iframe>

[GordonSmith]

Note: By default if enableScripts is false - then dialog like "alert" will work - but when enableScripts is set to true, they won't. See: https://googlechrome.github.io/samples/block-modal-dialogs-sandboxed-iframe/

[mjbvz]

What do you need modals in a webview for?

[GordonSmith]

In my immediate case they are for confirmation dialog boxes: "Are you sure you want to delete? [Y][N]". These dialog boxes are created by calling:

window.confirm("Ok to delete row?")

See: https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm

FWIW In my case I am displaying a table of JSON data in the webview and the user can add and delete rows...

According to the docs they will work when scripts are disabled - but once scripts are enabled, then you also need this new flag...

[mjbvz]

Use the VS Code quick input API for this. Webviews can talk to your extension using postMessage.

Normal web modal dialogs are less functional and would feel out of place in VS Code

[GordonSmith]

@mjbvz - is there a way to make postMessage a non async call?

Assuming we wanted to hook the window.confirm function:

window.confirm = function(msg) {
  return postMessage(...)?
}

Note: These confirm dialogs might be buried deep inside third party JS libs...

Should I open a new issue to request VSCode to automatically hook the standard dialogs:

• confirm
• alert
• prompt
  (and the authentication popup)

[gjsjohnmurray]

Use the VS Code quick input API for this. Webviews can talk to your extension using postMessage.

Normal web modal dialogs are less functional and would feel out of place in VS Code

@mjbvz - Fair point, but is that a strong enough reason for not allowing them?

[mjbvz]

No, there is no sync message passing apis for webviews. If you want to force a user response before continuing, try setting MessageOptions.modal when showing your message/alert with the VS Code api

You can write an adapter for window.alert for your extension but there are no plans to include this as part of VS Code

[GordonSmith]

@mjbvz - That means it will be impossible to replace the window confirm/alert/prompt dialogs (at a global level) with a message passing alternative like you suggested (can you elaborate how you would make the alert hook work via a PostMessage).

So to recap -

• WebView content can not include any third party JS libraries that make use of the standard dialog boxes.
• WebView content can not prompt the user for ID/PW when connecting to a REST API (when challenged for authentication) via the built in dialog.

and this is "by design", I assume this means you wouldn't consider a pull request with the capability added?