Skip to content

Goto definition for built-in symbols in HTML script #244074

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

Merged
merged 9 commits into from
Apr 10, 2025

Conversation

nknguyenhc
Copy link
Contributor

Fixes #236603

I handle the filename lib.dom.d.ts and resolves it to the correct file to view definition of built-in DOM classes.

@nknguyenhc
Copy link
Contributor Author

@nknguyenhc please read the following Contributor License Agreement(CLA). If you agree with the CLA, please reply with the following information.

@microsoft-github-policy-service agree [company="{your company}"]

Options:

  • (default - no company specified) I have sole ownership of intellectual property rights to my Submissions and I am not making Submissions in the course of work for my employer.
@microsoft-github-policy-service agree
  • (when company given) I am making Submissions in the course of work for my employer (or my employer has intellectual property rights in my Submissions by contract or applicable law). I have permission from my employer to make Submissions and enter into this Agreement on behalf of my employer. By signing below, the defined term “You” includes me and my employer.
@microsoft-github-policy-service agree company="Microsoft"

Contributor License Agreement

Contribution License Agreement

This Contribution License Agreement (“Agreement”) is agreed to by the party signing below (“You”), and conveys certain license rights to Microsoft Corporation and its affiliates (“Microsoft”) for Your contributions to Microsoft open source projects. This Agreement is effective as of the latest signature date below.

  1. Definitions.
    “Code” means the computer software code, whether in human-readable or machine-executable form,
    that is delivered by You to Microsoft under this Agreement.
    “Project” means any of the projects owned or managed by Microsoft and offered under a license
    approved by the Open Source Initiative (www.opensource.org).
    “Submit” is the act of uploading, submitting, transmitting, or distributing code or other content to any
    Project, including but not limited to communication on electronic mailing lists, source code control
    systems, and issue tracking systems that are managed by, or on behalf of, the Project for the purpose of
    discussing and improving that Project, but excluding communication that is conspicuously marked or
    otherwise designated in writing by You as “Not a Submission.”
    “Submission” means the Code and any other copyrightable material Submitted by You, including any
    associated comments and documentation.
  2. Your Submission. You must agree to the terms of this Agreement before making a Submission to any
    Project. This Agreement covers any and all Submissions that You, now or in the future (except as
    described in Section 4 below), Submit to any Project.
  3. Originality of Work. You represent that each of Your Submissions is entirely Your original work.
    Should You wish to Submit materials that are not Your original work, You may Submit them separately
    to the Project if You (a) retain all copyright and license information that was in the materials as You
    received them, (b) in the description accompanying Your Submission, include the phrase “Submission
    containing materials of a third party:” followed by the names of the third party and any licenses or other
    restrictions of which You are aware, and (c) follow any other instructions in the Project’s written
    guidelines concerning Submissions.
  4. Your Employer. References to “employer” in this Agreement include Your employer or anyone else
    for whom You are acting in making Your Submission, e.g. as a contractor, vendor, or agent. If Your
    Submission is made in the course of Your work for an employer or Your employer has intellectual
    property rights in Your Submission by contract or applicable law, You must secure permission from Your
    employer to make the Submission before signing this Agreement. In that case, the term “You” in this
    Agreement will refer to You and the employer collectively. If You change employers in the future and
    desire to Submit additional Submissions for the new employer, then You agree to sign a new Agreement
    and secure permission from the new employer before Submitting those Submissions.
  5. Licenses.
  • Copyright License. You grant Microsoft, and those who receive the Submission directly or
    indirectly from Microsoft, a perpetual, worldwide, non-exclusive, royalty-free, irrevocable license in the
    Submission to reproduce, prepare derivative works of, publicly display, publicly perform, and distribute
    the Submission and such derivative works, and to sublicense any or all of the foregoing rights to third
    parties.
  • Patent License. You grant Microsoft, and those who receive the Submission directly or
    indirectly from Microsoft, a perpetual, worldwide, non-exclusive, royalty-free, irrevocable license under
    Your patent claims that are necessarily infringed by the Submission or the combination of the
    Submission with the Project to which it was Submitted to make, have made, use, offer to sell, sell and
    import or otherwise dispose of the Submission alone or with the Project.
  • Other Rights Reserved. Each party reserves all rights not expressly granted in this Agreement.
    No additional licenses or rights whatsoever (including, without limitation, any implied licenses) are
    granted by implication, exhaustion, estoppel or otherwise.
  1. Representations and Warranties. You represent that You are legally entitled to grant the above
    licenses. You represent that each of Your Submissions is entirely Your original work (except as You may
    have disclosed under Section 3). You represent that You have secured permission from Your employer to
    make the Submission in cases where Your Submission is made in the course of Your work for Your
    employer or Your employer has intellectual property rights in Your Submission by contract or applicable
    law. If You are signing this Agreement on behalf of Your employer, You represent and warrant that You
    have the necessary authority to bind the listed employer to the obligations contained in this Agreement.
    You are not expected to provide support for Your Submission, unless You choose to do so. UNLESS
    REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING, AND EXCEPT FOR THE WARRANTIES
    EXPRESSLY STATED IN SECTIONS 3, 4, AND 6, THE SUBMISSION PROVIDED UNDER THIS AGREEMENT IS
    PROVIDED WITHOUT WARRANTY OF ANY KIND, INCLUDING, BUT NOT LIMITED TO, ANY WARRANTY OF
    NONINFRINGEMENT, MERCHANTABILITY, OR FITNESS FOR A PARTICULAR PURPOSE.
  2. Notice to Microsoft. You agree to notify Microsoft in writing of any facts or circumstances of which
    You later become aware that would make Your representations in this Agreement inaccurate in any
    respect.
  3. Information about Submissions. You agree that contributions to Projects and information about
    contributions may be maintained indefinitely and disclosed publicly, including Your name and other
    information that You submit with Your Submission.
  4. Governing Law/Jurisdiction. This Agreement is governed by the laws of the State of Washington, and
    the parties consent to exclusive jurisdiction and venue in the federal courts sitting in King County,
    Washington, unless no federal subject matter jurisdiction exists, in which case the parties consent to
    exclusive jurisdiction and venue in the Superior Court of King County, Washington. The parties waive all
    defenses of lack of personal jurisdiction and forum non-conveniens.
  5. Entire Agreement/Assignment. This Agreement is the entire agreement between the parties, and
    supersedes any and all prior agreements, understandings or communications, written or oral, between
    the parties relating to the subject matter hereof. This Agreement may be assigned by Microsoft.

