How to use the @lhci/utils/src/audit-diff-finder.getDiffLabel function in @lhci/utils

To help you get started, we’ve selected a few @lhci/utils examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github GoogleChrome / lighthouse-ci / packages / server / src / ui / components / gauge.jsx View on Github external
export const Gauge = props => {
  const score = Math.round(props.score * 100);
  const rawBaseScore = props.diff ? props.diff.baseValue : props.score;
  const baseScore = Math.round(rawBaseScore * 100);
  const label = props.diff ? getDiffLabel(props.diff) : 'neutral';

  // 352 is ~= 2 * Math.PI * gauge radius (56)
  // https://codepen.io/xgad/post/svg-radial-progress-meters
  // score of 50: `stroke-dasharray: 176 352`;
  // The roundcap on the arc makes it extend slightly past where it should, so we need to adjust it by a few pts.
  const baseDasharrayScore = Math.max(0, props.score * 352 - 2);
  const baseStrokeDasharray = `${baseDasharrayScore} 352`;
  const delta = Math.abs(baseScore - score);
  const deltaDasharrayScore = Math.max(0, (delta / 100) * 352 - 2);
  const deltaStrokeDasharray = `${deltaDasharrayScore} 352`;
  const deltaTransform = `rotate(${(Math.min(score, baseScore) / 100) * 360}deg)`;
  const indicatorTransform = `rotate(${props.score * 360}deg)`;

  return (
    <div>
      <div></div></div>
github GoogleChrome / lighthouse-ci / packages / server / src / ui / routes / build-view / build-score-comparison.jsx View on Github external
/** @type {LHCI.NumericAuditDiff|undefined} */
  let diff = undefined;

  if (baseLhr) {
    const baseCategory = baseLhr.categories[categoryId];
    if (baseCategory) {
      diff = {
        auditId: '',
        type: 'score',
        baseValue: baseCategory.score,
        compareValue: category.score,
      };

      const delta = renderScore(category.score - baseCategory.score);

      classes = `build-score-comparison-item--${getDiffLabel(diff)}`;

      deltaEl = (
        <div>
          {delta &lt; 0 ? delta : `+${delta}`}
        </div>
      );
    }
  }

  return (
    <div>
      
      <div>{category.title}</div>
      {deltaEl}
    </div>
  );
github GoogleChrome / lighthouse-ci / packages / server / src / ui / routes / build-view / audit-detail / audit-detail.jsx View on Github external
const ScoreOnlyDetails = props =&gt; {
  const {audit, baseAudit} = props.pair;
  if (!baseAudit) return null;

  return (
    <div>
      
      <i>
        arrow_forward
      </i>
      
    </div>
  );
};