Subscribe on changes!

Using `"` in `v-bind` in HTML strips HTML tag

avatar
Jan 13th 2021

Version

3.0.5

Reproduction link

https://jsfiddle.net/1v5mw7eL/

Steps to reproduce

Run the JSFiddle and see that the text is not bold.


Here's the same sample in Vue 2 (where the text is bold):

https://jsfiddle.net/r8kt362q/

avatar
Jan 13th 2021

You can use single quotes as a workaround:

<div id="app">
  <list :model="{
    widgets: [
      {
        name: 'Test',
        content: '<strong>Bold Text</strong>'      }
    ]
  }"></list>
</div>
avatar
Jan 20th 2021

This problem manifests itself in other ways too. e.g.:

<button v-if="a <b && b > 7">Click</button>

The missing space character after the < leads to it being treated as a tag inside decodeHtmlBrowser and compilation fails. Obviously it's trivial to workaround it in this case by adding a space.

I've made some further notes on #3002 about how we might fix this.

avatar
Mar 28th 2021

(Responding to a message that has since been deleted)

I don't think it is a separate problem, it's just another manifestation of the same bug in the decoder.

I believe the fix I proposed would work for both.

avatar
Mar 29th 2021

I don't think it is a separate problem, it's just another manifestation of the same bug in the decoder.

I believe the fix I proposed would work for both.

Oh, I was so sorry for misunderstood your point.

avatar
Apr 23rd 2021

You can use single quotes as a workaround:

<div id="app">
  <list :model="{
    widgets: [
      {
        name: 'Test',
        content: '<strong>Bold Text</strong>'      }
    ]
  }"></list>
</div>

I have been using this workaround but I have noticed it's messing with my content. For example to allow attributes within the content I must also convert them to single quotes and escape them, see an example below:

https://jsfiddle.net/aq5mkjg9/

However now if I save my content it has replaced the quotes with single quotes. Not quite sure how I missed this beforehand. I could replace them back on the server before saving, however I'd have to do some clever parsing to make sure it's only the attributes I want replaced and not any single quotes that I may have used in the text (e.g. when saying "don't").

@edison1105 any idea when this pull request will go live?

avatar
Apr 24th 2021

@nfplee

any idea when this pull request will go live?

I also don't know. If you are very anxious, maybe we can try to release a Knightly build version via https://github.com/knightly-bot

avatar
Apr 26th 2021

@nfplee

any idea when this pull request will go live?

I also don't know. If you are very anxious, maybe we can try to release a Knightly build version via https://github.com/knightly-bot

Thanks but I've just patched this into a custom build. I was more interested in knowing when the pull request will be officially supported as it works well and I can't see any problems with it.