Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Console errors on page load

See original GitHub issue

When I include the component this way into a component of my app:

<template>
  <div>some long content</div>
  <Waypoint @change="onRead" :active="notYetRead"></Waypoint>
</template>

// This is composition API inside <script setup>

import { Waypoint } from "vue-waypoint"

const notYetRead = ref(true)
const onRead = (waypointState: "IN" | "OUT") => {
  if (waypointState === "IN") {
    console.log("seen")
    notYetRead.value = false
  }
}

The event never fires, and when the page loads I get several warnings by Vue:

[Vue warn]: onMounted is called when there is no active component instance to be associated with. Lifecycle injection APIs can only be used during execution of setup(). If you are using async setup(), make sure to register lifecycle hooks before the first await statement. runtime-core.esm-bundler.js:6584
[Vue warn]: onBeforeUpdate is called when there is no active component instance to be associated with. Lifecycle injection APIs can only be used during execution of setup(). If you are using async setup(), make sure to register lifecycle hooks before the first await statement. runtime-core.esm-bundler.js:6584
[Vue warn]: onUpdated is called when there is no active component instance to be associated with. Lifecycle injection APIs can only be used during execution of setup(). If you are using async setup(), make sure to register lifecycle hooks before the first await statement. runtime-core.esm-bundler.js:6584
[Vue warn]: onBeforeUnmount is called when there is no active component instance to be associated with. Lifecycle injection APIs can only be used during execution of setup(). If you are using async setup(), make sure to register lifecycle hooks before the first await statement. runtime-core.esm-bundler.js:6584
[Vue warn]: Missing ref owner context. ref cannot be used on hoisted vnodes. A vnode with ref must be created inside the render function.

My component loads and works fine if I remove Waypoint.