Skip to content

Instantly share code, notes, and snippets.

@Xowap Xowap/ftf.js
Created Sep 9, 2016

Embed
What would you like to do?
Find which DOM item makes your container go too big.
/*vim: fileencoding=utf8 tw=100 expandtab ts=4 sw=4 */
/*jslint indent: 4, maxlen: 100, browser: true */
/*globals console, Element*/
(function (exports) {
'use strict';
function findTheFucker(root, width, restoreAll) {
var fucker;
function isFucked() {
return root.getBoundingClientRect().width > width;
}
function plantCss() {
var style = document.getElementById('ftf-style');
if (style) {
return;
}
style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '.--ftf { display: none; position: absolute; }';
style.id = 'ftf-style';
document.querySelector('head').appendChild(style);
}
function hideItAll(node) {
if (!(node instanceof Element)) {
return;
}
node.classList.add('--ftf');
Array.prototype.forEach.call(node.childNodes, hideItAll);
}
function showItAll(node) {
if (!(node instanceof Element) || (fucker && !restoreAll)) {
return;
}
node.classList.remove('--ftf');
if (!fucker && isFucked()) {
fucker = node;
return;
}
Array.prototype.forEach.call(node.childNodes, showItAll);
}
(function () {
console.log('Who is fucking your ' + width + 'px width?', root);
if (!isFucked()) {
return console.log('Wait. It is not fucked actually.');
}
plantCss();
hideItAll(root);
showItAll(root);
if (fucker) {
console.log('Fucker found!');
console.log(fucker);
} else {
console.log('No fucker found. Did you set the width manually?');
}
}());
}
exports.ftf = findTheFucker;
}(window));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.