Can you post the URL of your website where I can see the issue “in action”?
Having a similar issue. Tracked it down to this:
https://github.com/wp-plugins/duracelltomi-google-tag-manager/blob/master/js/gtm4wp-social-tracker.js#L57
The code checks if there’s already a script element with “twitter-wjs” id in the DOM. And in my (and probably the OP’s) case there is (but it most probably hasn’t (fully) loaded/executed yet). So window.twttr remains undefined in that case.
I’ve “resolved” it for now by modifying the plugin to enqueue gtm4wp-social-actions in the footer.
Would a filter to override the default false parameter specified for it to wp_enqueue_script() be a possible quick/easy/temporary solution?
Or even consider enqueuing gtm4wp-social-actions in the footer by default?What would be the potential problems with that approach? It’s only defining a bunch of callbacks for actions that really don’t usually happen while the page itself hasn’t loaded (well, at least fired DOMReady)?
Scratch the “resolved” part, it still occasionally breaks with the same error due to timing/execution issues even when enqueued in the footer.
The real problem was that the page has had some “old” twitter widgets code
included (embedded timelines). The widget code’s script part needed to be updated with the latest one found on https://dev.twitter.com/web/embedded-timelines :
<script>window.twttr=(function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);t._e=[];t.ready=function(f){t._e.push(f);};return t;}(document,"script","twitter-wjs"));</script>
For posterity, the previous one was just this:
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
Now both scripts have their ready methods properly defined.
Sorry for the confusion.
EDIT: code blocks
Hi,
Now I am a bit confused :-))
Moving the /gtm4wp-social-tracker.js to the footer won’t change anything since the code inside this .js file is surrounded with a jQuery call that executes the necessary bindings on DOM ready.
You mentioned a “latest code” in your second post but as far as I can see this is the one I am using in my plugin.
Basically what I can not understand now: did you find any issue that is connected with my plugin?
Thanks,
Thomas
(and sorry if it should be obvious, maybe I should get some more coffee before posting 🙂 )
Moving gtm4wp-social-tracker.js to the footer avoids the error/exception (well, in simple cases at least).
Alternatively, updating the page’s “old” twitter widget implementation (script loader part) also avoids the error.
(but that’s outside of plugin territory)
I’ve made a few (hopefully simple enough) test cases:
http://zytzagoo.net/test/twttr-widgets-gtm4wp/test-head.html
http://zytzagoo.net/test/twttr-widgets-gtm4wp/test-foot.html
http://zytzagoo.net/test/twttr-widgets-gtm4wp/test-head-no-exception.html
For me, consistently, in all of the latest browsers:
* test-head.html – throws + no console.log message
* test-foot.html – doesn’t throw + console.log message appears
* test-head-no-exception.html – doesn’t throw + console.log message appears
So, all three test pages load the widget properly visually, however, and this is crucial, if there are other scripts/functions queued to execute on DOM ready (so, basically always), those other scripts are prevented from executing due to the exception.
This all happens only if the page contains old ‘twitter-wjs’ loader and your implementation of the new one simultaneously (and gtm4wp-social-tracker.js is being enqueued in the <head>).
Does this clear things up (at least somewhat)?
Yes, thanks for you detailed explanation!
Had the same problem for quite a while now, solution from zytzagoo fixed it for me, many thanks!
