What is happening here and how to fix it?

Vue single file component, gif:


Are you able to reproduce this in another project? Would it be possible to share this file?


It seems at basic test, it is not occurring in new project, but I didn't replicate the libraries used / phpstom settings.

It's still occurring when the file is:

<b-field class="columns">
<div class="column">
<div class="field">

It's happening with custom html tags, these are from the Buefy library.


Just my 5 cents as I have managed to partially reproduce the issue with the original code sample.

Initially, bad things happen when you try to rename the tag in `<div class="field">`. As I could see, you are selecting the whole tag contents, so the closing tag is not changed automatically, like:

What happens next is that closing </div> now matches different <div>, so it changes when you are trying to edit the closing tag.

However, you may select & change the tag only (without "class"), so the closing tag will be changed accordingly:


No, it's happening when you just select the tag as well.



can't reproduce with similar code.

Could you share a sample app the issue can be repeated with?


Please sign in to leave a comment.