fix: $refs.popper can be null initially

Related to histoire-dev/histoire#206
francomattar · Aug 2, 2022 · bd07d5c · bd07d5c
1 parent cb3d766
commit bd07d5c
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 4 deletions.
diff --git a/packages/floating-vue/src/components/Popper.ts b/packages/floating-vue/src/components/Popper.ts
@@ -71,7 +71,7 @@ export default () => defineComponent({
 
     referenceNode: {
       type: Function,
-      required: true,
+      default: null,
     },
 
     popperNode: {
@@ -478,7 +478,7 @@ export default () => defineComponent({
       this.$_preventShow = false
 
       // Nodes
-      this.$_referenceNode = this.referenceNode()
+      this.$_referenceNode = this.referenceNode?.() ?? this.$el
       this.$_targetNodes = this.targetNodes().filter(e => e.nodeType === e.ELEMENT_NODE)
       this.$_popperNode = this.popperNode()
       this.$_innerNode = this.$_popperNode.querySelector('.v-popper__inner')

diff --git a/packages/floating-vue/src/components/PopperWrapper.vue b/packages/floating-vue/src/components/PopperWrapper.vue
@@ -16,7 +16,6 @@
     }"
     :theme="finalTheme"
     :target-nodes="getTargetNodes"
-    :reference-node="() => $refs.popper.$el"
     :popper-node="() => $refs.popperContent.$el"
     :class="[
       themeClass,
@@ -86,7 +85,7 @@ export default defineComponent({
 
   methods: {
     getTargetNodes () {
-      return Array.from(this.$refs.popper.$el.children)
+      return Array.from(this.$el.children)
         .filter(node => node !== this.$refs.popperContent.$el)
     },
   },