Chore: add a betterer test for undocumented stories (#51444) (#51545)

* add a betterer test for undocumented stories

* update results

* Update .betterer.ts

Co-authored-by: Levente Balogh <balogh.levente.hu@gmail.com>

* update results

* prettier

* slightly nicer regexp

Co-authored-by: Levente Balogh <balogh.levente.hu@gmail.com>
(cherry picked from commit 688164bbd6)

Co-authored-by: Ashley Harrison <ashley.harrison@grafana.com>

.betterer.results

@@ -12786,3 +12786,86 @@ exports[`better eslint`] = {
     ]
   }`
 };
+
+exports[`no undocumented stories`] = {
+  value: `{
+    "packages/grafana-ui/src/components/Button/ToolbarButton.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a ToolbarButton.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/ButtonCascader/ButtonCascader.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a ButtonCascader.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/ColorPicker/ColorPickerPopover.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a ColorPickerPopover.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/ColorPicker/NamedColorsPalette.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a NamedColorsPalette.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/ColorPicker/SpectrumPalette.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a SpectrumPalette.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a RelativeTimeRangePicker.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/DateTimePickers/TimeOfDayPicker.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a TimeOfDayPicker.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a TimeRangePicker.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/DateTimePickers/TimeZonePicker.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a TimeZonePicker.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/DateTimePickers/WeekStartPicker.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a WeekStartPicker.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/PageLayout/PageToolbar.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a PageToolbar.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/PanelChrome/PanelChrome.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a PanelChrome.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/PluginSignatureBadge/PluginSignatureBadge.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a PluginSignatureBadge.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/QueryField/QueryField.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a QueryField.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/RefreshPicker/RefreshPicker.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a RefreshPicker.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/SecretInput/SecretInput.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a SecretInput.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/Segment/Segment.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a Segment.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/Segment/SegmentAsync.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a SegmentAsync.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/Segment/SegmentInput.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a SegmentInput.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/StatsPicker/StatsPicker.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a StatsPicker.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/Tabs/Tabs.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a Tabs.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/ThemeDemos/ThemeDemo.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a ThemeDemo.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/Typography/Typography.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a Typography.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/VizLayout/VizLayout.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a VizLayout.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/VizLegend/VizLegend.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a VizLegend.mdx with some documentation.", "5381"]
+    ],
+    "packages/grafana-ui/src/components/VizTooltip/SeriesTable.story.tsx:5381": [
+      [0, 0, 0, "No undocumented stories are allowed, please add a SeriesTable.mdx with some documentation.", "5381"]
+    ]
+  }`
+};

.betterer.ts

@@ -1,5 +1,6 @@
 import { regexp } from '@betterer/regexp';
 import { eslint } from '@betterer/eslint';
+import { BettererFileTest } from '@betterer/betterer';
 
 export default {
   'no enzyme tests': () => regexp(/from 'enzyme'/g).include('**/*.test.*'),
@@ -13,4 +14,27 @@ export default {
         },
       ],
     }).include('**/*.{ts,tsx}'),
+  'no undocumented stories': () => countUndocumentedStories().include('**/*.{story.tsx,mdx}'),
 };
+
+function countUndocumentedStories() {
+  return new BettererFileTest(async (filePaths, fileTestResult) => {
+    const storyFilePaths = filePaths.filter((filePath) => filePath.endsWith('story.tsx'));
+    const mdxFilePaths = filePaths.filter((filePath) => filePath.endsWith('mdx'));
+    storyFilePaths.forEach((filePath) => {
+      if (!mdxFilePaths.includes(filePath.replace(/\.story.tsx$/, '.mdx'))) {
+        // In this case the file contents don't matter:
+        const file = fileTestResult.addFile(filePath, '');
+        // Add the issue to the first character of the file:
+        file.addIssue(
+          0,
+          0,
+          `No undocumented stories are allowed, please add a ${filePath.replace(
+            /^(.*\/)(\w+)\.story\.tsx$/,
+            '$2.mdx'
+          )} with some documentation.`
+        );
+      }
+    });
+  });
+}

scripts/ci-frontend-metrics.sh

@@ -5,8 +5,6 @@ ERROR_COUNT="0"
 ACCESSIBILITY_ERRORS="$(grep -oP '\"errors\":(\d+),' pa11y-ci-results.json | grep -oP '\d+')"
 DIRECTIVES="$(grep -r -o  directive public/app/ | wc -l)"
 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
@@ -28,8 +26,6 @@ echo -e "Typescript errors: $ERROR_COUNT"
 echo -e "Accessibility errors: $ACCESSIBILITY_ERRORS"
 echo -e "Directives: $DIRECTIVES"
 echo -e "Controllers: $CONTROLLERS"
-echo -e "Stories: $STORIES_COUNT"
-echo -e "Documented stories: $MDX_COUNT"
 echo -e "Legacy forms: $LEGACY_FORMS"
 echo -e "TS Explicit any: $STRICT_LINT_EXPLICIT_ANY"
 echo -e "Total bundle folder size: $TOTAL_BUNDLE"
@@ -53,8 +49,6 @@ echo "Metrics: {
   \"grafana.ci-code.accessibilityErrors\": \"${ACCESSIBILITY_ERRORS}\",
   \"grafana.ci-code.directives\": \"${DIRECTIVES}\",
   \"grafana.ci-code.controllers\": \"${CONTROLLERS}\",
-  \"grafana.ci-code.grafana-ui.stories\": \"${STORIES_COUNT}\",
-  \"grafana.ci-code.grafana-ui.mdx\": \"${MDX_COUNT}\",
   \"grafana.ci-code.legacyForms\": \"${LEGACY_FORMS}\",
   \"grafana.ci-code.strictLint.noExplicitAny\": \"${STRICT_LINT_EXPLICIT_ANY}\",
   \"grafana.ci-code.bundleFolderSize\": \"${TOTAL_BUNDLE}\",