background, border-style color not included when print

[dikitaurensia]

hi Bchir, I have an issue, background-color, border-style not included when I print. I used print component, this my component :

const Preview = ({svgRender}) => {
    let sizePaper = svgRender.sizePaper

    if(sizePaper===undefined){
        sizePaper={}
    }

    Object.size = function(obj) {
        var size = 0, key;
        for (key in obj) {
            if (obj.hasOwnProperty(key)) size++;
        }
        return size;
    };

    var size = Object.size(svgRender.objectsByHash);
    let objectsByHash = size>0?Object.values(svgRender.objectsByHash):[]      
    var count = [...Array(sizePaper.detailCount?sizePaper.detailCount:0).keys()]

    let background ={}    
    svgRender.usedBackground===true?background={backgroundImage: `url(${sampleInvoice})`, backgroundSize:"100% 100%"}:background={}

    return (        
         <div style={{position: "relative", backgroundColor:"white", height:sizePaper.height+"mm", width:sizePaper.width+"mm", ...background  }}>         
            {
                objectsByHash.map((item) => { 
                    let text = contentSystem(item.text)
                    return (item.table.name!=="TextOnly" && item.table.fieldname==="") || item.table.name==="TextOnly" ?
                        <div style={{position:"absolute", backgroundColor:item.fill, width:item.width+"px",height:item.height+"px", left:(item.x+sizePaper.LeftMargin)+"px", top:(item.y+sizePaper.TopMargin)+"px", textAlign: item.textProps.textAlign, borderStyle:item.frame.top+" "+item.frame.right+" "+item.frame.bottom+" "+item.frame.left, borderWidth:"thin"}}>{item.text==="logo"?<img src={logo} width={item.width+"px"} height={item.height+"px"} alt="logo"/> :text}</div>
                    :
                        <div>
                            <div style={{position:"absolute", backgroundColor:item.fill, width:item.width+"px",height:item.height+"px", left:(item.x+sizePaper.LeftMargin)+"px", top:(item.y+sizePaper.TopMargin)+"px", textAlign: item.textProps.textAlign, borderStyle:item.frame.top+" "+item.frame.right+" "+item.frame.bottom+" "+item.frame.left, borderWidth:"thin"}}>
                                {text==="logo"?<img src={logo} width={item.width+"px"} height={item.height+"px"} alt="logo"/> :text}
                            </div> 

                            {                               
                                count.map((index) =>{
                                    return <div style={{position:"absolute",backgroundColor:item.filldetail , width:item.width+"px",height:item.height+"px", left:(item.x+sizePaper.LeftMargin)+"px", top:(item.y+sizePaper.TopMargin)+(item.height*(index+1))+"px", textAlign: item.textPropsdetail.textAlign , borderStyle:item.framedetail.top+" "+item.framedetail.right+" "+item.framedetail.bottom+" "+item.framedetail.left, borderWidth:"thin"}}>
                                                {"Sample Text ("+item.table.fieldname+")"}
                                            </div> 
                                })                                   
                            }
                        </div>                       
                })
            }
        </div>
    )
}

[Bchir]

Hello @heehoo14 , This might be related to a latency between rendering and style application, a created a branch with delay 200 ms before printing can you test it, so i could publish a new version for it ? Thanks in advance