Chore: Report betterer stats in ci-frontend-metrics (#47210)

* Chore: Report betterer stats to graphite

* PR feedback

* use camelCase from lodash instead

package.json

@@ -54,7 +54,8 @@
     "i18n:extract": "lingui extract",
     "i18n:compile": "lingui compile",
     "postinstall": "husky install",
-    "betterer": "betterer"
+    "betterer": "betterer",
+    "betterer:stats": "ts-node --transpile-only --project ./scripts/cli/tsconfig.json ./scripts/cli/reportBettererStats.ts"
   },
   "grafana": {
     "whatsNewUrl": "https://grafana.com/docs/grafana/next/whatsnew/whats-new-in-v8-4/",
@@ -86,6 +87,7 @@
     "@babel/preset-env": "7.16.11",
     "@babel/preset-react": "7.16.7",
     "@babel/preset-typescript": "7.16.7",
+    "@betterer/betterer": "5.1.7",
     "@betterer/cli": "5.1.7",
     "@betterer/regexp": "5.1.7",
     "@emotion/eslint-plugin": "11.7.0",

scripts/ci-frontend-metrics.sh

@@ -8,6 +8,8 @@ CONTROLLERS="$(grep -r -oP 'class .*Ctrl' public/app/ | wc -l)"
 STORIES_COUNT="$(find ./packages/grafana-ui/src/components -name "*.story.tsx" | wc -l)"
 MDX_COUNT="$(find ./packages/grafana-ui/src/components -name "*.mdx" | wc -l)"
 LEGACY_FORMS="$(grep -r -oP 'LegacyForms;' public/app | wc -l)"
+
+# This is also included in the betterer stats, but we maintain it to keep metric history
 ENZYME_TEST_COUNT="$(grep -l -R --include="*.test.*" "from 'enzyme'" public packages | wc -l)"
 
 STRICT_LINT_RESULTS="$(yarn run eslint --rule '@typescript-eslint/no-explicit-any: ["error"]' --format unix --ext .ts,.tsx ./public || true)"
@@ -38,7 +40,15 @@ echo -e "High vulnerabilities: $HIGH_VULNERABILITIES"
 echo -e "Critical vulnerabilities: $CRITICAL_VULNERABILITIES"
 echo -e "Number of enzyme tests: $ENZYME_TEST_COUNT"
 
+BETTERER_STATS=""
+while read -r name value
+do
+  BETTERER_STATS+=$'\n  '
+  BETTERER_STATS+="\"grafana.ci-code.betterer.${name}\": \"${value}\","
+done <<< "$(yarn betterer:stats)"
+
 echo "Metrics: {
+  $BETTERER_STATS
   \"grafana.ci-code.strictErrors\": \"${ERROR_COUNT}\",
   \"grafana.ci-code.accessibilityErrors\": \"${ACCESSIBILITY_ERRORS}\",
   \"grafana.ci-code.directives\": \"${DIRECTIVES}\",

scripts/cli/reportBettererStats.ts

@@ -0,0 +1,21 @@
+import { betterer } from '@betterer/betterer';
+import { camelCase } from 'lodash';
+
+function logStat(name: string, value: number) {
+  // Note that this output format must match the parsing in ci-frontend-metrics.sh
+  // which expects the two values to be separated by a space
+  console.log(`${name} ${value}`);
+}
+
+async function main() {
+  const results = await betterer.results();
+
+  for (const testResults of results.resultSummaries) {
+    const name = camelCase(testResults.name);
+    const count = Object.values(testResults.details).flatMap((v) => v).length;
+
+    logStat(name, count);
+  }
+}
+
+main().catch(console.error);

yarn.lock

@@ -3239,7 +3239,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@betterer/betterer@npm:^5.1.7":
+"@betterer/betterer@npm:5.1.7, @betterer/betterer@npm:^5.1.7":
   version: 5.1.7
   resolution: "@betterer/betterer@npm:5.1.7"
   dependencies:
@@ -20425,6 +20425,7 @@ __metadata:
     "@babel/preset-env": 7.16.11
     "@babel/preset-react": 7.16.7
     "@babel/preset-typescript": 7.16.7
+    "@betterer/betterer": 5.1.7
     "@betterer/cli": 5.1.7
     "@betterer/regexp": 5.1.7
     "@emotion/css": 11.7.1