question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

html: Closing > put on newline

See original GitHub issue

Prettier 1.15.3 Playground link

--parser html

Input:

<!DOCTYPE html>
<div>
  <div>
    <div>
      <div>
        <div>
          <div>
            <div>
              Response body
              <textarea
                name="readinessProbe.response.body"
              >{{ readinessProbe.response.body }}</textarea>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

Output:

<!DOCTYPE html>
<div>
  <div>
    <div>
      <div>
        <div>
          <div>
            <div>
              Response body
              <textarea name="readinessProbe.response.body">
{{ readinessProbe.response.body }}</textarea
              >
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

Expected behavior: Not to change the input. The input comes from 1.15.2.

</textarea
>

That part is the thing I’m reporting, if the amount if divs were confusing 😅

html-whitespace-sensitivity doesn’t matter, btw

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
SimenBcommented, Dec 3, 2018

Ah, alright! You learn something every day 🙂 Thanks for the detailed response

0reactions
ikatyangcommented, Dec 2, 2018

Is it related to that? This is closing > on the closing tag, not the opening tag.

Since --jsx-bracket-same-line is defined as “do not put > alone on the next line”, #5377 should track it for both opening and closing tags.

That said, we should probably use another parser, even though I’d expect the content of a textarea to just be treated as plain text in the html parser

If you intend to use it as an interpolation, you should use one of the parser that supports interpolation since there’s a special rule for <textarea> in the HTML spec that the first LF will be ignored in <textarea>. That said, the following formatting can be unsafe based on the value of the interpolation:

<!-- before -->
<textarea>{{something}}

<!-- after -->
<textarea>
{{something}}

It’ll break the output if {{something}} is interpolated as something starts with LF since there will be two LF and only the first one will be ignored, causes an extra LF.

And also, continuous whitespaces in <textarea> can not be collapsed but it’s not the case for interpolations.

Read more comments on GitHub >

github_iconTop Results From Across the Web

The Dos and Don'ts of Adding an HTML Line Break
In HTML, the <br> element creates a line break. You can add it wherever you want text to end on the current line...
Read more >
How to force closing HTML tags on a new line? - Stack Overflow
There isn't an option to force the end tags to new lines. One setting that helps is preserve_newlines . Enabling that should keep...
Read more >
Add a Line Break in HTML - Tutorial - TeachUcomp, Inc.
To add a line break to your HTML code, you use the <br> tag. The <br> tag does not have an end tag....
Read more >
HTML New Line – How to Add a Line Break with the <br> Tag
The <br> tag is a self-closing tag that inserts a line break wherever it is placed within your code. To use the <br>...
Read more >
add option to insert newlines after opening / before closing tags
Only thing i found on HTML style tab is "Wrap Text" option and in description its saying for long lines only, so it...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found