@microsoft-github-policy-service agree

@@ -601,3 +611,11 @@ function generateIndent(level: number, options: FormattingOptions) {
return repeat('\t', level);
}
}

function getLibDomUriAndDocument(): [string, TextDocument] {
Copy link
Contributor

Choose a reason for hiding this comment

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

To compute the library location, add a new function to

const serverFolder = basename(__dirname) === 'dist' ? dirname(__dirname) : dirname(dirname(__dirname));
and reuse the logic there.

As for the document URI, this is trickier as this also needs to run on the web (vscode.dev), and there's no 'file' there.
You probably need to start from the extensionUri that you get on the HTML client, and pass it on the server.

if (!content) {
return undefined;
}
const libDocument = TextDocument.create(libUri, 'typescript', 1, content);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

@aeschli Currently I put the logic here instead of in javascriptLibs.ts because webpack (for vscode.dev) uses a different version for it, as specified in html-language-features/server/extension-browser.webpack.config.js. Should I declare this logic in javascriptLibs.ts and edit the file html-language-features/server/build/javaScriptLibraryLoader.js as well, or should I just keep the logic here?

Copy link
Contributor

Choose a reason for hiding this comment

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

Oh, now I remember, for vscode.dev we just bundle the library files.

@nknguyenhc nknguyenhc requested a review from aeschli March 23, 2025 01:37
@aeschli
Copy link
Contributor

aeschli commented Mar 27, 2025

Sorry, it's been a while since I did LSP stuff, but I start to remember again.

https://microsoft.github.io/language-server-protocol/specifications/lsp/3.18/specification/#workspace_textDocumentContent

This allows the server to provide documents with virtual URIs that then can be opened by the client (VS Code).

  • Your Definition.uri will be something like html-server://typescript-libs/lib.d.ts.
  • In the client you declare that the server can provide document contents for schema html-server
  • In the server you have a provider that serves these documents using the libs.loadLibrary(lib.d.ts') call.

What do you think? I think that's the right approach, which will also work on vscode.dev.

@nknguyenhc
Copy link
Contributor Author

Sorry, it's been a while since I did LSP stuff, but I start to remember again.

https://microsoft.github.io/language-server-protocol/specifications/lsp/3.18/specification/#workspace_textDocumentContent

This allows the server to provide documents with virtual URIs that then can be opened by the client (VS Code).

  • Your Definition.uri will be something like html-server://typescript-libs/lib.d.ts.
  • In the client you declare that the server can provide document contents for schema html-server
  • In the server you have a provider that serves these documents using the libs.loadLibrary(lib.d.ts') call.

What do you think? I think that's the right approach, which will also work on vscode.dev.

I think that's a good approach, but I want to clarify a few things before I work on the new approach.

  1. Currently, I am testing out the web version by running npm run watch, then npm run watch-web and .\scripts\code-web. On browser, it shows the definition as expected.

image

Are there other things I am missing that makes it not compatible on vscode.dev?

  1. In client, I am not too sure where the server capabilities are declared. Is it just in the clientOptions.initializationOptions?

@aeschli
Copy link
Contributor

aeschli commented Mar 28, 2025

Ah nice it works. What I don't like is that it's not reflecting what we really do (using a bundled file, as we found out). So we could change that, and go away from bunding, but that's another challenge as reading URIs from the server is also not possible (needs to go to the client and the vscode filesystem API)

I think you need to set this to the server capabilities:

const capabilities: ServerCapabilities = {

			workspace: {
				textDocumentContent: {
					schemes: ['foo']
				}
			}
			`

@nknguyenhc
Copy link
Contributor Author

@aeschli I have implemented the new endpoint in the server to serve file content. But one downside to it is that upon opening the definition file, the file header does not show.

image

In contrast to typescript-language-features, upon opening the definition file, the file header shows.

image

The behaviour is the same both on web and on desktop. For desktop, upon reloading the window, the file is no longer displayed.

I'm not sure if this behaviour can be easily fixed, as the html-language-features extension is only activated upon html (or handlebars) files are opened. If it is not, the window should not be able to open a file with protocol html-server:

@aeschli
Copy link
Contributor

aeschli commented Mar 31, 2025

You mean the breadcrumbs. Don't know why they don't show, you have to debug in the breadcrumb code.
For the second issue, Maybe it helps if the json extension has a `"onFileSystem:html-server" activation event?

@nknguyenhc
Copy link
Contributor Author

@aeschli Here's what I found:

For breadcrumb to be displayed with files from html-server scheme, a file system provider needs to be declared in the extension, eg:

vscode.workspace.registerFileSystemProvider('html-server', /* some file system provider */);

However, for a client-server extension like html-language-features, the language server protocol is not yet able to handle virtual resources. It is still an open issue in microsoft/language-server-protocol#1264. Which means, the client needs to declare the file system provider as above.

For now, I believe the solution is to declare the file system provider as above in the client, and then within the provider, make a call to the server to fetch the file content via workspace/textDocumentContent.

What do you think? Lmk how I should proceed.

@aeschli
Copy link
Contributor

aeschli commented Apr 1, 2025

Thanks for the analysis!

I see, the LSP client uses the 'TextDocumentContentProvider' to serve the document, not a file system provider. https://github.com/microsoft/vscode-languageserver-node/blob/df05883f34b39255d40d68cef55caf2e93cff35f/client/src/common/textDocumentContent.ts#L86

I guess we could file an issue against the LSP client to use a file system provider instead. @dbaeumer FYI. That would help other languages as well that use TextDocumentContents (I believe Java)
microsoft/language-server-protocol#1264 is a different topic, not related to TextDocumentContents

I don't know what happens if there's both a vscode.TextDocumentContentProvider as well as a FileSystemProvider.
I would not try to work around the LSP client. IMO not having the breadcrumbs is a minor issue.

@nknguyenhc
Copy link
Contributor Author

nknguyenhc commented Apr 5, 2025

@aeschli As for persisting the document through restart, I found out that there must be an editor serializer (src\vs\workbench\common\editor.ts, class IEditorSerializer) that handles the editor type. For the library files opened by the HTML server, it is of type TextResourceEditorInput, and there is no corresponding editor serializer.

I have tried looking through VSCode API, the closest ones that I can find are registerCustomEditorProvider or registerWebviewPanelSerializer, but I believe they are not the same thing as registering an editor serializer? Also, I did not manage to find any similar APIs in language server.

As for now, the only solution I can think of is to add a serializer for TextResourceEditorInput into VSCode itself, but I'm not too sure if this will affect the behaviour of other files that are under the same editor type. Lmk how I should proceed.

@nknguyenhc
Copy link
Contributor Author

@aeschli Other than these 2 issues, the PR is ready to be reviewed.

@aeschli
Copy link
Contributor

aeschli commented Apr 10, 2025

@nknguyenhc Very nice and slick! Thanks a lot!

I allowed myself to do a change on the signature of getTextDocumentContent. Hope you like it.

@vs-code-engineering vs-code-engineering bot added this to the April 2025 milestone Apr 10, 2025
@nknguyenhc
Copy link
Contributor Author

@nknguyenhc Very nice and slick! Thanks a lot!

I allowed myself to do a change on the signature of getTextDocumentContent. Hope you like it.

Yep, looks great!

@aeschli aeschli merged commit d15f6ee into microsoft:main Apr 10, 2025
7 checks passed
@vs-code-engineering vs-code-engineering bot locked and limited conversation to collaborators May 25, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[html] support goto definition on built-in symbols inside of script
3 participants