Recognize known html tags (#8621)

This commit is contained in:
fisker Cheung authored and GitHub committed 2020-07-14 22:02:32 +08:00
1 parent 8a635f5bdf
commit 26740d54a5
5 files changed
+411 -1

No files matched your search

+47
View File
@@ -0,0 +1,47 @@
#### Recognize known html tags ([#8621](https://github.com/prettier/prettier/pull/8621) by [@fisker](https://github.com/fisker))
<!-- prettier-ignore -->
```html
<!-- Input -->
<div>before<details><summary>summary long long long long </summary>details</details>after</div>
<div>before<dialog open>dialog long long long long long long long long </dialog>after</div>
<div>before<object data="horse.wav"><param name="autoplay" value="true"/><param name="autoplay" value="true"/></object>after</div>
<!-- Prettier stable -->
<div>
before<details><summary>summary long long long long </summary>details</details
>after
</div>
<div>
before<dialog open>dialog long long long long long long long long </dialog
>after
</div>
<div>
before<object data="horse.wav"
><param name="autoplay" value="true" /><param
name="autoplay"
value="true" /></object
>after
</div>
<!-- Prettier master -->
<div>
before
<details>
<summary>summary long long long long</summary>
details
</details>
after
</div>
<div>
before
<dialog open>dialog long long long long long long long long</dialog>
after
</div>
<div>
before<object data="horse.wav">
<param name="autoplay" value="true" />
<param name="autoplay" value="true" /></object
>after
</div>
```
+10 -1
View File
@@ -23,7 +23,6 @@ const CSS_DISPLAY_TAGS = {
...getCssStyleTags("display"),
// TODO: send PR to upstream
button: "inline-block",
// special cases for some css display=none elements
@@ -31,8 +30,18 @@ const CSS_DISPLAY_TAGS = {
source: "block",
track: "block",
script: "block",
param: "block",
// `noscript` is inline
// noscript: "inline",
// there's no css display for these elements but they behave these ways
details: "block",
summary: "block",
dialog: "block",
meter: "inline-block",
progress: "inline-block",
object: "inline-block",
video: "inline-block",
audio: "inline-block",
select: "inline-block",
+1
View File
@@ -269,6 +269,7 @@ function forceNextEmptyLine(node) {
return (
isFrontMatterNode(node) ||
(node.next &&
node.sourceSpan.end &&
node.sourceSpan.end.line + 1 < node.next.sourceSpan.start.line)
);
}
@@ -3723,6 +3723,348 @@ printWidth: 80
================================================================================
`;
exports[`tags2.html - {"htmlWhitespaceSensitivity":"ignore"} format 1`] = `
====================================options=====================================
htmlWhitespaceSensitivity: "ignore"
parsers: ["html"]
printWidth: 80
| printWidth
=====================================input======================================
<div>before<noscript>noscript long long long long long long long long</noscript>after</div>
<div>before<details><summary>summary long long long long </summary>details</details>after</div>
<div>before<dialog open>dialog long long long long long long long long </dialog>after</div>
<div>before<object data="horse.wav"><param name="autoplay" value="true"/><param name="autoplay" value="true"/></object>after</div>
<div>before<meter min="0" max="1" low=".4" high=".7" optimum=".5" value=".2"></meter>after</div>
<div>before<progress value=".5" max="1"></progress>after</div>
=====================================output=====================================
<div>
before
<noscript>noscript long long long long long long long long</noscript>
after
</div>
<div>
before
<details>
<summary>summary long long long long</summary>
details
</details>
after
</div>
<div>
before
<dialog open>dialog long long long long long long long long</dialog>
after
</div>
<div>
before
<object data="horse.wav">
<param name="autoplay" value="true" />
<param name="autoplay" value="true" />
</object>
after
</div>
<div>
before
<meter min="0" max="1" low=".4" high=".7" optimum=".5" value=".2"></meter>
after
</div>
<div>
before
<progress value=".5" max="1"></progress>
after
</div>
================================================================================
`;
exports[`tags2.html - {"htmlWhitespaceSensitivity":"strict"} format 1`] = `
====================================options=====================================
htmlWhitespaceSensitivity: "strict"
parsers: ["html"]
printWidth: 80
| printWidth
=====================================input======================================
<div>before<noscript>noscript long long long long long long long long</noscript>after</div>
<div>before<details><summary>summary long long long long </summary>details</details>after</div>
<div>before<dialog open>dialog long long long long long long long long </dialog>after</div>
<div>before<object data="horse.wav"><param name="autoplay" value="true"/><param name="autoplay" value="true"/></object>after</div>
<div>before<meter min="0" max="1" low=".4" high=".7" optimum=".5" value=".2"></meter>after</div>
<div>before<progress value=".5" max="1"></progress>after</div>
=====================================output=====================================
<div
>before<noscript>noscript long long long long long long long long</noscript
>after</div
>
<div
>before<details
><summary>summary long long long long </summary>details</details
>after</div
>
<div
>before<dialog open>dialog long long long long long long long long </dialog
>after</div
>
<div
>before<object data="horse.wav"
><param name="autoplay" value="true" /><param
name="autoplay"
value="true" /></object
>after</div
>
<div
>before<meter
min="0"
max="1"
low=".4"
high=".7"
optimum=".5"
value=".2"
></meter
>after</div
>
<div>before<progress value=".5" max="1"></progress>after</div>
================================================================================
`;
exports[`tags2.html - {"printWidth":"Infinity"} format 1`] = `
====================================options=====================================
parsers: ["html"]
printWidth: Infinity
=====================================input======================================
<div>before<noscript>noscript long long long long long long long long</noscript>after</div>
<div>before<details><summary>summary long long long long </summary>details</details>after</div>
<div>before<dialog open>dialog long long long long long long long long </dialog>after</div>
<div>before<object data="horse.wav"><param name="autoplay" value="true"/><param name="autoplay" value="true"/></object>after</div>
<div>before<meter min="0" max="1" low=".4" high=".7" optimum=".5" value=".2"></meter>after</div>
<div>before<progress value=".5" max="1"></progress>after</div>
=====================================output=====================================
<div>before<noscript>noscript long long long long long long long long</noscript>after</div>
<div>
before
<details>
<summary>summary long long long long</summary>
details
</details>
after
</div>
<div>
before
<dialog open>dialog long long long long long long long long</dialog>
after
</div>
<div>
before<object data="horse.wav">
<param name="autoplay" value="true" />
<param name="autoplay" value="true" /></object
>after
</div>
<div>before<meter min="0" max="1" low=".4" high=".7" optimum=".5" value=".2"></meter>after</div>
<div>before<progress value=".5" max="1"></progress>after</div>
================================================================================
`;
exports[`tags2.html - {"printWidth":1} format 1`] = `
====================================options=====================================
parsers: ["html"]
printWidth: 1
| printWidth
=====================================input======================================
<div>before<noscript>noscript long long long long long long long long</noscript>after</div>
<div>before<details><summary>summary long long long long </summary>details</details>after</div>
<div>before<dialog open>dialog long long long long long long long long </dialog>after</div>
<div>before<object data="horse.wav"><param name="autoplay" value="true"/><param name="autoplay" value="true"/></object>after</div>
<div>before<meter min="0" max="1" low=".4" high=".7" optimum=".5" value=".2"></meter>after</div>
<div>before<progress value=".5" max="1"></progress>after</div>
=====================================output=====================================
<div>
before<noscript
>noscript
long
long
long
long
long
long
long
long</noscript
>after
</div>
<div>
before
<details>
<summary>
summary
long
long
long
long
</summary>
details
</details>
after
</div>
<div>
before
<dialog
open
>
dialog
long
long
long
long
long
long
long
long
</dialog>
after
</div>
<div>
before<object
data="horse.wav"
>
<param
name="autoplay"
value="true"
/>
<param
name="autoplay"
value="true"
/></object
>after
</div>
<div>
before<meter
min="0"
max="1"
low=".4"
high=".7"
optimum=".5"
value=".2"
></meter
>after
</div>
<div>
before<progress
value=".5"
max="1"
></progress
>after
</div>
================================================================================
`;
exports[`tags2.html format 1`] = `
====================================options=====================================
parsers: ["html"]
printWidth: 80
| printWidth
=====================================input======================================
<div>before<noscript>noscript long long long long long long long long</noscript>after</div>
<div>before<details><summary>summary long long long long </summary>details</details>after</div>
<div>before<dialog open>dialog long long long long long long long long </dialog>after</div>
<div>before<object data="horse.wav"><param name="autoplay" value="true"/><param name="autoplay" value="true"/></object>after</div>
<div>before<meter min="0" max="1" low=".4" high=".7" optimum=".5" value=".2"></meter>after</div>
<div>before<progress value=".5" max="1"></progress>after</div>
=====================================output=====================================
<div>
before<noscript>noscript long long long long long long long long</noscript
>after
</div>
<div>
before
<details>
<summary>summary long long long long</summary>
details
</details>
after
</div>
<div>
before
<dialog open>dialog long long long long long long long long</dialog>
after
</div>
<div>
before<object data="horse.wav">
<param name="autoplay" value="true" />
<param name="autoplay" value="true" /></object
>after
</div>
<div>
before<meter
min="0"
max="1"
low=".4"
high=".7"
optimum=".5"
value=".2"
></meter
>after
</div>
<div>before<progress value=".5" max="1"></progress>after</div>
================================================================================
`;
exports[`textarea.html - {"htmlWhitespaceSensitivity":"ignore"} format 1`] = `
====================================options=====================================
htmlWhitespaceSensitivity: "ignore"
+11
View File
@@ -0,0 +1,11 @@
<div>before<noscript>noscript long long long long long long long long</noscript>after</div>
<div>before<details><summary>summary long long long long </summary>details</details>after</div>
<div>before<dialog open>dialog long long long long long long long long </dialog>after</div>
<div>before<object data="horse.wav"><param name="autoplay" value="true"/><param name="autoplay" value="true"/></object>after</div>
<div>before<meter min="0" max="1" low=".4" high=".7" optimum=".5" value=".2"></meter>after</div>
<div>before<progress value=".5" max="1"></progress>after</div>