JSFiddle - React, Tailwind, and code Playground

HTML

<div class="compoundtransform" data-transformations="scaletrans2, rotatetrans1">Test subject</div>

CSS

div { position: relative; top: 300px; width: 100px; height: 100px;}
.rotatetrans1 {
    -webkit-transform: rotate(90deg) translate(6px,1px);
}
.scaletrans2 {
    -webkit-transform: scale(0.25,0.25);
}

JavaScript

function getCSSRulesForClass( selector ) {
    var sheets = document.styleSheets;
    var cssRules = [];
    for (var i = 0; i<sheets.length; ++i) {
        var sheet = sheets[i];
        if( !sheet.cssRules ) { continue; }
        for (var j = 0; j < sheet.cssRules.length; ++j ) {
            var rule = sheet.cssRules[j];
            if (rule.selectorText && rule.selectorText.split(',').indexOf(selector) !== -1) {
                var styles = rule.style;
                for( var k = 0; k<styles.length; ++k ) {
                    var style = styles[k];
                    cssRules.push( { 
                        property: style,
                        value: styles[style]
                    } );
                }
            }
        }
    }
    return cssRules;
}

var allTransformedNodes = document.querySelectorAll(".compoundtransform"),
    transformedNode,
    startingStateCSS,
    startingState,
    transformationSelectors,
    transformationSelector;

for( var i=0; i<allTransformedNodes.length; ++i ) {
    transformedNode = allTransformedNodes[i];

    startingStateCSS = getComputedStyle( transformedNode )["webkitTransform" ];
    startingState = ( startingStateCSS === "none" ) ?
        { a: 1.0, b: 0.0, c: 0.0, d: 1.0, tx: 0.0, ty: 0.0 } :
        cssMatrixToObject( startingStateCSS );

    transformationSelectors = transformedNode.getAttribute("data-transformations").replace(/\s/g, "").split(",");

    for( var j=0; j<transformationSelectors.length; ++j ) {
        transformationSelector = transformationSelectors[j];
        startingState = addTransform( transformedNode, startingState, "." + transformationSelector );
    }
}

function addTransform( transformedNode, startingState, transformationClass ) {                
    var transformationRules = getCSSRulesForClass( transformationClass );
    for( var i = 0; i<transformationRules.length; ++i ) {
        var rule = transformationRules[i];
        if( rule.property === "-webkit-transform" ) {
      ...