Add support for VSCode Web

[YashKumarVerma]

with the feature of loading a full fledged editor in the browser with just pressing the . on the keyboard, It would be great if we could bring the nodes to the browser.

[yozlet]

WikiLens is a new extension which works this way.

[digitarald]

👋 I'm Harald, a PM from the VS Code team, and we recently announced VS Code for the Web at https://vscode.dev/, which provides a free, zero-install Microsoft Visual Studio Code experience running entirely in your browser. You can learn more here.

We'd like to ensure that Foam can run in the web, and we have a guide for enabling extensions for the web here. As a couple of highlights:

• In VS Code for the Web, both the UI and extension host run inside the browser.
• A web extension is structured like a regular extension, but with a different main file: it's defined by the browser property
• Access to workspace files needs to go through the VS Code file system API accessible at vscode.workspace.fs
• There are currently three ways to test a web extension

Feel free to reach out to me if you have questions or if I can help somehow. Thank you

[riccardoferretti]

Hi @digitarald, it's definitely on my radar to have Foam run in the web, will definitely reach out if I have any question in that regard

[AlexW00]

Any update on the issue?

[riccardoferretti]

I did a spike that got the build to work but there are still some issues to iron through, because of the libraries that would not be available in the browser (e.g. glob), or that need to be bridged

[joshdover]

I'm interested in picking this work up, here's my rough plan. Please let me know if you have any feedback:

• Replace usages of fs with vscode.workspace.fs #1005
• Identify any other modules that have dependencies on Node.js that need to be refactored (glob?)
• Add a bundled version of the extension source, using rollup and @rollup/plugin-typescript
• Setup the e2e suite to run the same tests against VSCode using the --extensionDevelopmentKind=web option

[riccardoferretti]

This plan looks pretty good to me, thanks for picking this up

[riccardoferretti]

I removed the dependency on glob, which was the main blocker here (#1084).
There are a few more modules, os path and crypto, which can be browserified.
There is a pending issue with fs in the preview, due to the async limitation of the plugins, to be properly thought about.

@joshdover I am not familiar with rollup, how would that fit in the build cycle?

[pderaaij]

Hi @digitarald, I started to work on enabling foam for VSCode for the Web. Unfortunately I am running into some issues with using jest as testing framework. See my latest message in #1127. Perhaps you can chip in with some ideas, guidance, or tips to get our end-2-end tests running. Thanks for looking along!

[tegkhanna]

Hi!
Is this still in works?
What are the blockers if any? Not super skilled in this domain but willing to contribute!

[riccardoferretti]

So, I believe we are actually in a good place on this one.
The work that @pderaaij did in #1290 had gotten super close, we have been stuck on the note embedding in the preview.
But I think we used the wrong approach there: we could disable the preview on the Web (and only make it available in the desktop version), so that the rest of the functionalities are still available for our users.

@pderaaij wdyt?

[pderaaij]

So, I feel disabling note embedding for web would be fine. We also have the problem of running end 2 end tests for web. That won't work for web with the current test framework. That might be something to think about.

I'll update the PR later this week with the latest code and will see if I can do a test drive.

[pderaaij]

Just seeing microsoft/vscode#174080 (comment). This might be good to check out. I'll have a look this week.

[pderaaij]

For reference. I got foam working on the web, see #1290. The initial step is to make it available without note embedding working. After this PR I will do attempt to overhaul the preview, just like https://github.com/dstengle/markdown-queries does.