@stencil/core
Version:
A Compiler for Web Components and Progressive Web Apps
1 lines • 2.15 kB
JavaScript
import{r as l,d as t,h as i}from"./p-c001178f.js";class d{constructor(i){l(this,i),this.mismatchedPixels=null,this.diffNavChange=t(this,"diffNavChange",7)}navToDiff(l){l.preventDefault(),l.stopPropagation(),this.diffNavChange.emit(this.diff.id)}render(){const l=this.diff,t="number"==typeof this.mismatchedPixels,d=t?this.mismatchedPixels/(l.width*l.deviceScaleFactor*(l.height*l.deviceScaleFactor)):null;let e="";t?this.mismatchedPixels>0&&(e="has-mismatch"):e="not-calculated";const s=l.testPath.split("/");s.pop();const a=s.join("/");return[i("p",{class:"test-path"},l.testPath),i("dl",null,i("div",null,i("dt",null,"Diff"),i("dd",null,i("a",{href:"#diff-"+l.id,onClick:this.navToDiff.bind(this)},l.id))),l.comparable?[i("div",{class:e},i("dt",null,"Mismatched Pixels"),i("dd",null,t?this.mismatchedPixels:"--")),i("div",{class:e},i("dt",null,"Mismatched Ratio"),i("dd",null,t?d.toFixed(4):"--"))]:null,i("div",null,i("dt",null,"Device"),i("dd",null,l.device)),i("div",null,i("dt",null,"Width"),i("dd",null,l.width)),i("div",null,i("dt",null,"Height"),i("dd",null,l.height)),i("div",null,i("dt",null,"Device Scale Factor"),i("dd",null,l.deviceScaleFactor)),l.imageA?i("div",null,i("dt",null,"Left Preview"),i("dd",null,i("a",{href:`/data/tests/${this.aId}/${a}/`,target:"_blank"},"HTML"))):null,l.imageB?i("div",null,i("dt",null,"Right Preview"),i("dd",null,i("a",{href:`/data/tests/${this.bId}/${a}/`,target:"_blank"},"HTML"))):null,i("div",{class:"desc"},i("dt",null,"Description"),i("dd",null,l.desc)))]}static get style(){return".test-path{margin-top:0;padding-top:0;font-size:10px;color:var(--analysis-data-color)}dl{padding:0;margin:0;font-size:var(--analysis-data-font-size);line-height:28px}div{display:-ms-flexbox;display:flex;width:260px}dt{-ms-flex:2;flex:2;font-weight:500}dd,dt{display:inline}dd{-ms-flex:1;flex:1;color:var(--analysis-data-color)}.desc,.desc dd,.desc dt{display:block}.desc dd{margin:0;line-height:22px}.not-calculated dd{color:#ccc}.has-mismatch dd{color:#ff6200}p{padding-top:14px;font-size:var(--analysis-data-font-size)}a{color:var(--analysis-data-color)}a:hover{text-decoration:none}"}}export{d as compare_analysis};