HTML: treat scripts as blocks (not inline) (#6423)

* HTML: treat scripts as blocks (not inline)

Fixes #6393

Signed-off-by: Georgii Dolzhykov <thorn.mailbox@gmail.com>

* update CHANGELOG.unreleased.md

CHANGELOG.unreleased.md

@@ -453,6 +453,33 @@ const foo = [abc, def, ghi, jkl, mno, pqr, stu, vwx, yz] as (
 )[];
 ```
 
+#### HTML: Script tags are now treated as blocks for the purposes of formatting ([#6423] by [@thorn0])
+
+Previously, in the [whitespace-sensitive mode](https://prettier.io/docs/en/options.html#html-whitespace-sensitivity), they were formatted as if they were inline.
+
+<!-- prettier-ignore-->
+```html
+<!-- Input -->
+<script
+  async
+  src="/_next/static/development/pages/_app.js?ts=1565732195968"
+></script><script></script>
+
+<!-- Prettier (stable) -->
+<script
+  async
+  src="/_next/static/development/pages/_app.js?ts=1565732195968"
+></script
+><script></script>
+
+<!-- Prettier (master) -->
+<script
+  async
+  src="/_next/static/development/pages/_app.js?ts=1565732195968"
+></script>
+<script></script>
+```
+
 #### TypeScript: Fixed to break line and add a semicolon in one execution on one line long mapped types ([#6420] by [@sosukesuzuki])
 
 Previously, when Prettier formatted long, one-line mapped types, it would break the line but didn’t add a semicolon – until you ran Prettier again (which broke Prettier’s idempotency rule). Now, Prettier adds the semicolon in the first run, fixing the issue.
@@ -519,6 +546,7 @@ class Class {
 [#6307]: https://github.com/prettier/prettier/pull/6307
 [#6340]: https://github.com/prettier/prettier/pull/6340
 [#6412]: https://github.com/prettier/prettier/pull/6412
+[#6423]: https://github.com/prettier/prettier/pull/6423
 [#6420]: https://github.com/prettier/prettier/pull/6420
 [#6411]: https://github.com/prettier/prettier/pull/6411
 [@duailibe]: https://github.com/duailibe
@@ -527,3 +555,4 @@ class Class {
 [@g-harel]: https://github.com/g-harel
 [@jounqin]: https://github.com/JounQin
 [@bakkot]: https://gibhub.com/bakkot
+[@thorn0]: https://github.com/thorn0

src/language-html/constants.evaluate.js

@@ -25,6 +25,7 @@ const CSS_DISPLAY_TAGS = Object.assign({}, getCssStyleTags("display"), {
   template: "inline",
   source: "block",
   track: "block",
+  script: "block",
 
   // there's no css display for these elements but they behave these ways
   video: "inline-block",

tests/html_script/__snapshots__/jsfmt.spec.js.snap

@@ -17,11 +17,16 @@ printWidth: 80
 </script>
 <script type="systemjs-importmap">
   {   "json":true  }
-</script>
-<script type="invalid">
+</script><script type="invalid">
   {   "json":false  }
 </script>
 
+<script
+  async=""
+  id=""
+  src="/_next/static/development/pages/_app.js?ts=1565732195968"
+></script><script></script>
+
 =====================================output=====================================
 <script type="application/ld+json">
   { "json": true }
@@ -39,5 +44,12 @@ printWidth: 80
   {   "json":false  }
 </script>
 
+<script
+  async=""
+  id=""
+  src="/_next/static/development/pages/_app.js?ts=1565732195968"
+></script>
+<script></script>
+
 ================================================================================
 `;

tests/html_script/script.html

@@ -9,7 +9,12 @@
 </script>
 <script type="systemjs-importmap">
   {   "json":true  }
-</script>
-<script type="invalid">
+</script><script type="invalid">
   {   "json":false  }
 </script>
+
+<script
+  async=""
+  id=""
+  src="/_next/static/development/pages/_app.js?ts=1565732195968"
+></script><script></script>