When looking at the code below, it's evident that its behavior can vary depending on the browser being used. It appears that there are instances where the DOM is not fully loaded despite using $(document).ready or similar checks.
In Firefox, the "else" statement is never reached, but in Chrome or Opera, it is sometimes reached upon page reload.
It seems that a portion of the script associated with Vue-generated content may not be functioning correctly. Strangely enough, everything works fine on reload without any changes being made.
if($('.content-generated-by-Vue(v-if)').length){
console.log('sometimes this');
}
else{
console.log('sometimes this');
}
Interestingly, the script seems to work properly when the user is authenticated as an admin in Laravel.
This issue was initially part of a real Laravel project located within the "general script" public/js/functions.js. After attempting to separate and defer the function, it was eventually moved to the "mounted" hook of the Vue instance, with no change in behavior.
Why does this script behave differently on a general refresh (f5)?