View elem-class-toggle.js
var elem = document.querySelector('.some-important-element');
var bool = false;
elem.classList.toggle('class-I-want-to-add-or-remove', bool);
View CSS Font-Size Units
1em (variable) = 12pt (fixed) = 16px (fixed) = 100% (variable)
View addTrackedListener.js
// Link:
function addTrackedListener(element, type, handler) {
if (!element.trackedEvents) {
element.trackedEvents = {};
if (!element.trackedEvents[type]) {
element.trackedEvents[type] = [];
View xmltojson.html
<!DOCTYPE html>
<meta charset="utf-8">
<input type="file" id="xmldoc" accept=".xml" />

Better Jasmine Tests With this

On the Refinery29 Mobile Web Team, codenamed "Bicycle", all of our unit tests are written using Jasmine, an awesome BDD library written by Pivotal Labs. We recently switched how we set up data for tests from declaring and assigning to closures, to assigning properties to each test case's this object, and we've seen some awesome benefits from doing such.

The old way

Up until recently, a typical unit test for us looked something like this:

describe('views.Card', function() {
View ajax.js
// Define our own ajax method which uses XMLHttpRequest to fetch data from our Node.js app and
function ajax(url, method, callback, data, header) {
try {
var req = new(XMLHttpRequest || ActiveXObject)('MSXML2.XMLHTTP.3.0'); // Does XMLHttpRequest exist? If not, it's probably an older version of Internet Explorer, url, true); // the method is either GET or POST in our case, the url which we want to call to get data from and TRUE to make it an asynchronous request
if (header) {
req.setRequestHeader("Content-type", header); // Set a custom header
req.onreadystatechange = function () {
req.readyState > 3 && callback && callback(req.responseText, req); // When the response comes back call the callback function
View image-not-loaded.js
// From: &
function testImage(url, callback, timeout) {
timeout = timeout || 5000;
var timedOut = false, timer;
var img = new Image();
img.onerror = img.onabort = function() {
if (!timedOut) {
callback(url, "error");
View ajax.js
* IE 5.5+, Firefox, Opera, Chrome, Safari XHR object
* @param string url
* @param object callback
* @param mixed data
* @param null x
function ajax(url, callback, data, x) {
try {
View toggle-and-init-menu.js
var menuVisible = false;
// Can be used with the components manager. If so, uncomment out the lines below to add & remove event listeners
function initMenu() {
if (document.querySelector(menu)) {
if (menuVisible) {
// app.components.addListeners();
document.querySelector(menu).style.display = block;
} else {
// app.components.removeListeners();