Skip to content

Commit fd08272

Browse files
committed
gear up for release
some fixes and some changes to READMEs to get ready for the next release - `--no-strict-tags` renamed to `--syntax-only`. the old name stopped making sense once we started validating more than just tag names. - fmt now has much better defined behavior: it will print all errors it encounters but will only have a non-zero exit code in the presence of syntax errors that prevent autoformatting. when used in combination with `--syntax-only` then it will not print any error that would not prevent autoformatting. - fixed a bug introduced in the last commits where we would autocomplete closing tags also for void elements - the vscode extension now disables all it can from the builtin vscode functionality and prompts the user to disable the builtin html extension entirely (until microsoft fixes their stuff). - the vscode extension now exposes a setting to enable `--syntax-only` - removed the `interface` subcommand - fixed some more crashes found with the fuzzer
1 parent 574a7a0 commit fd08272

26 files changed

+416
-473
lines changed

.github/helix.png

123 KB
Loading

.github/vscode.png

62.9 KB
Loading

README.md

Lines changed: 38 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ HTML Language Server and Templating Language Library
33

44

55
## HTML Language Server
6-
The Super CLI Tool offers **syntax checking** and **autoformatting** features for HTML files.
6+
The SuperHTML CLI Tool offers **validation** and **autoformatting** features for HTML files.
77

88
The tool can be used either directly (for example by running it on save), or through a LSP client implementation.
99

@@ -12,45 +12,28 @@ $ superhtml
1212
Usage: superhtml COMMAND [OPTIONS]
1313
1414
Commands:
15-
check Check documents for syntax errors
16-
interface, i Print a SuperHTML template's interface
17-
fmt Format documents
18-
lsp Start the Super LSP
19-
help Show this menu and exit
20-
version Print Super's version and exit
15+
check Check documents for errors.
16+
fmt Format documents.
17+
lsp Start the Language Server.
18+
help Show this menu and exit.
19+
version Print the version and exit.
2120
2221
General Options:
23-
--help, -h Print command specific usage
22+
--help, -h Print command specific usage.
23+
--syntax-only Disable HTML element and attribute validation.
2424
```
2525

2626
>[!WARNING]
27-
>SuperHTML currently only supports UTF8-encoded HTML and assumes HTML5 compliance (e.g. doesn't support XHTML, regardless of what you define the doctype to be).
27+
>SuperHTML only supports HTML5 (the WHATWG living spec) regardless of what you put in your doctype (a warning will be generated for unsupported doctypes).
2828
2929
### Diagnostics
30+
SuperHTML validates not only syntax but also element nesting and attribute values.
31+
No other language server implements the full HTML spec in its validation code.
3032

31-
![](.github/vscode.png)
33+
![](.github/helix.png)
3234

33-
This language server is stricter than the HTML spec whenever it would prevent potential human errors from being reported.
34-
35-
36-
As an example, HTML allows for closing some tags implicitly. For example the following snippet is correct HTML.
37-
38-
```html
39-
<ul>
40-
<li> One
41-
<li> Two
42-
</ul>
43-
```
44-
45-
This will still be reported as an error by SuperHTML because otherwise the following snippet would have to be considered correct (while it's most probably a typo):
46-
47-
```html
48-
<li>item<li>
49-
```
5035

5136
### Autoformatting
52-
![](.github/vscode-autoformat.gif)
53-
5437
The autoformatter has two main ways of interacting with it in order to request for horizontal / vertical alignment.
5538

5639
1. Adding / removing whitespace between the **start tag** of an element and its content.
@@ -83,45 +66,48 @@ After:
8366
<div><p>Foo</p></div>
8467
```
8568

86-
#### Example of rule #2
69+
### Example of rule #2
8770
Before:
8871
```html
89-
<div foo="bar" style="verylongstring" >
72+
<div foo="bar" style="verylongstring" hidden>
9073
Foo
9174
</div>
9275
```
9376

9477
After:
9578
```html
96-
<div
97-
foo="bar"
98-
style="verylongstring"
79+
<div foo="bar"
80+
style="verylongstring"
81+
hidden
9982
>
10083
Foo
10184
</div>
10285
```
10386

