Get 'tweet' event from Twitter Web Intents

sergeyzd
@sergeyzd sergeyzd

I have such simple code for my site, but 'tween' event doesn't trigger. Can someone help me?
NOTE: i need to use exactly window.open() to show tweet popup, because some other stuff should be done before twitter popup appears.

  1. twttr.events.bind('tweet', function(event) {
  2.     alert('tweet!!!');
  3. });
  4.  
  5. function jsTweet() {
  6.    // some other stuff here
  7.    // ...
  8.    var urlTW = "https://twitter.com/intent/tweet?text=Text&url=http://my_url.com";
  9.    window.open(urlTW, "", "toolbar=0, status=0, width=650, height=360");
  10. }
  1. <a href="javascript:void(0)" onClick="jsTweet();">
2 years 38 weeks ago

Replies

episod
@episod Taylor Singletary

Are you additionally loading widgets.js from platform.twitter.com?

While it's likely unrelated, the format of URL in your urlTW variable is wrong -- the URL parameter should be percent-encoded. Also, though I know it's just a placeholder, underscores in a domain name are invalid and this will not likely be evaluated as a valid URL.

Example with proper encoding and usage of a hyphen instead of an underscore:

  1. var urlTW = "https://twitter.com/intent/tweet?text=Text&url=http%3A%2F%2Fmy-url.com";

All that said, I'm having difficulty getting the tweet event to trigger in other tests I'm performing right now and I will continue looking into this possible bug. Thanks!

2 years 38 weeks ago
sergeyzd
@sergeyzd sergeyzd

URL doesn't matter, because my code above is just for an example. And of course it is supposed that widgets.js was loaded. Anyway, I am Looking forward to your answer.

2 years 38 weeks ago
sergeyzd
@sergeyzd sergeyzd

@episod, any news on this issue?

2 years 35 weeks ago
episod
@episod Taylor Singletary

When it came time to look into this in more detail we were unable to reproduce the issue. However, I'll take another look at this as soon as I get a chance.

2 years 35 weeks ago
sergeyzd
@sergeyzd sergeyzd

this issue is 100% reproducible. Just try to run example from my first post.

2 years 34 weeks ago
episod
@episod Taylor Singletary

Have you tried binding these events while using the pop-up code already provided by widgets.js? If you want to track the events, you should be relying on the widgets.js code to handle the window invocation.

2 years 34 weeks ago
MattMcGuinness
@MattMcGuinness Matthew McGuinness

Web Intents Events does not work. I have tried every which way to bind to the tweet event, but it is never fired. This is a bug guys. Please let us know a realistic timescale for fixing it. This is a pretty essential solution for me and a lot of other developers because your API tools suite doesn't include a Javascript SDK - there is no other way of easily using Twitter from Javascript! Surely you must have run successful tests for the Web Intents service during development. How did you make it work then?

2 years 35 weeks ago
episod
@episod Taylor Singletary

I've begun engaging with you on Twitter about this after your @mention last night. When you have a chance to look into my suggestions, we can resume the conversation here.

2 years 34 weeks ago
nyhtal
@nyhtal Alan

i'm having the same problem, the bind events don't seem to do anything when using the standard twitter button (that render in an iframe). if i put a plain link on my page then the bind events work..but i want the standard button to work so i get the default look/feel as well as the number of tweets. any chance there's a solution for that?

Tweet

Retweet

twttr.events.bind('click', function(event) {alert('twitter click');});

2 years 31 weeks ago
nyhtal
@nyhtal Alan

apparently there is a blocking bug with the IE implementation of the button

2 years 30 weeks ago
manakor
@manakor Nik Sumeiko

Does this bug is solved already? Because I've the same error that 'tweet' event is not fired in Internet Explorer (IE7, 8). Any solutions so far?

1 year 27 weeks ago
dhavalpatels
@dhavalpatels Dhaval Patel

Web Intents Event for "tweet" is not working at all for any browser if I am using window.open.

2 years 29 weeks ago
kurrik
@kurrik Arne Roomann-Kurrik

window.open more often than not gets blocked by browser popup blockers. You need to call that function in response to a user action, for example, in a click event handler.

2 years 28 weeks ago
dhavalpatels
@dhavalpatels Dhaval Patel

I am doing the same thing.
For example,

  1. <a id="shareTwitterGallery" class="GalleryTR_Twt" onclick="javascript:twitterShareClick()"></a>
  2.  
  3. My onclick function
  4. function twitterShareClick() {
  5. twttr.events.bind('tweet', function (event) {
  6.              alert('testing');
  7. });
  8.  
  9. window.open("https://twitter.com/intent/tweet?url=" + myURL+ "&text=myText", "Twitter", "status = 1, left = 430, top = 270, height = 550, width = 420, resizable = 0");
  10. }

