chrome element inspector css diff.js

// original: https://github.com/kdzwinel/CSS-Diff
// @jakedowns 2.4.21: edited to print to a table

//Chrome keeps elements you select via 'inspect element' button in variables. 
//Last selected element in $0, one before that in $1 etc. 
//Basing on this, I've created a small snippet that compares last two inspected elements:

(function(a,b){    
    var aComputed = getComputedStyle(a);
    var bComputed = getComputedStyle(b);

    console.log('------------------------------------------');
    console.log('You are comparing: ');
    console.log('A:', a);
    console.log('B:', b);
    console.log('------------------------------------------');

    let tableData = [];

    for(var aname in aComputed) {
        var avalue = aComputed[aname];
        var bvalue = bComputed[aname];

        if( aname === 'length' || aname === 'cssText' || typeof avalue === "function" ) {
            continue;
        }

        if( avalue !== bvalue ) {
            //console.warn('Attribute ' + aname + ' differs: ');
            //console.log('A:', avalue);
            //console.log('B:', bvalue);
	    tableData.push({attribute:aname,a:avalue,b:bvalue});
        }
    }
    console.table(tableData,['attribute','a','b'])

    console.log('------------------------------------------');
})($0,$1);