104-
##### Reverse
87+
#### Reverse
10588

10689
Before:
10790
```html
108-
<div
109-
foo="bar"
110-
style="verylongstring">
91+
<div foo="bar"
92+
style="verylongstring"
93+
hidden>
11194
Foo
11295
</div>
11396
```
11497

11598
After:
11699
```html
117-
<div foo="bar" style="verylongstring">
100+
<div foo="bar" style="verylongstring" hidden>
118101
Foo
119102
</div>
120103
```
121104

105+
### Download
106+
See the Releases section here on GitHub.
107+
122108
### Editor support
123109
#### VSCode
124-
Install the [Super HTML VSCode extension](https://marketplace.visualstudio.com/items?itemName=LorisCro.super).
110+
Install the [Super HTML VSCode extension](https://marketplace.visualstudio.com/items?itemName=LorisCro.super) (doesn't require the CLI tool as it bundles a WASM build of the language server).
125111

126112
#### Neovim
127113
1. Download a prebuilt version of `superhtml` from the Releases section (or build it yourself).
@@ -161,30 +147,15 @@ Install the [Super HTML VSCode extension](https://marketplace.visualstudio.com/i
161147
```
162148

163149
#### Helix
164-
165150
In versions later than `24.07` `superhtml` is supported out of the box, simply add executable to your `PATH`.
166151

167-
For `24.07` and earlier, add to your `.config/helix/languages.toml`:
168-
```toml
169-
[language-server.superhtml-lsp]
170-
command = "superhtml"
171-
args = ["lsp"]
172-
173-
[[language]]
174-
name = "html"
175-
scope = "source.html"
176-
roots = []
177-
file-types = ["html"]
178-
language-servers = [ "superhtml-lsp" ]
179-
```
180-
See https://helix-editor.com for more information on how to add new language servers.
181152

182153
#### [Flow Control](https://github.com/neurocyte/flow)
183154
Already defaults to using SuperHTML, just add the executable to your `PATH`.
184155

185156
#### Vim
186-
Vim should be able to parse the errors that `superhtml check [PATH]`. This
187-
means that you can use `:make` and the quickfix window to check for syntax
157+
Vim should be able to parse the errors that `superhtml check [PATH]` generates.
158+
This means that you can use `:make` and the quickfix window to check for syntax
188159
errors.
189160

190161
Set the `makeprg` to the following in your .vimrc:
@@ -196,7 +167,6 @@ autocmd filetype html setlocal formatprg=superhtml\ fmt\ --stdin
196167
```
197168

198169
#### Zed
199-
200170
See [WeetHet/superhtml-zed](https://github.com/WeetHet/superhtml-zed).
201171

202172
#### Other editors
@@ -208,7 +178,7 @@ Follow your editor specific instructions on how to define a new Language Server
208178
SuperHTML is also a HTML templating language. More on that soon.
209179

210180
## Contributing
211-
SuperHTML tracks the latest Zig release (0.15.0-dev at the moment of writing).
181+
SuperHTML tracks the latest Zig release (0.15.1 at the moment of writing).
212182

213183
### Contributing to the HTML parser & LSP
214184
Contributing to the HTML parser and LSP doesn't require you to be familiar with the templating language, basically limiting the scope of what you have to worry about to:
@@ -217,10 +187,15 @@ Contributing to the HTML parser and LSP doesn't require you to be familiar with
217187
- `src/cli/`
218188
- `src/html/`
219189

220-
In particular, you will care about `src/html/Tokenizer.zig` and `src/html/Ast.zig`.
190+
In particular, you will care about the source files under `src/html`.
191+
192+
You can invoke `zig build test` to run all unit tests.
221193

222-
You can run `zig test src/html/Ast.zig` to run parser unit tests without needing to worry the rest of the project.
194+
Running `zig build` will compile the SuperHTML CLI tool, allowing you to also then test the LSP behavior directly from your favorite editor.
223195

224-
Running `zig build` will compile the Super CLI tool, allowing you to also then test the LSP behavior directly from your favorite editor.
196+
For testing within VSCode:
197+
1. Run `zig build wasm -p src/editors/vscode/wasm`
198+
2. Open `src/editors/vscode` in VSCode
199+
3. Start debugging.
225200

226-
The LSP will log in your cache directory so you can `tail -f ~/.cache/super/super.log` to see what happens with the LSP.
201+
Debug builds will produce logs in your cache directory so you can `tail -f ~/.cache/superhtml.log`.

build.zig

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,7 @@ fn setupCheckStep(
109109
const super_cli_check = b.addExecutable(.{
110110
.name = "superhtml",
111111
.root_module = b.createModule(.{
112-
.root_source_file = b.path("src/cli.zig"),
112+
.root_source_file = b.path("src/main.zig"),
113113
.target = target,
114114
.optimize = optimize,
115115
}),
@@ -155,7 +155,7 @@ fn setupCliTool(
155155
const super_cli = b.addExecutable(.{
156156
.name = "superhtml",
157157
.root_module = b.createModule(.{
158-
.root_source_file = b.path("src/cli.zig"),
158+
.root_source_file = b.path("src/main.zig"),
159159
.target = target,
160160
.optimize = optimize,
161161
.single_threaded = true,
@@ -257,7 +257,7 @@ fn setupReleaseStep(
257257
const super_exe_release = b.addExecutable(.{
258258
.name = "superhtml",
259259
.root_module = b.createModule(.{
260-
.root_source_file = b.path("src/cli.zig"),
260+
.root_source_file = b.path("src/main.zig"),
261261
.target = release_target,
262262
.optimize = .ReleaseFast,
263263
}),

build.zig.zon

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
.{
22
.name = .superhtml,
3-
.version = "0.4.0",
3+
.version = "0.6.0",
44
.fingerprint = 0xc5e9aede3c1db363,
55
.minimum_zig_version = "0.15.1",
66
.dependencies = .{

editors/vscode/CHANGELOG.md

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,23 @@
22

33
All notable changes to the "super" extension will be documented in this file.
44

5+
## [v0.6.0]
6+
- All major Language Server features implemented: completions, clear diagnostics, descriptions, etc.
7+
- New diagnostics cover element nesting errors and attribute validation, including complex interactions between different attributes and elements.
8+
- Duplicate ID diagnostics that are `<template>` aware.
9+
- Rename symbol on a tag name will rename both start and end tags at once.
10+
- Find references can be used on class names to find other elements that have the same class.
11+
- New improved autoformatting that keeps the first attribute on the same line as the element:
12+
- Uses tabs for indentation and spaces for alignment (experimental, might be reverted)
13+
- Respects empty lines that delineate separate blocks.
14+
- Doesn't format vertically elements in between text nodes anymore.
15+
- Basic CSS and JS autoformatting.
16+
- Introduced a "Syntax Only Mode" setting to disable advanced validation for compatibility with templated HTML files.
17+
18+
This is a huge jump forward bug reports (with repro instructions!) are appreciated.
19+
If you believe a diagnostic produced by SuperHTML to be wrong you are welcome to open an issue but
20+
you will be asked to reference the HTML spec to dissuade poorly researched, drive-by issues.
21+
522
## [v0.5.3]
623
- Fixes remaining bug when formatting void elements vertically.
724

editors/vscode/README.md

Lines changed: 21 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,18 @@
11
# SuperHTML VSCode LSP
2-
Language Server for HTML and SuperHTML Templates.
2+
Language Server for HTML.
33

4-
![](../../.github/vscode-autoformat.gif)
5-
6-
7-
# NOTE: This extension bundles the full language server
8-
9-
But you can optionally also get the CLI tool so that you can access it outside of VSCode.
10-
For prebuilt binaries and more info: https://github.com/kristoff-it/superhtml
4+
# IMPORTANT: disable the builtin VSCode HTML extension!
5+
Due to a bug in VSCode's builtin HTML extension, SuperHTML cannot disable wrong
6+
end tag suggestions from VSCode automatically.
7+
You can still disable them manually by following [these instructions](https://github.com/kristoff-it/superhtml/issues/107).
118

129

1310
## Diagnostics
11+
SuperHTML validates not only syntax but also element nesting and attribute values.
12+
No other language server implements the full HTML spec in its validation code.
1413

1514
![](../../.github/vscode.png)
1615

17-
This language server is stricter than the HTML spec whenever it would prevent potential human errors from being reported.
18-
19-
20-
As an example, HTML allows for closing some tags implicitly. For example the following snipped is correct HTML.
21-
22-
```html
23-
<ul>
24-
<li> One
25-
<li> Two
26-
</ul>
27-
```
28-
29-
This will still be reported as an error by SuperHTML because otherwise the following snippet would have to be considered correct (while it's much probably a typo):
30-
31-
```html
32-
<h1>Title<h1>
33-
```
3416

3517
## Autoformatting
3618

@@ -39,6 +21,7 @@ The autoformatter has two main ways of interacting with it in order to request f
3921
1. Adding / removing whitespace between the **start tag** of an element and its content.
4022
2. Adding / removing whitespace between the **last attribute** of a start tag and the closing `>`.
4123

24+
Note that the autoformatter will never accept any configuration option. You are encouraged to add a `superhtml fmt --check` step to your CI to guarantee that you only commit normalized HTML files.
4225

4326
### Example of rule #1
4427
Before:
@@ -69,16 +52,16 @@ After:
6952
### Example of rule #2
7053
Before:
7154
```html
72-
<div foo="bar" style="verylongstring" >
55+
<div foo="bar" style="verylongstring" hidden>
7356
Foo
7457
</div>
7558
```
7659

7760
After:
7861
```html
79-
<div
80-
foo="bar"
81-
style="verylongstring"
62+
<div foo="bar"
63+
style="verylongstring"
64+
hidden
8265
>
8366
Foo
8467
</div>
@@ -88,17 +71,22 @@ After:
8871

8972
Before:
9073
```html
91-
<div
92-
foo="bar"
93-
style="verylongstring">
74+
<div foo="bar"
75+
style="verylongstring"
76+
hidden>
9477
Foo
9578
</div>
9679
```
9780

9881
After:
9982
```html
100-
<div foo="bar" style="verylongstring">
83+
<div foo="bar" style="verylongstring" hidden>
10184
Foo
10285
</div>
10386
```
10487

88+
## This extension bundles the full language server
89+
90+
But you can optionally also get the CLI tool so that you can access it outside of VSCode.
91+
For prebuilt binaries and more info: https://github.com/kristoff-it/superhtml
92+

editors/vscode/package.json

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
"description": "Language Server for HTML and SuperHTML Templates.",
55
"repository": "https://github.com/kristoff-it/superhtml/",
66
"publisher": "LorisCro",
7-
"version": "0.5.3",
7+
"version": "0.6.0",
88
"engines": {
99
"vscode": "^1.92.0"
1010
},
@@ -34,8 +34,7 @@
3434
"SuperHTML",
3535
"Super HTML",
3636
"superhtml",
37-
"shtml",
38-
"super"
37+
"shtml"
3938
],
4039
"extensions": [
4140
".shtml"
@@ -76,6 +75,16 @@
7675
"type": "object",
7776
"title": "SuperHTML",
7877
"properties": {
78+
"superhtml.SyntaxOnlyMode": {
79+
"type": "boolean",
80+
"default": false,
81+
"description": "When enabled SuperHTML will not validate element nesting and attributes. Useful for dealing with templated HTML files, for example. (requires restart)"
82+
},
83+
"superhtml.EnsureBuiltinHTMLExtensionIsDisabled": {
84+
"type": "boolean",
85+
"default": true,
86+
"description": "Ensure the VSCode builtin HTML extension is disabled (we ask because it generates wrong end tag suggestions, see https://github.com/kristoff-it/superhtml/issues/107)."
87+
},
7988
"superhtml.trace.server": {
8089
"scope": "window",
8190
"type": "string",

0 commit comments

Comments
 (0)