Feature request: Include SVG and MathML elements in ... | microsoft/vscode-html-languageservice

Nobody has claimed this yet.

Summary

The default HTML data provider — webCustomData in src/languageFacts/data/webCustomData.ts, generated from @vscode/web-custom-data via build/generateData.js — contains 116 tags, all HTML. There are no entries for SVG elements (svg, path, circle, rect, g, …) or MathML elements (math, mrow, mi, …), even though SVG and MathML are routinely embedded in HTML documents.

As a result:

Hovering a <svg>, <path>, <math>, <mrow> etc. returns no info.
Attribute completion for those elements returns nothing (no viewBox, d, cx, xmlns, etc.).
Typos in SVG/MathML attribute names are not flagged.

This affects every consumer that doesn't ship its own SVG/MathML custom data — i.e. effectively all of them: VS Code's built-in HTML server, volar-service-html, Vue's @vue/language-service, Glint (Ember), Astro, Svelte, etc. I checked Vue's language-tools and Glint, and neither adds SVG/MathML data — both just rely on the default provider.

Quick verification against a fresh install (uses the public API):

mkdir /tmp/repro && cd /tmp/repro
npm init -y >/dev/null
npm i vscode-html-languageservice
node --input-type=module -e "
import { getDefaultHTMLDataProvider } from 'vscode-html-languageservice';
const tags = getDefaultHTMLDataProvider().provideTags().map(t => t.name);
console.log('total tags:', tags.length);
for (const t of ['svg','path','circle','rect','g','math','mrow','mi','div','td']) {
  console.log(t.padEnd(6), tags.includes(t));
}
"
# total tags: 116
# svg    false
# path   false
# circle false
# rect   false
# g      false
# math   false
# mrow   false
# mi     false
# div    true
# td     true

Repro (plain `.html` in VS Code)

<!DOCTYPE html>
<html>
  <body>
    <td></td>                      <!-- hover: shows MDN description, attributes autocomplete -->
    <svg><path d="M0 0"/></svg>    <!-- hover on <svg> or <path>: nothing; no attribute completion -->
    <math><mrow></mrow></math>     <!-- hover on <math> or <mrow>: nothing -->
  </body>
</html>

Open this file in any editor backed by vscode-html-languageservice (VS Code's built-in HTML support is sufficient). Hover and tab-completion work for <td>/<div> but produce nothing for the SVG/MathML tags.

Code path that returns the empty result for SVG/MathML lookups:

src/services/htmlHover.ts:33-56 — getTagHover iterates providers, matches by name, returns null when nothing matches.
src/services/htmlCompletion.ts:92, 157 — same per-provider iteration for tag/attribute completions.
The only built-in provider is webCustomData, which has no SVG/MathML.

Proposal

Two non-exclusive options, in order of scope:

Ship SVG and MathML data in the default provider (or as separate built-in providers that are on by default). The data could be sourced/maintained alongside @vscode/web-custom-data — MDN's mdn-data and web-platform-dx/web-features already publish element/attribute metadata for both. This is the minimal fix and benefits every downstream consumer immediately.
Expose ready-made SVG and MathML IHTMLDataProviders as named exports that consumers can opt into via getCustomData. This is a smaller surface change and lets consumers continue gating on language id, but every consumer still has to wire it up themselves.

Start with src/languageFacts/data/webCustomData.ts and build/generateData.js to understand how the built-in dataset is generated. Read src/services/htmlHover.ts and src/services/htmlCompletion.ts to trace the missing-provider behavior, then compare the proposed provider options. Done means the public API recognizes the requested SVG and MathML elements and supplies their hover and completion data.

Written by the indexing model from the issue text.

Feature request: Include SVG and MathML elements in built-in dataset (enables hover and attribute completion)

Description

Summary

Repro (plain `.html` in VS Code)

Proposal

Contributor guide

First steps

Research direction

Assessment

Feature request: Include SVG and MathML elements in built-in dataset (enables hover and attribute completion)

Description

Summary

Repro (plain .html in VS Code)

Proposal

Contributor guide

First steps

Research direction

Assessment

Get new issues in your inbox

Repro (plain `.html` in VS Code)