Vue Bug on pre

HTML

<div id="app">
  <span>{{ test }}</span>
  <pre><span>{{ test }}</span></pre>
  <!-- <div v-pre><pre><span> </span></pre></div> adding v-pre directing doesn't work -->
  <!-- <span> </span> without <pre></pre> works fine -->
  <!-- <pre><span>&nbsp;</span></pre> using nbsp works fine  -->
</div>

JavaScript

new Vue({ // eslint-disable-line no-new
  el: '#app',
  data: function(){
  	return {
    	test: "test value"
    }
  }
});