Skip to content
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

With whitespace:condense all &nbsps;, even meaningful, are converted to spaces #11059

Closed
aimozg opened this issue Jan 29, 2020 · 5 comments · Fixed by #11065
Closed

With whitespace:condense all &nbsps;, even meaningful, are converted to spaces #11059

aimozg opened this issue Jan 29, 2020 · 5 comments · Fixed by #11065

Comments

@aimozg
Copy link

aimozg commented Jan 29, 2020

Version

2.6.11

Reproduction link

https://gist.github.com/aimozg/c073eea5a55062e3dcd8f887a8567807

Steps to reproduce

Run example.js in Node.

Alternative steps/Detailed explanation:

  1. Setup Vue template compiler with whitespace: 'condense'. (it is default for vue-cli).
  2. Render template with &nbsp; entity, e.g. <p>a&nbsp;b</p>
  3. Inspect template for actual non-breaking space character

What is expected?

&nbsp; entity rendered as non-breaking space character; example.js output should contain

---- whitespace: condense
// code
NBSP FOUND

What is actually happening?

&nbsp; entity is rendered as plain space, example.js output contains

---- whitespace: condense
// code
NBSP NOT FOUND

The whitespace is stripped by this compiler code:

if (!inPre && whitespaceOption === 'condense') {
  // condense consecutive whitespaces into single space
  text = text.replace(whitespaceRE, ' ')
}

and "&nbsp;"s are replaced by "\xA0"s with entity decoder earlier.

Related issues is #10485

Suggestion:

Narrower whitespaceRE regexp, like /[ \t\r\n]+/g.

@posva
Copy link
Member

posva commented Jan 29, 2020

Shouldn't we not touch non-breakable spaces in general? That's what I would personally expect if I use one in my template. It would also fix the issue you mentioned

despreston added a commit to despreston/vue that referenced this issue Feb 2, 2020
The regex for whitespace was too strict and was causing $nbps; chars to
disappear from templates when `whitespace: 'condense'` is set. Changing the rule
to avoid converting non-breaking white space chars into regular spaces.
@chasebank
Copy link

Setup Vue template compiler with whitespace: 'condense'. (it is default for vue-cli).

Wait, I'm confused. Is condense really the default? I'm seeing multiple things that claim preserve is actually the default.

I've been struggling to figure out why none of my non-breakable spaces are working. I was going to try forcing preserve, but then saw:

Evan saying default is preserve #9208 (comment)

And compiler option docs that echo that statement https://github.com/vuejs/vue/tree/dev/packages/vue-template-compiler#options

Now after seeing @aimozg say condense is actually default, I went ahead and manually set preserve and sure enough! Everything's back to normal!

Are the docs/implementation wrong?

Either way, why would condense eliminate nbsp? Very unexpected behavior. I agree they shouldn't be touched.

@Justineo
Copy link
Member

Justineo commented May 1, 2020

White spaces are preserved in Vue core to ensure backward compatibility while in latest versions of Vue CLI we configure that to condense by default.

@baybal
Copy link

baybal commented May 24, 2020

same with escaped tab &#9;

Makes very hard to display the code

@Tofandel
Copy link

Waiting for this to be merged..
Current workaround
Use

{{'\xa0'}}

instead of

&nbsp;

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

Successfully merging a pull request may close this issue.

6 participants