I don't see any problem with this code

2 years 28 weeks ago
kurrik
@kurrik Arne Roomann-Kurrik

Make sure your event listener is firing - you should also make sure that you're serving your page from http:// or https://, not file:/// URLs.

The following code worked fine for me:

  1. <!DOCTYPE html>
  2. <html>
  3.   <head>
  4.     <script src="//platform.twitter.com/widgets.js" type="text/javascript"></script>
  5.   </head>
  6.   <body>
  7.     <script>
  8.       var myURL = "http://www.google.com";
  9.       function twitterShareClick() {
  10.         twttr.events.bind('tweet', function (event) {
  11.           alert('testing');
  12.         });
  13.         window.open("https://twitter.com/intent/tweet?url=" + myURL+ "&text=myText", 
  14.                     "Twitter",
  15.                     "status = 1, left = 430, top = 270, height = 550, width = 420, resizable = 0");
  16.       }
  17.     </script>
  18.     This is text
  19.     <a href="#" id="shareTwitterGallery" class="GalleryTR_Twt" onclick="twitterShareClick()">Link</a>
  20.   </body>
  21. </html>
2 years 28 weeks ago
dhavalpatels
@dhavalpatels Dhaval Patel

You can check my link here.

http://www.dhavalpatels.com/twitter/twittertest.html
Its the same code.

2 years 28 weeks ago
kurrik
@kurrik Arne Roomann-Kurrik

Neither Chrome, Firefox, nor Safari had a problem opening the popup from that URL. Which browsers/operating systems do you have an issue with?

2 years 28 weeks ago
dhavalpatels
@dhavalpatels Dhaval Patel

The pop up is opening perfectly but I am talking about the callback event i.e. twttr.events.bind. Its not getting fire.

2 years 28 weeks ago
kurrik
@kurrik Arne Roomann-Kurrik

Sorry, I misunderstood what you originally meant. The following code sends the event:

  1. <!DOCTYPE html>
  2. <html>
  3.   <head>
  4.     <script src="//platform.twitter.com/widgets.js" type="text/javascript"></script>
  5.   </head>
  6.   <body>
  7.     <a id="shareLink" href="https://twitter.com/intent/tweet">Tweet</a>
  8.     <script>
  9.       twttr.events.bind('tweet', function (event) {
  10.         alert('testing');
  11.       });
  12.       var myurl = "http://www.google.com";
  13.       var mytext = "Text";
  14.       var url = "https://twitter.com/intent/tweet" + 
  15.                 "?url=" + encodeURIComponent(myurl) + 
  16.                 "&text=" + encodeURIComponent(mytext);
  17.       document.getElementById("shareLink").href = url; 
  18.     </script>
  19.   </body>
  20. </html>

I think your issue was that the Twitter Intent event code was not recognizing your element as a valid intent link, so wasn't hooking up the correct event listeners. I'm not sure it's going to be possible to use window.open in the way you want to and get an event back.

2 years 28 weeks ago
dhavalpatels
@dhavalpatels Dhaval Patel

This code doesn't work in IE. :(
and yes, It's not working with window.open. Does it going to get solved? So many problems. :(

2 years 28 weeks ago
kurrik
@kurrik Arne Roomann-Kurrik

Which version of IE?

Also, I don't think that the window.open approach will ever be supported. Is there a reason you need to do that over just providing a web intent anchor element?

2 years 28 weeks ago
py
@py Paul Young

The tweet event callback isn't firing for me using the Tweet Button in IE.

2 years 25 weeks ago
twitdevelopers
@twitdevelopers Twit Developers

The tweet event callback isn't firing in IE version 8. Help!

2 years 25 weeks ago
superaircraft
@superaircraft superaircraft

Thanks for this snippet. It is doing fine, even in IE.
Although it took me hours to find out that the Web Intent functionality already opens the popup.

But the problem with this code is, that the text-parameter is entirely fix. This is rarely the case in dynamic web projects.
Many sites have a textarea, where the user writes some text and is supposed to hit the "tweet"-button afterwards.
So, the link is still to be assembled by the developer!
My solution was to put the link together and change the href ON BLUR of the textarea.

It would be great if you could keep this procedure in mind when developing the API.

2 years 25 weeks ago
gonzalingui
@gonzalingui Gonza Lo

The onblur seems to be a great idea! I will try it.
@episod I understand that you are suggesting to open the popup trough the intent functionality of widgets.js, but the procedure described by @superaircraft is developed in various websites.
I suggest something like the intent window looks for handlers on window.opener and automatically binds itself to the events?

