Использовать vue slot html в javascript, предотвращая его рендеринг

Question

ниже приведен простой компонент Vue, который визуализирует кнопку (используйте фрагмент ниже в качестве демонстрации).Нажав на нее, он передаст innerHTML слота функции (в настоящее время это простой console.debug ()).Решение работает хорошо, но ему нужно удалить родительский слот (да, я знаю, что он скрыт, но я хочу более чистое решение, если это возможно).

Vue.component('test', {
  template: `
        <div id="test">
            <button @click="pressHandler">Press</button>
            <div id="hidden-slot" v-show="false">
                <slot></slot>
            </div>
        </div>
  `,
  methods: {
      pressHandler() {
          // here I pass slot rendered HTML to another function/framework
          console.debug(this.slot);
      }
  },
  mounted() {
      var slotContainer = this.$el.querySelector('#hidden-slot');
      this.slot = slotContainer.innerHTML;
      slotContainer.parentNode.removeChild(slotContainer);
  }
});

new Vue({el: "#app"});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>

<div id="app">
  Instructions: please enable developer console then presse the button
  <test>
    <h1>This block will be hidden</h1>
    <strong>Text to insert</strong>
  </test>
</div>

Мне нужен способ избежать тега slot в шаблоне, например:

<template>
    <div id="test">
        <button @click="pressHandler">Press</button>
    </div>
</template>

и использованиенекоторый javascript для рендеринга слота (так как его содержимое присутствует в этом. $ slots.default, даже если тег <slot> отсутствует в шаблоне) и присваивает визуализированный HTML-код внутренней переменной.

Следующий фрагментпечатает содержимое слота как Vnode, а не как HTML:

Vue.component('test', {
  template: `
        <div id="test">
            <button @click="pressHandler">Press</button>
        </div>
  `,
  data() {
      return {
          slot: undefined
      };
  },
  methods: {
      pressHandler() {
          // here I pass slot rendered HTML to another function/framework
          console.debug(this.$slots.default[0]);
      }
  }
});

new Vue({el: "#app"});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>

<div id="app">
  Instructions: please enable developer console then presse the button 
  <test>
    <h1>This block will be hidden</h1>
    <strong>Text to insert</strong>
  </test>
</div>