Bring parity between HTML and Razor for html-data.json
- Dominant language
- TypeScript
- Stars
- 3.1k
- Forks
- 737
- Avg merge
- 18h 40m
- Merged PRs (30d)
- 31
Description
## Summary
Bring parity between HTML and Razor for `html-data.json`.
Custom HTML tags and attributes defined via `html-data.json` currently work in `.html` files, but not in `.cshtml` (Razor) files. This breaks consistency when using project-specific attributes or components.
## Is your feature request related to a problem? Please describe.
Currently, custom HTML attributes and tags defined via `html-data.json` work only in `.html` files, because they are handled by the built-in `html-language-features` extension.
In `.cshtml` (Razor) files, these completions and validations are missing, which makes it harder to use custom `data-*` attributes or project-specific web components consistently across HTML and Razor views.
## Describe the solution you would like
I would like Razor (.cshtml) language support in VS Code to also respect `html.customData` contributions (`html-data.json`). This would provide IntelliSense for custom tags, attributes, and attribute values inside Razor files in the same way as in `.html` files.
## Applicable Scenarios
- Using custom `data-*` attributes in Razor components or views.
- Adding autocomplete for custom web components in `.cshtml`.
- Consistent development experience between `.html` and `.cshtml` files.
## Describe alternatives you've considered
- Associating `.cshtml` files with `html` language mode in VS Code. This enables `html-data.json` but disables Razor syntax and C# IntelliSense.
- Creating a custom hybrid language extension that reuses Razor grammar and merges it with HTML data. This works, but it is fragile and duplicates functionality already provided by the Razor extension.
## Additional context
Having `html-data.json` support in Razor would unify the experience with plain HTML development and allow teams to define their own project-specific HTML metadata (custom tags, attributes, values) once and use it everywhere.
Example of `html-data.json`:
```json
{
"version": 1.1,
"tags": [
{
"name": "my-button",
"description": "Custom button component",
"attributes": [
{
"name": "variant",
"values": [
{ "name": "primary" },
{ "name": "secondary" }
]
}
]
}
],
"globalAttributes": [
{
"name": "data-theme",
"description": "Theme selector",
"values": [
{ "name": "light" },
{ "name": "dark" }
]
}
]
}
```
In .html files, typing `` or `
In .cshtml files, the same code does not provide any completions or validation.
Contributor guide
Assessment
This issue has not been assessed yet.