Comments (4)
You're right that there's a problem with the current solution if you use jquery.turbolinks. But I run into errors (like the one you mentioned) when I move the document binding outside of page ready. How exactly did you change the solution to where you weren't seeing any errors?
What if we implemented something like this?
fb_events_bound = false
$ ->
loadFacebookSDK()
bindFacebookEvents() unless fb_events_bound
bindFacebookEvents = ->
$(document)
.on('page:fetch', saveFacebookRoot)
.on('page:change', restoreFacebookRoot)
.on('page:load', ->
FB?.XFBML.parse()
)
fb_events_bound = true
That seemed to work for me, with or without jquery.turbolinks. Does it work for you?
from turbolinks-compatibility.
Just realized that I forgot to paste my workaround. I think what we did was similar in that they both bind the document event once.
Your's will check if it is already binded already each time, whereas mine only binds on first load.
fb_root = null
saveFacebookRoot = ->
fb_root = $('#fb-root').detach()
restoreFacebookRoot = ->
if $('#fb-root').length > 0
$('#fb-root').replaceWith fb_root
else
$('body').append fb_root
loadFacebookSDK = ->
window.fbAsyncInit = initializeFacebookSDK
$.getScript("//connect.facebook.net/en_US/all.js#xfbml=1")
initializeFacebookSDK = ->
FB.init
appId : 'APP_ID'
channelUrl: '//WWW.YOUR_DOMAIN.COM/channel.html'
status : true
cookie : true
xfbml : true
loadFacebookSDK()
$(document)
.on('page:fetch', saveFacebookRoot)
.on('page:change', restoreFacebookRoot)
.on('page:load', ->
FB?.XFBML.parse()
)
Did some testing with both of our code. The Unsafe JavaScript attempt to access frame with URL
error seem to turn up once in a while, regardless of document binding or using jquery.turbolinks
or not. It might be a bug from facebook itself or a bug between facebook and turbolinks.
The problem with the old compatibility fix is that it will keep triggering the error in an infinite loop, I suspect it has to do with race condition of turbolinks load events.
Good news is, both of our solutions seem to prevent the error from entering an infinite loop!
from turbolinks-compatibility.
Alright, I updated the solution. I went with my code just because I like to avoid executing JS before page ready whenever I can. Thanks for bringing this issue to my attention, and for helping me resolve it.
from turbolinks-compatibility.
No problem! Glad was of help :)
Sent from my iPhone
On Feb 24, 2013, at 7:24 PM, Nick Reed [email protected] wrote:
Alright, I updated the solution. I went with my code just because I like to
avoid executing JS before page ready whenever I can. Thanks for bringing
this issue to my attention, and for helping me resolve it.
—
Reply to this email directly or view it on
GitHubhttps://github.com//issues/3#issuecomment-14024026.
from turbolinks-compatibility.
Related Issues (20)
- Turbolinks not working with google ads or LiveHelpNow
- Google Tag Manager HOT 5
- Facebook like/share button still disappearing HOT 1
- Marketo munchkin tracker integration request
- Integration with Google TagManager HOT 4
- Happyfox Chat loading problem after language change HOT 4
- Can't find a way to change Facebook language HOT 1
- Loading Javascripts Problem HOT 1
- React Native HOT 1
- Turbolinks 5 compatibility HOT 8
- Should the solutions propose both coffee script and standart js version?
- Segment.com HOT 1
- Olark Hummingbird theme
- New Sharethis implementation and Turbolinks' incompatibility HOT 3
- owlCarousel not Loaded
- Zendesk old and new tab displayed HOT 2
- Turbolink 5 and Google DFP not working
- LiveZilla Compatability
- Using the Freshdesk/Freshdesk Widget with Turbolinks HOT 4
- SaleForce Widget with turbolinks
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from turbolinks-compatibility.