Q:

VSCode Issue: Vue example doesn't work in Firefox / Chrome, but it works in jsfiddle

When I run the below code in Firefox or Chrome it gives me the following result:
{‌{ value }}
{‌{ value }}
{‌{ element }}
{‌{ element }}
{‌{ element }}
{‌{ element }}

Here is the actual code, when I run it in jsfiddle or stack overflow, it works just fine:

new Vue({
  el: '#app',
  data: {
    testData: {
      name: 'TESTOBJECT', 
      id: 10,
      data: [1.67, 1.33, 0.98, 2.21]
    }
  }
});
 
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>

<div id="app">
  <ul>
    <li v-for="value in testData">
      <template v-if="Array.isArray(value)">
        <div v-for="element in value">{{ element }}</div>
      </template>
      <template v-else>
        {{ value }}
      </template>
    </li>
  </ul>
</div>

What could be the issue?

A:

This is a VSCode issue. It does not show all characters, but stores them anyway. So it showed me the following:
{{ value }}
But what actually was saved inside the file and also processed by the browser was this:

To prevent this error, you can install the following VSCode extension: Highlight Bad Chars

