leforestier / yattag

Python library to generate HTML or XML in a readable, concise and pythonic way.
333 stars 31 forks source link

Missing some line-breaks in output #84

Open gperciva opened 2 months ago

gperciva commented 2 months ago

Thanks for this project!

On my system, I'm not seeing line-breaks where they should be, according to the tutorial. Taking example 5 from the tutorial,

from yattag import Doc

doc, tag, text, line = Doc().ttl()

with tag('ul', id='grocery-list'):
    line('li', 'Tomato sauce', klass="priority")
    line('li', 'Salt')
    line('li', 'Pepper')

print(doc.getvalue())

I get this output:

<ul id="grocery-list"><li class="priority">Tomato sauce</li><li>Salt</li><li>Pepper</li></ul>

whereas the tutorial says that I'll get nicely-formatted output with each <li> on a new line. (Or maybe that same output received manual line-breaks for readability?)

It's not a huge problem, since the HTML is rendered the same in both cases. Python 3.11.9, yattag 1.16.0.

leforestier commented 1 month ago

Hello, if you need indentation, use the indent function.

from yattag import Doc, indent

doc, tag, text, line = Doc().ttl()

with tag('ul', id='grocery-list'):
    line('li', 'Tomato sauce', klass="priority")
    line('li', 'Salt')
    line('li', 'Pepper')

print(indent(doc.getvalue()))

You can read about the options of that function here: https://www.yattag.org/#indentation

gperciva commented 1 month ago

Thanks for the clarification! My problem originated from a more complicated example, but I over-simplified it. After more investigation, it comes down to the indent_text argument.

Consider this example modified from example 9 "checkboxes and radio inputs":

from yattag import Doc, indent

doc, tag, text, line = Doc().ttl()

with tag('form', action = ""):
    line('p', 'Please pick the color of the spaceship')
    for color in ('blue', 'red', 'pink', 'yellow', 'ugly-yellow'):
        doc.input(name = 'color', type = 'radio', value = color)
        text(color)

    doc.stag('input', type = 'submit', value = 'Confirm my order')

print(indent(doc.getvalue(), indent_text = False)

I get:

<form action=""><p>Please pick the color of the spaceship</p><input type="radio" value="blue" name="color" />blue<input type="radio" value="red" name="color" />red<input type="radio" value="pink" name="color" />pink<input type="radio" value="yellow" name="color" />yellow<input type="radio" value="ugly-yellow" name="color" />ugly-yellow<input type="submit" value="Confirm my order" /></form>

If I change indent_text = True, then I get:

<form action="">
  <p>
    Please pick the color of the spaceship
  </p>
  <input type="radio" value="blue" name="color" />
  blue
  <input type="radio" value="red" name="color" />
  red
  <input type="radio" value="pink" name="color" />
  pink
  <input type="radio" value="yellow" name="color" />
  yellow
  <input type="radio" value="ugly-yellow" name="color" />
  ugly-yellow
  <input type="submit" value="Confirm my order" />
</form>

But that has a few more line-breaks than I was hoping for. The ideal would be something like the output that's in the tutorial:

<form action="">
  <p>Please pick the color of the spaceship</p>
  <input type="radio" value="blue" name="color" />blue
  <input type="radio" value="red" name="color" />red
  <input type="radio" value="pink" name="color" />pink
  <input type="radio" value="yellow" name="color" />yellow
  <input type="radio" value="ugly-yellow" name="color" />ugly-yellow
  <input type="submit" value="Confirm my order" />
</form>

(Interestingly, if I comment out the text(color) line, then I get my "desired" output -- although missing the actual color names, of course.