function createDOMStylesRestorable() {
    const restorable = createObjectRestorable();
    return {
        ...restorable,
        // Track method calls
        invoke (targetStyles, fnName, targetfn, args) {
            switch (fnName) {
                // For setProperty() the undo is to reset CSS property to original state
                case 'setProperty': {
                    const [ name ] = args;
                    // NOTE: same key object property assignment, because for CSS styles
                    // object, property can be set either through dot-notation or by
                    // invoking setProperty() - they are equivalent!
                    const key = `prop:${name}`;
                    restorable.once(key, () => {
                        const oldVal = targetStyles.getPropertyValue(name);
                        const oldPriority = targetStyles.getPropertyPriority(name);
                        return restorable.pushUndo(() => targetStyles.setProperty(name, oldVal, oldPriority));    
                    });
                    break;
                }
                // For removeProperty() the undo is to restore CSS property to original state
                case 'removeProperty': {
                    const [ name ] = args;
                    const key = `prop:${name}`;
                    restorable.once(key, () => {
                        const oldVal = targetStyles.getPropertyValue(name);
                        const oldPriority = targetStyles.getPropertyPriority(name);
                        return restorable.pushUndo(() => targetStyles.setProperty(name, oldVal, oldPriority));    
                    });
                    break;
                }
            }
            // Perform actual method invocation
            return targetfn.apply(targetStyles, args);
        },
    };
}
/**
 * Creates a Restorable which can track DOM CSSStyleDeclaration modifications.
 * Tracks methods that it knows how to undo (e.g. setProperty.
 * 
 * @returns {DOMStylesRestorable}
 */
Creates a Restorable which can track DOM CSSStyleDeclaration modifications.
Tracks methods that it knows how to undo (e.g. setProperty.


Creates a Restorable which can track DOM CSSStyleDeclaration modifications . Tracks methods that it knows how to undo ( e . g . setProperty .
function createDOMStylesRestorable() {
    const restorable = createObjectRestorable();
    return {
        ...restorable,
        invoke (targetStyles, fnName, targetfn, args) {
            switch (fnName) {
                case 'setProperty': {
                    const [ name ] = args;
                    const key = `prop:${name}`;
                    restorable.once(key, () => {
                        const oldVal = targetStyles.getPropertyValue(name);
                        const oldPriority = targetStyles.getPropertyPriority(name);
                        return restorable.pushUndo(() => targetStyles.setProperty(name, oldVal, oldPriority));    
                    });
                    break;
                }
                case 'removeProperty': {
                    const [ name ] = args;
                    const key = `prop:${name}`;
                    restorable.once(key, () => {
                        const oldVal = targetStyles.getPropertyValue(name);
                        const oldPriority = targetStyles.getPropertyPriority(name);
                        return restorable.pushUndo(() => targetStyles.setProperty(name, oldVal, oldPriority));    
                    });
                    break;
                }
            }
            return targetfn.apply(targetStyles, args);
        },
    };
}
function createDOMStylesRestorable ( ) { const restorable = createObjectRestorable ( ) ; return { ... restorable , invoke ( targetStyles , fnName , targetfn , args ) { switch ( fnName ) { case 'setProperty' : { const [ name ] = args ; const key = ` ${ name } ` ; restorable . once ( key , ( ) => { const oldVal = targetStyles . getPropertyValue ( name ) ; const oldPriority = targetStyles . getPropertyPriority ( name ) ; return restorable . pushUndo ( ( ) => targetStyles . setProperty ( name , oldVal , oldPriority ) ) ; } ) ; break ; } case 'removeProperty' : { const [ name ] = args ; const key = ` ${ name } ` ; restorable . once ( key , ( ) => { const oldVal = targetStyles . getPropertyValue ( name ) ; const oldPriority = targetStyles . getPropertyPriority ( name ) ; return restorable . pushUndo ( ( ) => targetStyles . setProperty ( name , oldVal , oldPriority ) ) ; } ) ; break ; } } return targetfn . apply ( targetStyles , args ) ; } , } ; }
Creates a Restorable which can track DOM CSSStyleDeclaration modifications.
Creates a Restorable which can track DOM CSSStyleDeclaration modifications .
// Track method calls // For setProperty() the undo is to reset CSS property to original state // NOTE: same key object property assignment, because for CSS styles // object, property can be set either through dot-notation or by // invoking setProperty() - they are equivalent! // For removeProperty() the undo is to restore CSS property to original state // Perform actual method invocation