Mobile bug with Tawk.to widget in AngularJS

Recently, I've been utilizing tawk.to as the chat service for my client's AngularJS application. However, there seems to be an issue when accessing the chat widget on mobile devices. Once the widget is closed and reopened, it automatically shuts down, preventing users from chatting.

Following the instructions from the official site, we simply pasted a script at the bottom of the page:

var $_Tawk_API={},$_Tawk_LoadStart=new Date(); (function(){ var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0]; s1.async=true; s1.src=''; s1.charset='UTF-8'; s1.setAttribute('crossorigin','*'); s0.parentNode.insertBefore(s1,s0); })();

Upon further investigation, it was discovered that the problem stemmed from hash prefixing in the address bar. Each time the "Start Chat" button was clicked, another # symbol was added causing the chat widget to close due to the conversion of %23.

Despite searching high and low for a solution, the bug still persists. Can anyone offer assistance in resolving this issue?

javascriptangularjsroutes

Answer №1

Ensure this code runs only after the widget has fully loaded:

Tawk_API = Tawk_API || {}; Tawk_API.preventHistoryOnMobile = true;

See a demonstration of this in action:

http://example.com/widget-load/

Thank you,

Robert

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Using React JSX to set a dynamic color when hovering over an element

Hello there! Thanks for taking the time to read my inquiry. I have been presented with a challenge involving a specific color chosen by the customer. This color plays a crucial role in the overall application context. I've successfully managed to cha ...

javascriptcssreactjsjsxpseudo-class

Exploring Next.js with Nested JSON Data

I'm struggling to retrieve the data from a JSON file in my Next.JS project, particularly when it comes to accessing nested arrays. I've managed to successfully display Home, One, and Two using the .map method, but I'm having trouble with Thr ...

javascriptreactjsjsonnext.js

How to retrieve the value instead of the key/ID in a Laravel controller?

I am extracting data from the database and displaying it on the invoice view page using the json_encode($items); function. When I try to insert the 'price' field into the database, only the id/key is being stored instead of the actual value. Any ...

javascriptphpjsonlaravel

retrieve information and populate the model in the angularjs view

$scope.orderDetails = [ { "id":"115584", "user_id":"78937", "your_sys_global":null, "created_at":"2017-12-08 05:03:20" }, { "id":"115585", "user_id":"78936", ...

javascriptangularjs

``To enhance the scrolling functionality, dynamically apply a specific class when the page has reached

I am currently working with a piece of code that dynamically adds and removes the classes .nav-down and .nav-up to #nav based on the user's scrolling behavior. jQuery(document).ready(function($){ var didScroll; var lastScrollTop = 0; var delta ...

javascriptjqueryhtmlcss

Angular JS model not being updated when selecting a date value with datepicker

Whenever I try to use the datepicker, I encounter an issue where the model value doesn't bind to the model when I select a date. Nothing happens when I select a date. Can anyone point out where I might be going wrong? Any help would be greatly appreci ...

javascriptangularjsdatepicker

Set Divs in Absolute Position Relative to Each Other

I need to create a simple navigation system using <div> elements as individual pages. The goal is to have "next" and "back" buttons that allow users to switch between these pages with a smooth fade-in and fade-out effect, all powered by jQuery. Howev ...

javascriptjquerycsspositioningslideshow

Easiest method for retrieving complete file paths using JavaScript

There has been much discussion around this issue: I am in need of retrieving the full file path through a web page. The scenario involves an application running on the same machine as the browser, where the application initiates a local HTTP server and ope ...

javascripthtmlsecuritygoogle-chrome

Update a parent page section with new content once a child modal popup is closed

I've hit a roadblock with this problem and despite trying several solutions, I can't seem to get it right. Within my MVC6 view, there are multiple partials. One of the partials contains an anchor tag: @model ModelA <div> @Html.TextBoxF ...

javascriptjqueryajaxasp.net-mvcpopup

Creating separate versions (development and production) of JavaScript code: a step-by-step guide

I have been working on a small web application that is distributed in a Docker container, using an nginx image. This application consists of plain html and js code, without any frameworks. Within the JS code, there is access to a remote host via WebSocket ...

javascriptnginxdocker

Utilize Node.js and Cheerio to extract data from an HTML table

Having trouble converting an HTML table to JSON. HTML table structure: <div id="content"> <h1>content-information</h1> <table class="testinformation"> <thead> <tr> ...

javascripthtmlnode.jsparsingcheerio

React Router V6 displays a white screen

I am experiencing an issue with React Router where it constantly displays a blank page even though I have implemented the code correctly. Here's how my code looks: App.js: import React from "react"; import { BrowserRouter as Router, Routes, ...

javascriptreactjsreact-routerreact-router-dom

Disappear the div when it has no content and apply a class to a different div

Our product has both a regular price and a sale price. Both prices are styled with a width of 50% and displayed as inline-block elements. I am looking to create a script that will change the style (adding a class for 100% width and changing the font styl ...

javascriptjquery

Upon making an axios get request to localhost:4000/, the responseUrl redirects to localhost/ which leads to a 404 error

When enhancing a server extension on an already existing same-server backend, I encountered some issues: import server from 'myserver'; import { verifyJwt } from 'jwt.middleware'; import axios from 'axios'; const app = server ...

javascriptnode.jsexpressaxios

The initial div sibling is utilized as the backdrop for the subsequent dynamic div

Exploring HTML Markup, <div class="blurredBackground"></div> <div class="content"> Hello! This content is always changing dynamically.<br> If the height of the second div increases, I need the first di ...

javascripthtmlcss

Step-by-step guide on mocking a method within a method using JEST

Currently, I am facing a challenge in unit testing a method named search. This method consists of three additional methods - buildSearchParameter, isUnknownFields, and readAll. I am looking to mock these methods but I am uncertain about the process. Can ...

javascriptnode.jstypescriptunit-testingjestjs

Angular directive that watches for property changes without taking action

I've recently developed a directive that utilizes d3 for rendering, with data being passed in through props like this: <my-directive words="fromControllerData"></my-directive> The "fromControllerData" can be modified by the parent compon ...

javascriptangularjsangularjs-directive

When you select a single checkbox, all checkboxes within the array are automatically checked

I am looking to automate the checking of all checkboxes in a row when one checkbox is selected. The checkbox I am working with is part of an array. Specifically, I want to check all checkboxes in that row if one checkbox is checked. Below is a snippet of m ...

javascriptjqueryasp.net

Creating a JavaScript array in Rails 4 based on current data without the need to reload the webpage

Currently in my rails 4 app, I am working on a unique tags validation using jquery validate to ensure that tags are not duplicated before they can be added to an item. The tag list structure is as follows: <div id="taglist"> <span class="label ...

javascriptjqueryhtmlruby-on-railsajax

Deliver real-time notifications to linked users by leveraging socket.io and node.js

Is there a solution for sending real-time updates to connected clients every second without using the setInterval() function in nodejs and socket.io? Please provide an alternative method that fits my specific scenario. ...

javascriptjqueryhtmlnode.jssocket.io