Facebook Cookbook

A Rose by Any Other Name: Forced Renaming

Problem

Facebook keeps renaming all of the ids in my HTML.

Solution

It’s cool! Relax, man. You’re in the Sandbox! The Sandbox is groovy.

No, seriously. The Sandbox is just doing its job, protecting the forces of good (namely, you) from the evil demon know as namespace clash. Sandboxes in the computer science sense are a security mechanism for safely running programs in a contained space, preventing them from having access to things outside the box. Think about it this way: picture a situation in which you’ve given a div in your page the id “supercalifragilicious,” and by some unthinkably remote chance, that happened to be the same id that Facebook had given to one of their divs. Aside from the invalid XHTML that would cause (ids have to be unique in a page), how would your CSS or JavaScript know which one to work with? To get around this situation, the Facebook Sandbox goes through your code and replaces things like:

<div id="supercalifragilicious">

with:

<div id="app12345_supercalifragilicious">

where 12345 is your app’s ID. This is known as creating a “namespace,” which Wikipedia defines as:

In general, a namespace is an abstract container providing context for the items (names, or technical terms, or words) it holds and allowing disambiguation of items having the same name (residing in different namespaces).^[8]

Discussion

The end result is that your application should be basically unaffected. The Sandbox is smart enough to also rename any occurrences ...