1 year 12 weeks ago
leeugene
@leeugene leeugene

not working in ie

2 years 13 weeks ago
EverbuyingFans
@EverbuyingFans Everbuying.com

It doesn't work in IE 8, 30 weeks past, is there any solution now?

1 year 50 weeks ago
nextepmad
@nextepmad Daniel Gábana

this is not working at all!! crappy Twitter...

1 year 18 weeks ago
hry126
@hry126 harry

The code given by @kurrik above, works in IE7/8 and also works for the custom tweet button

1 year 17 weeks ago
aidanfeldman
@aidanfeldman Aidan Feldman

I build my page with very similar code, but both my page and yours are giving cross-domain errors in Chrome 16:

Unsafe JavaScript attempt to access frame with URL http://platform.twitter.com/widgets/hub.html from frame with URL http://www.dhavalpatels.com/twitter/twittertest.html#. Domains, protocols and ports must match.

2 years 22 weeks ago
patty_612
@patty_612 antonella tribi

non riesco a scaricare e accedere a twitter!

1 year 50 weeks ago
remaalkdasy
@remaalkdasy rema
  1.   <head>
  2.     <script src="//platform.twitter.com/widgets.js" type="text/javascript"></script>
  3.   </head>
  4.   <body>
  5.     <script>
  6.       var myURL = "http://www.google.com";
  7.       function twitterShareClick() {
  8.         twttr.events.bind('tweet', function (event) {
  9.           alert('testing');
  10.         });
  11.         window.open("https://twitter.com/intent/tweet?url=" + myURL+ "&text=myText", 
  12.                     "Twitter",
  13.                     "status = 1, left = 430, top = 270, height = 550, width = 420, resizable = 0");
  14.       }
  15.     </script>
  16.     This is text
  17.     <a href="#" id="shareTwitterGallery" class="GalleryTR_Twt" onclick="twitterShareClick()">Link</a>
  18.   </body>
2 years 28 weeks ago
remaalkdasy
@remaalkdasy rema

twttr.events.bind('tweet', function(event) {
alert('tweet!!!');
});

function jsTweet() {
// some other stuff here
// ...
var urlTW = "https://twitter.com/intent/tweet?text=Text&url=http://my_url.com";
window.open(urlTW, "", "toolbar=0, status=0, width=650, height=360");
}

2 years 28 weeks ago
harry_inaction
@harry_inaction Hari Om Vashishtha

is it possible to pass some variables to the called function..

i tried it like this, but failed..

  1. <script type="text/javascript">
  2. twttr.ready(function (twttr) {
  3. twttr.events.bind('tweet', twitnshare('tws_likings', '<?php echo $sess_uid;?>', href));
  4. });
  5. </script>
2 years 3 weeks ago
chanian
@chanian Ian Chan

Yes you can, I would suggest doing something like this:

  1.   var sessUID = '<?php echo $sess_uid; ?>';
  2.   twttr.ready(function (twttr) {
  3.     twttr.events.bind('tweet', function (event) {
  4.       twitnshare('tws_likings', sessUID));
  5.     }
  6.   });

This assumes you've already loaded widgets.js elsewhere. I'm not sure what you were looking for with the "href" as the 3 param, but if you inspect the event object within that callback, you will have access to all the variables documented here: https://dev.twitter.com/docs/intents/events

2 years 3 weeks ago
harry_inaction
@harry_inaction Hari Om Vashishtha

i am glad that you could respond so quickly..

with href , i am trying to generate the current post id,
so i changed it to something like this..

  1.     <script type="text/javascript">
  2.      var sessUID = '<?php echo $sess_uid; ?>';
  3.     twttr.ready(function (twttr) {
  4.     twttr.events.bind('tweet', function (event) {
  5.     var tweetid = event.tweet_id;
  6.           twitnshare('tws_likings', sessUID, tweetid);
  7.         });
  8.     });
  9.     </script>

shouldn't this work

2 years 3 weeks ago
chanian
@chanian Ian Chan

Ah, the tweet intent does not include the tweet that was generated, so tweet_id will not be available. Please take another look over the documentation for javascript events to see what data is available.

2 years 3 weeks ago
harry_inaction
@harry_inaction Hari Om Vashishtha

ok, now this should work perfectly as i can successfully post the post id to twitter from the

  1. <?php echo $row['p_id']?>
  2. <code>
  3.  
  4. so collectively it becomes ..
  5.  
  6. <code>
  7. <script type="text/javascript">
  8.  var sessUID = '<?php echo $sess_uid; ?>';
  9.  var twitid = "<?php echo $row['p_id']?>";
  10.  twttr.ready(function (twttr) {
  11.  twttr.events.bind('tweet', function (event) {
  12.  likeWit('tws_likings', sessUID, twitid);
  13.     });
  14. });
  15. </script>

