ref: random stuff

src/features/input.ts

@@ -1,5 +1,5 @@
 import { DataStore, clamp, compress, decompress } from "@sv443-network/userutils";
-import { error, getVideoTime, info, log, warn, getVideoSelector, getDomain, compressionSupported, t, clearNode, resourceAsString, getCurrentChannelId, currentMediaType, sanitizeChannelId, addStyleFromResource, isValidChannelId } from "../utils/index.js";
+import { error, getVideoTime, info, log, warn, getDomain, compressionSupported, t, clearNode, resourceAsString, getCurrentChannelId, currentMediaType, sanitizeChannelId, addStyleFromResource, isValidChannelId, getVideoElement } from "../utils/index.js";
 import type { AutoLikeData, Domain } from "../types.js";
 import { disableBeforeUnload } from "./behavior.js";
 import { emitSiteEvent, siteEvents } from "../siteEvents.js";
@@ -41,7 +41,7 @@ export async function initArrowKeySkip() {
 
     log(`Captured arrow key '${evt.code}' - skipping by ${skipBy} seconds`);
     
-    const vidElem = document.querySelector<HTMLVideoElement>(getVideoSelector());
+    const vidElem = getVideoElement();
     
     if(vidElem)
       vidElem.currentTime = clamp(vidElem.currentTime + skipBy, 0, vidElem.duration);
@@ -135,7 +135,7 @@ export async function initNumKeysSkip() {
     if((document.activeElement !== document.body && ignoreElement) || ignoreElement)
       return info("Captured valid key to skip video to, but ignored it since this element is currently active:", document.activeElement);
 
-    const vidElem = document.querySelector<HTMLVideoElement>(getVideoSelector());
+    const vidElem = getVideoElement();
     if(!vidElem)
       return warn("Could not find video element, so the keypress is ignored");
 

src/utils/dom.ts

@@ -13,6 +13,11 @@ document.addEventListener("DOMContentLoaded", () => domLoaded = true);
 /** Returns the video element selector string based on the current domain */
 export const getVideoSelector = () => getDomain() === "ytm" ? "ytmusic-player video" : "#player-container ytd-player video";
 
+/** Returns the video element based on the current domain */
+export function getVideoElement() {
+  return document.querySelector<HTMLVideoElement>(getVideoSelector());
+}
+
 /**
  * Returns the current video time in seconds, with the given {@linkcode precision} (2 decimal digits by default).  
  * Rounds down if the precision is set to 0. The maximum average available precision on YTM is 6.  
@@ -25,7 +30,7 @@ export function getVideoTime(precision = 2) {
 
     try {
       if(getDomain() === "ytm") {
-        const vidElem = document.querySelector<HTMLVideoElement>(getVideoSelector());
+        const vidElem = getVideoElement();
         if(vidElem)
           return res(Number(precision <= 0 ? Math.floor(vidElem.currentTime) : vidElem.currentTime.toFixed(precision)));
 
@@ -35,7 +40,7 @@ export function getVideoTime(precision = 2) {
         });
       }
       else if(getDomain() === "yt") {
-        const vidElem = document.querySelector<HTMLVideoElement>(getVideoSelector());
+        const vidElem = getVideoElement();
         if(vidElem)
           return res(Number(precision <= 0 ? Math.floor(vidElem.currentTime) : vidElem.currentTime.toFixed(precision)));
 
@@ -116,6 +121,9 @@ function ytForceShowVideoTime() {
  */
 export function waitVideoElementReady(): Promise<HTMLVideoElement> {
   return new Promise(async (res) => {
+    if(getVideoElement()?.readyState === 4)
+      return res(getVideoElement()!);
+
     const waitForEl = () => addSelectorListener<HTMLVideoElement>("body", getVideoSelector(), {
       listener: async (vidElem) => {
         if(vidElem) {