Calendly iframe, no event listener for updateEvent - reactjs

So I'm working with Calendly iframe and I'm having an unexpected problem, I searched the docs so much and couldn't find a solution.
So Calendly offers a decent iframe with some event listeners for specific use-cases.
I have a single use scheduling url that the iframe receives, when the event is scheduled I fetch a reschedule-url and provide the iframe with it.
The problem is, the event listener for schedule an event is not the same as for update event, and a listener isn't provided for such event... which is so weird for me.
I have no indication when a user updates an event, I can't refresh information from my back-end and display the user with new data.
I guess I'm not the first one with that kind of problem.
Any suggestions?

Related

How to trigger a delayed function call after you have navigated away from the page in React

So I have a really ask but the implementation is eluding me.
I want to simulate the completion of a task in the background in our product demo.
The User Journey :
Arrive at the home page
Click button on the home page -> Button goes into loading state (button replaced by loading animation)
We continue on with the demo and navigate away
We want to come back to the home page after "execution complete" .
Well how do we know if execution is complete ? Well that's where this delayed alert I'm trying to implement comes in. I'd like an alert to be sent out , regardless of what page I am on in the app after some x minutes/seconds of clicking that button.
Any ideas on how I would go about doing this ?
I am trying with redux-toolkit but so far it's only working on the page itself and
if I return to the page after navigating away.
This can be done in two ways,
elevate the state to the point which covers both home page and all the navigation pages, Use react context API to pass data and use useEffect hook to track task completion and do the need full.
Use native javascript to trigger custom event and add an event listner to it Read more about curtom events here
Although this is all just theory, I can help more after viewing the code.

Facebook pixel setup via GTM on a SPA(React) fires page view event twice

So like the title says, I'm using Google Tag Manager to send events to Facebook. Most events seem fine any only fire once, except the view page event. The event is setup to trigger using GTM's history trigger because we're using React for our site.
Originally it was setup to fire on all history changes, but I notice when using preview mode in GTM that there were two history changes being fired.
1: gtm.historyChange
2: gtm.history change-v2
So, I updated the trigger to only fire on some changes and set: Event equals gtm.historyChange With this change I now only see one history change in GTM preview mode, but I still see two in the fb pixel helper chrome extension. One Page event has the an event ID and params I want to see, the other has nothing.
I'm no analytics or pixel expert so even pointing to a possible reason why this is happening would be really helpful.
I believe that the Facebook pixel already considers history change as a page view, so you are double counting it by also triggering it on the history change. Just load it on page view only and it should resolve the issue.

Detect window close on React

I am developing a SCORM course using React and I must detect when user closes the tab to send the correct event to Lms
I tried to search for similar questions, and even following the answers of this thread reactjs event listener beforeunload added but not removed I could not make it work, onbeforeunload is just not called.
Also componentwillunmount do not works when user closes the window directly.
Any suggestions about how I could achieve this?

ng-click on table row does not always fire in Internet Explorer 11

I have a situation where an ng-click on a table row with ng-repeat inside a modal window. The click event has always fired in Chrome. Only once every so often, the click event does not fire in Internet Explorer 11.
Is this a known issue with any workaround?
Correction: the click event is firing, and the ajax call behind it is firing, but the results of the ajax call are IE's cached results rather than the results of the latest query.
I believe the problem is described in this question:
Better Way to Prevent IE Cache in AngularJS?

Silverlight webbrowser control

Is there a way to fire an event when the user clicks on link on a web page. I looked at all the events available for the webbrowser control and the only one I saw was the LoadCompleted event. But this event fires after a page has been loaded. I need to fire an event right before a page is loaded.
Without some co-operating javascript in the web page there is no way to acheive this.
If the web page(s) being displayed are something you control you can add some javascript to the page like this:-
window.external.notify("Page is doing xyz");
you can then use the controls ScriptNotify event to retrieve the string sent by the notify.
You could add such script in the web page onunload event or the onclick event of an anchor, etc.

Resources