Sort issues by audit impact

Author: matejchalk

__tests__/issues.test.ts

@@ -1,4 +1,5 @@
-import { issuesMatch } from '../src/issues'
+import { getAuditImpactValue, issuesMatch } from '../src/issues'
+import type { Report } from '../src/models'
 
 describe('issues comparison', () => {
   it('should match issues with exact same metadata', () => {
@@ -163,3 +164,111 @@ describe('issues comparison', () => {
     ).toBe(true)
   })
 })
+
+describe('issues sorting', () => {
+  it('should sum category contributions to calculate audit impact', () => {
+    expect(
+      getAuditImpactValue(
+        {
+          audit: {
+            slug: 'react-jsx-key',
+            title:
+              'Disallow missing `key` props in iterators/collection literals'
+          },
+          plugin: { slug: 'eslint', title: 'ESLint' }
+        },
+        {
+          categories: [
+            {
+              title: 'Performance',
+              // contributes 1%
+              refs: [
+                {
+                  type: 'group',
+                  plugin: 'lighthouse',
+                  slug: 'perf',
+                  weight: 99
+                },
+                {
+                  type: 'audit',
+                  plugin: 'eslint',
+                  slug: 'react-jsx-key',
+                  weight: 1
+                }
+              ]
+            },
+            {
+              title: 'Accessibility',
+              // 0 contribution
+              refs: [
+                {
+                  type: 'group',
+                  plugin: 'lighthouse',
+                  slug: 'a11y',
+                  weight: 100
+                }
+              ]
+            },
+            {
+              title: 'Code quality',
+              refs: [
+                {
+                  // group contributes 80%
+                  // audit contributes 10% in group
+                  // => audit contributes 8% in category
+                  type: 'group',
+                  plugin: 'eslint',
+                  slug: 'problems',
+                  weight: 4
+                },
+                {
+                  // 0 contribution
+                  type: 'group',
+                  plugin: 'eslint',
+                  slug: 'suggestions',
+                  weight: 1
+                }
+              ]
+            }
+          ],
+          plugins: [
+            {
+              slug: 'eslint',
+              groups: [
+                {
+                  slug: 'problems',
+                  // contributes 10%
+                  refs: [
+                    ...Array.from({ length: 9 }).map((_, i) => ({
+                      slug: `mock-rule-${i}`,
+                      weight: 1
+                    })),
+                    {
+                      slug: 'react-jsx-key',
+                      weight: 1
+                    }
+                  ]
+                },
+                {
+                  slug: 'suggestions',
+                  // 0 contribution
+                  refs: Array.from({ length: 10 }).map((_, i) => ({
+                    slug: `mock-rule-${10 + i}`,
+                    weight: 1
+                  }))
+                }
+              ]
+            },
+            {
+              slug: 'lighthouse',
+              groups: [
+                { slug: 'performance', refs: [] },
+                { slug: 'a11y', refs: [] }
+              ]
+            }
+          ]
+        } as Report
+      )
+    ).toBe(0.09) // 1% + 8% = 9%
+  })
+})

badges/coverage.svg

@@ -20,6 +20,8 @@ type IssueContext = {
   plugin: Pick<PluginMeta, 'slug' | 'title'>
 }
 
+type IssueCompareFn = (a: SourceFileIssue, b: SourceFileIssue) => number
+
 export function filterRelevantIssues({
   currReport,
   prevReport,
@@ -51,11 +53,15 @@ export function filterRelevantIssues({
     plugin.audits.flatMap(audit => getAuditIssues(audit, plugin))
   )
 
-  return issues.filter(
-    issue =>
-      isFileChanged(changedFiles, issue.source.file) &&
-      !prevIssues.some(prevIssue => issuesMatch(prevIssue, issue, changedFiles))
-  )
+  return issues
+    .filter(
+      issue =>
+        isFileChanged(changedFiles, issue.source.file) &&
+        !prevIssues.some(prevIssue =>
+          issuesMatch(prevIssue, issue, changedFiles)
+        )
+    )
+    .sort(createIssuesSortCompareFn(currReport))
 }
 
 function getAuditIssues(
@@ -138,3 +144,47 @@ function adjustedLineSpansMatch(
     curr.position.startLine
   return prevLineCount === currLineCount - currStartLineOffset
 }
+
+function createIssuesSortCompareFn(report: Report): IssueCompareFn {
+  return (a, b) =>
+    getAuditImpactValue(b, report) - getAuditImpactValue(a, report)
+}
+
+export function getAuditImpactValue(
+  { audit, plugin }: IssueContext,
+  report: Report
+): number {
+  return report.categories
+    .map((category): number => {
+      const weights = category.refs.map((ref): number => {
+        if (ref.plugin !== plugin.slug) {
+          return 0
+        }
+
+        switch (ref.type) {
+          case 'audit': {
+            return ref.slug === audit.slug ? ref.weight : 0
+          }
+
+          case 'group': {
+            const group = report.plugins
+              .find(({ slug }) => slug === ref.plugin)
+              ?.groups?.find(({ slug }) => slug === ref.slug)
+            if (!group?.refs.length) {
+              return 0
+            }
+            const groupRatio =
+              (group.refs.find(({ slug }) => slug === audit.slug)?.weight ??
+                0) / group.refs.reduce((acc, { weight }) => acc + weight, 0)
+            return ref.weight * groupRatio
+          }
+        }
+      })
+
+      return (
+        weights.reduce((acc, weight) => acc + weight, 0) /
+        category.refs.reduce((acc, { weight }) => acc + weight, 0)
+      )
+    })
+    .reduce((acc, value) => acc + value, 0)
+}