Nutshell: FB JS code was inadvertently included twice (not by me, which always makes things more difficult). This caused the app_id and app_key values in the FB.ui call to go away--everything else was there, but two pieces critical (obviously) weren't. Note that the app code didn't explicitly do any initializations twice, the act of including the code twice was enough.
We ended up doing the FB share a different way due to time pressures, but before we did, we had multiple people looking at the app trying to figure out what was wrong. In retrospect, I think I should have diagnosed the problem a day earlier than I did, and there's a couple of reasons why.
The most obvious dumb thing was that I didn't look at the wire traffic and pick apart the FB.ui call's URLs. That was ignorance; this was the first FB issue I've ever tried to diagnose--I had no clue where to look. That step, however, ended up pointing me in the right direction (eventually).
I also should have created a blank sample app earlier, as a sanity check. This was partially inertia, partially time constraints, partially wasn't sure how easy/difficult it was to do, partially a belief that the FB pros would be able to figure it out, so I did other stuff and waited--didn't need to.
Once I had the working app, compared the generated URLs, things progressed rapidly. First I made the blank app structurally similar to the broken app: put the JS code into a partial (it's a Rails app), cut-and-pasted the init code, etc. I ignored styling--I made an assumption it was a JS issue fairly early on, and pursued that path first.
The blank app continued to work, so I switched my attention to the broken app, and stripped out everything except the FB code. Workie workie... made some additional guesses, started poking through the partials, and found a partial with two issues--a repeated div id used by the init code, and an include of the FB JS file.
I don't actually know if it was the include or the div id: the FB JS code is inserted dynamically as a div's child element--a div with the id that was repeated :/ Either way, it was broken HTML, and broken JS.
Here's what bothers me about this exercise: multiple people looked at this and couldn't figure it out. Identical code worked in other apps (we knew (or at least "thought strongly") it was something app-specific), the docs made it seem like what I was trying should work. It should have been easier to diagnose.
Code that fails sans clueage is a pain. Disallowing multiple loads of the same JS is easy, and it would have saved a few people a frustrating amount of time diagnosing what ended up being ridiculously easy, and (somewhat) obvious.
Wrong code should either be impossible, or act very wrong, not just somewhat, and quietly, wrong. That notion reminded me of an old Spolsky article which is tangentially related, but speaks to making things that are broken break in such a way it's obvious: fail fast.
No comments:
Post a Comment