but no success

2 years 3 weeks ago
chanian
@chanian Ian Chan

This code looks good to me (provided you've defined "likeWit" elsewhere). Can you confirm that the events are firing correctly for you? (ie put an alert or console.log within your callback event). Additionally, are you getting any errors at all? Or is just nothing working?

2 years 3 weeks ago
harry_inaction
@harry_inaction Hari Om Vashishtha

well yes, the alert gets fired successfully..

and the likeWit is a function that is being utilized to capture the facebook like activitiy, which works perfectly, same is being passed the same number of arguments and similar one here by me

so there is no conflict , now whats the way out..

2 years 3 weeks ago
chanian
@chanian Ian Chan

If you have a demo page I could help debug with you, it would make it easier. Otherwise, it looks like you are doing everything correctly.

2 years 3 weeks ago
harry_inaction
@harry_inaction Hari Om Vashishtha

http://dev369.thewittyshit.com/wow.php?tab=2

you can login with your facebook login id and password

2 years 3 weeks ago
chanian
@chanian Ian Chan

http://i.imgur.com/y3MjR.png

I signed in, tweeted, and verified that everything is working. The event fired, and I inspected the event and it correctly passed through all the params. Can you specify exactly what is not working on your end? Possibly provide your browser settings, version to help debug?

Otherwise, things look just fine on my end!

2 years 3 weeks ago
harry_inaction
@harry_inaction Hari Om Vashishtha

the values doesn't go to database like those for facebook like button..

i store 3 things to database..
userid, timestamp, and postid..

2 years 3 weeks ago
chanian
@chanian Ian Chan

Is it possible that for FB, you are expecting integers, where as in this example (from the above screenshot) you are getting Strings?

At this point, the JS-events are being fired correctly, and they are being correctly bound to the tweet event. If things are not being saved in the DB, or there are other errors happening with your app, unfortunately we can't really help out.

2 years 3 weeks ago
harry_inaction
@harry_inaction Hari Om Vashishtha

that was really a great help..
utilizing the same method as yours to know what happens, i got
http://i.imgur.com/evBH9.png
and came to know that initial "href" was the link to the post for example

ISSUE RESOLVED.. THANKS AGAIN.. @chanian

but the event gets fired 10 times as there are 10 different posts on the page and hence 10 different entries in the database..

2 years 3 weeks ago
chanian
@chanian Ian Chan

You just need to find a way to uniquely pass through from each event being fired. I cannot really offer that much help because this is very specific to your application, and not the twitter api / widgets.

Note, the event object in event callback contains info about the DOM element that triggered the event. You could store the post id in the parent element. So you could do something like:

  1. <div id="post1234">
  2.    <a href="http://twitter.com/share" class="twitter-share-button">Tweet</a>
  3. </div>
  4.  
  5. twttr.events.bind('tweet', function (event) {
  6.    alert(event.target.parentNode.getAttribute('id'));
  7. });
2 years 3 weeks ago
harry_inaction
@harry_inaction Hari Om Vashishtha

The point is..

The event has been put in a while loop because posts has to be loaded from database, so id is going to be the same in each call..

So problem.. is really not resolved, although i really appreciate your help and time you spent for my silly queries..@chanian

How do i utilize the id as i need not to put it in alert.
thanks again

2 years 3 weeks ago
harry_inaction
@harry_inaction Hari Om Vashishtha

its not working

2 years 3 weeks ago
ruba_thyagu
@ruba_thyagu ruba_thyagu
  1.   <head>
  2.     <script src="//platform.twitter.com/widgets.js" type="text/javascript"></script>
  3.   </head>
  4.   <body>
  5.     <script>
  6.       var myURL = "http://www.google.com";
  7.       function twitterShareClick() {
  8.         twttr.events.bind('tweet', function (event) {
  9.           alert('testing');
  10.         });
  11.         window.open("https://twitter.com/intent/tweet?url=" + myURL+ "&text=myText", 
  12.                     "Twitter",
  13.                     "status = 1, left = 430, top = 270, height = 550, width = 420, resizable = 0");
  14.       }
  15.     </script>
  16.     This is text
  17.     <a href="#" id="shareTwitterGallery" class="GalleryTR_Twt" onclick="twitterShareClick()">Link</a>
  18.   </body>

The about code shared here is not working in a way that its not giving response back to the site...

1 year 43 weeks ago