Clean up beacon on-visibility-change handling

The previous version was not posting the beacon when the page was
loaded and visible.

app/javascript/controllers/beacon_controller.js

@@ -4,12 +4,15 @@ import { Controller } from "@hotwired/stimulus"
 export default class extends Controller {
   static values = { url: String }
 
-  visibilityChanged() {
+  connect() {
     this.#sendBeacon()
+    this.onVisibilityChange = this.#sendBeacon.bind(this);
+    document.addEventListener("visibilitychange", this.onVisibilityChange)
   }
 
   disconnect() {
     this.#sendBeacon()
+    document.removeEventListener("visibilitychange", this.onVisibilityChange)
   }
 
   #sendBeacon() {