New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

White space stripped between <a> and <span> where it shouldn't (in comparison to HTML) #9127

Closed
bernhardreiter opened this Issue Nov 30, 2018 · 2 comments

Comments

Projects
None yet
2 participants
@bernhardreiter

bernhardreiter commented Nov 30, 2018

Version

2.5.17

Reproduction link

https://codesandbox.io/s/6j7kz64znr

Steps to reproduce

When using two tags like and in a template of a single file component, with some white space in between.

Examples (as in the link)

  <div>
    <br />
    <a href="https://vuejs.org/">Vue.js</a>

    <span>is nice</span>.
  </div>

results in `Vue.jsis nice.'

What is expected?

Expected is the regular handling of white space in browsers that remove all, but one white space.

What is actually happening?

The last space is removed.


https://codepen.io/anon/pen/RqEoOr shows the regular handling of this piece of html in a browser (without other css options set).

The problem was noticed when trying to translate text with vue-gettext, where is poses an extra challenge, see Polyconseil/vue-gettext#80

@Justineo

This comment has been minimized.

Member

Justineo commented Nov 30, 2018

Duplicate of #9021

@Justineo Justineo marked this as a duplicate of #9021 Nov 30, 2018

@Justineo Justineo closed this Nov 30, 2018

@bernhardreiter

This comment has been minimized.

bernhardreiter commented Nov 30, 2018

@Justineo thanks for the pointer to the issue! I did search the tracker, but missed it.

However I disagree with that this is resolved. I'm continuing here, because the reproduction link of #9021 does not work anymore and here are different details that explain why this is a problem to vue users.

Part of the problem is that render behaviour of browsers would usually leave on space in,
if there is

<span> a </span> <span> b </span>

and Vue components cannot be easily written to behave the same, because
they don't know if there is a space before them and if they shall preserve it.
At least it should be documented in the vue documentation (where I did search but did not find something about white space handling or inline layout.)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment