Chat box getting disappeared after page reload/Refresh in Firefox

Question

I have three radio buttons and a submit button. Initially a contact box button will display in website, Upon clicking the button, these three buttons will appear. We can select and we need to click one of them. Two radio buttons are for displaying popups and next one is for displaying live chat box. So I have written the following code for this. Please see the link: https://pastebin.com/RgD0vuB1

I have implemented the code. But I faced two issues:

First Issue: I used setInterval and clear interval for hiding the livechat box at first(hiding with its id/class didn't worked). Added the following code:

===================

<script>
 var timer = window.setInterval(function(){
jQuery('#customer-chat-iframe').css("display", "none");
}, 0); 
</script>

===================

The chat is hidden initially. But upon refreshing the page, even if i gave zero delay, chat box is showing like a blink and suddenly disappeared. I dont want to show chat box blinking even for a small time.

Main Issue:

I selected chat radio button, submitted and started chatting. Chat has both user and admin end. So when chat begun, if i refresh the page (user end - FireFox (55.0.2) ), and then again click on Chat radio button, live chat box is getting disappeared. So that from customer end, he/she is not able to do futher chat. But the issue is not in chrome. Even if we refresh the page, after clicking the radio button, the chat continues without missing anything. Do you know why? I am sitting with this for a long time. This code works well for Chrome.

So please help guys.

Thanks

Answer 1

You have to clearInterval(timer) then it will work as you expected. Hope this helps.

    var timer = window.setInterval(function(){
    jQuery('#customer-chat-iframe').css("display", "none");
    }, 0); 
    window.clearInterval(timer);