I want to first check for the presence of a certain text content ("No Match Found") on the web page.
If the text exists, I want to refresh the page, wait for exactly 3 seconds, then repeat the same check.
If the text DOES NOT exist, I simply want to end the loop and display an alert.
This is what I have so far:
var x = "No Match Found"
if (document.body.textContent.includes(x)) {
location.reload()
setTimeout(function() {
document.getElementById("btn-continue").click()
alert("BUTTON WAS CLICKED")
}, 3000)
}
Edited code a bit.
The problem now seems to be that after location.reload(), the script is no longer applying to the refreshed page. I'm unable to see even an alert popup or console.log after the refresh happens.
Here is a way how you could do it:
const d=new Date(), x="No"+" Match Found.",
div=document.querySelector("div");
div.textContent=d.toLocaleString()+" - "+(d.getSeconds()%5?x:"Got it!")
// Wait a little while before checking:
setTimeout(()=>{
if(document.body.textContent.includes(x))
location.reload();
else
console.log("loop ended.");
},995);
<div></div>
You should not use a while loop for waiting, as this will completely block your browser (will make it unresponsive). Use setTimeout() instead. In the callback function of setTimeout I check for the existence of the search string and conditionally reload the page.
In my example I insert the search text into the first div on the page if the current time has a seconds value that is divisible by 5. In this case the .includes() method will find the search text in the target div and my reloading cycle is stopped. I shortened the waiting time from 3 seconds to slightly under 1 second in order to get a quicker response.
In my snippet I composed the search string x of two parts. I did this so it wouldn't be found within my <script> element itself which - at least in this SO snippet - is within the <body> tag.
I work in a Call center (ticket based Support) and for me to get a ticket I need to click on 2 Buttons. the one that opens the tickets section, and the one that actually gets me a ticket. After i click on the Get_ticket class, the ticket box closes. So i need to start again to click on the "Tickets" Button, and then on Get_Ticket. Tickets button -> Get_ticket. And repeat and repeat. I want to tell Google console to help me with this. I found a way but it's not very friendly. I tried with the button.click function at a different interval but it's not working...If i put the function separately, it's working, but when I put the functions at the same time in Console, it's not working. Can you please give me an advice ? Those are the functions:
1.(click on TICKETS)
var button = document.getElementsByClassName("_1f8o8ru7")[0];
setInterval(function(){button.click();},2000);
2.(Click on GET TICKET)
var button2 = document.getElementsByClassName("_sl2x43m")[0];
setInterval(function(){button2.click();},2500);
The second interval should be added inside the first interval. I also recommend to use setTimeout, instead of setInterval.
setInterval(function(){
var button = document.getElementsByClassName("_1f8o8ru7")[0];
button.click();
setInterval(
function(){
var button2 = document.getElementsByClassName("_sl2x43m")[0];
button2.click();
},2500);
},2000);
After you figure it out, you can save your code in a js file: my_script.js and use Chrome extension JS Injector to automatically inject it in your page, without needing to use Chrome DEV Tools.
you need to call first button click on click of first button call another method on given timeout
so first time 1 button is clicked after on click of first button call another button method with 500 timeouts will be ok no need to do 2000 or 2500 timeout
2ยบ EDIT:
thought it was solved but it isn't. when a page is loaded i want to add a class to some elements(on this case is to buttons) and for now my code is:
$("button").each(function(index){
// add the class
setTimeout(function(){
$(this).addClass("varrimento");
}.bind(this),index*5000);
// remove the class
setTimeout(function(){
$(this).removeClass("varrimento");
}.bind(this),(index+1)*5000);
});
This code add the class "varrimento" for 5 secs to each button one by one but it has 2 problems.
When i change page and return to the initial page it's like the
setTimeout of the first visit on the page it's still running, so on
the second visit the code of "varrimento" it's added to the buttons
again and they are not one by one like the first visit.
In some pages, don't know why, it takes too long to adding the class
to the elements. ex: on page "index" right after i visit page, the
class is added immediately to the first button but changing to second
page (code is the same, the only thing that differs is the amount of
buttons) it takes like 15secs to the first button have the class.
Second day in a row trying to solve this problem but can't figure it out. any help guys?
Save your timeout variable in localStorage and then remove it -
var timeout = setTimeout(auto_reload, 90000);
localStorage.setItem("timeout", timeout);
var timeout = localStorage.getItem("timeout");
clearTimeout(timeout);
I have the bit of code that reloads my content via ajax, but i dont want it reload if some is in the middle of a post(this is forum, that i am pulling in via ajax)
//refresh every 15 secs
var refreshId = setInterval(function()
{
$('#fluxbb-forum').load(current_forum_url);
}, 15000);
How would i check if a form field is "active"? I am trying to avoid setting unnecessary flags if possible.
Thank you in advance
$("#formField").is(":focus")
...will tell you if the user has focus in a form field with an ID of "formField". Do this before your AJAX function.
You can also start a timer and determine when the user last pressed a key, in case they walk away.
I have a problem, what i cant solve yet. I have a popup page with a menu, and tabs, and there is a settings tab. On settings tab, i save some item to localstorage, one of them is notification_time for a desktop notification.
Note: i have no options page!
My extension has this popup window and a background page, its function is to alert user with a desktop notification. I show notification in every 5,10,30 minutes, 1,2 hours etc. And this time should be chooseable on popup pages's options menu. The problem is, if 5 minutes is saved, and when i update to 10 minutes for example, than background.html is not updating himself! I rewrited code almost 20 times, but couldnt find solution. Heres a code sample,and a printscreen to get clear about my problem.
popup:
$("#save_settings").click(function(){
var bgp = chrome.extension.getBackgroundPage();
localStorage.setItem("notifynumber",$("#notifynumber").val());
if($("#notify").attr('checked')){
localStorage.setItem('chbox','true');
} else {
localStorage.setItem('chbox','false');
}
if($("#notif_time_select :selected").val()!="default"){
bgp.setTime(parseInt($("#notif_time_select :selected").val()));
}
if($("#org_select :selected").val()!="default"){
localStorage.setItem('org',$("#org_select :selected").val().replace(/%20/g," "));
}
});
Note: save_settings is a button, on the tab there is a checkbox (if checked then notifications are allowed, else diabled). There are two html select tags, one for choosing some data (org = organisation), and one, for selecting time. "#notif_time_select" is the html select tag, where i choose 5,10,30 minutes etc...
So, whenever i click save button, i save checkbox state to localstorage,and i call one function from background page, to save time.
:bgp.setTime(parseInt($("#notif_time_select :selected").val()));
background page:
for saving time i use function setTime:
var time = 300000; // default
function setTime(time){
this.time=time;
console.log("time set to: "+this.time);
}
after, i use setInterval to show notification periodically
setInterval(function(){
howmanyOnline("notify",function(data){
if(data>localStorage.getItem("notifynumber")){
if (!window.webkitNotifications) { // check browser support
alert('Sorry , your browser does not support desktop notifications.');
}
notifyUser(data); // create the notification
}
if(localStorage.getItem('tweet')=='true'){
if(data>localStorage.getItem("notifynumber")){
sendTweet(data,localStorage.getItem('org'),localStorage.getItem('ck'),localStorage.getItem('cs'),localStorage.getItem('at'),localStorage.getItem('ats'));
}
}
});
},time);
The code inside setInterval works fine, the only problem is,that
},time);
is not updating well. If i change settings to show notifications in every 10 minutes, it stays on 5 minute. The only way is to restart the whole extension. How could i update setInterval's frequency without restarting the whole extension? Thanks Jim
What if i save notif_time to localStorage too, and in background, i set up a listener, to listen for localStorage changes. Is there a way to listen for a particular localStorage item changes?!
Right now, setInterval only runs once, when your application loads. If you want intervals to fire at a new time interval, you should use clearInterval and then make a new call to setInterval.
// set a new time, wipe out the old interval, and set a new interval
function setTime(t) {
window.time = t;
clearInterval(notifInterval);
notifInterval = setInterval(makeNotification, time);
}
// set first interval
notifInterval = setInterval(makeNotification, time);
function makeNotification() {
// do what you need to make a notification
}
Here, notifInterval is a reference to the interval, returned by setInterval, that is used to clear it.
The source code in your question is not completed, but I guess you called setInterval() and then modified window.time in the background page.
Your window.time is not an object but a number value, and setInterval() can't "see" changes of window.time after invocation.
Try this:
function onTimeout() {
// do your notification.
setTimeout(onTimeout, time);
}
setTimeout(onTimeout, time);