ref(ui): Add missing test types (#82579)

static/app/actionCreators/pageFilters.spec.tsx

@@ -32,7 +32,7 @@ describe('PageFilters ActionCreators', function () {
   });
 
   describe('initializeUrlState', function () {
-    let router;
+    let router: ReturnType<typeof RouterFixture>;
     const key = `global-selection:${organization.slug}`;
 
     beforeEach(() => {

static/app/components/autoComplete.spec.tsx

@@ -23,7 +23,7 @@ const items = [
  * "controlled" props where <AutoComplete> does not handle state
  */
 describe('AutoComplete', function () {
-  let input;
+  let input: HTMLInputElement;
   let autoCompleteState: any[] = [];
   const mocks = {
     onSelect: jest.fn(),
@@ -36,12 +36,30 @@ describe('AutoComplete', function () {
     autoCompleteState = [];
   });
 
-  function List({registerItemCount, itemCount, ...props}) {
+  function List({
+    registerItemCount,
+    itemCount,
+    ...props
+  }: {
+    children: React.ReactNode;
+    itemCount: number;
+    registerItemCount: (count?: number) => void;
+  }) {
     useEffect(() => void registerItemCount(itemCount), [itemCount, registerItemCount]);
     return <ul {...props} />;
   }
 
-  function Item({registerVisibleItem, item, index, ...props}) {
+  function Item({
+    registerVisibleItem,
+    item,
+    index,
+    ...props
+  }: {
+    children: React.ReactNode;
+    index: number;
+    item: {name?: string};
+    registerVisibleItem: (index: number, item: any) => () => void;
+  }) {
     useEffect(() => registerVisibleItem(index, item), [registerVisibleItem, index, item]);
     return <li {...props} />;
   }

static/app/components/charts/components/xAxis.spec.tsx

@@ -9,8 +9,8 @@ jest.mock('moment-timezone', () => {
 });
 
 describe('Chart XAxis', function () {
-  let axisLabelFormatter;
-  let xAxisObj;
+  let axisLabelFormatter: (value: string | number, index: number) => string;
+  let xAxisObj!: ReturnType<typeof XAxis>;
   const props: XAxisProps = {
     isGroupedByDate: true,
     theme: lightTheme,
@@ -27,7 +27,8 @@ describe('Chart XAxis', function () {
             utc: false,
           });
 
-          axisLabelFormatter = xAxisObj.axisLabel.formatter;
+          // @ts-expect-error formatter type is missing
+          axisLabelFormatter = xAxisObj.axisLabel!.formatter;
         });
 
         it('formats axis label for first data point', function () {
@@ -47,7 +48,8 @@ describe('Chart XAxis', function () {
             utc: true,
           });
 
-          axisLabelFormatter = xAxisObj.axisLabel.formatter;
+          // @ts-expect-error formatter type is missing
+          axisLabelFormatter = xAxisObj.axisLabel!.formatter;
         });
 
         it('formats axis label for first data point', function () {
@@ -67,7 +69,8 @@ describe('Chart XAxis', function () {
             period: '7d',
           });
 
-          axisLabelFormatter = xAxisObj.axisLabel.formatter;
+          // @ts-expect-error formatter type is missing
+          axisLabelFormatter = xAxisObj.axisLabel!.formatter;
         });
 
         it('formats axis label for first data point', function () {
@@ -89,7 +92,8 @@ describe('Chart XAxis', function () {
             utc: false,
           });
 
-          axisLabelFormatter = xAxisObj.axisLabel.formatter;
+          // @ts-expect-error formatter type is missing
+          axisLabelFormatter = xAxisObj.axisLabel!.formatter;
         });
 
         it('formats axis label for first data point', function () {
@@ -109,7 +113,8 @@ describe('Chart XAxis', function () {
             utc: true,
           });
 
-          axisLabelFormatter = xAxisObj.axisLabel.formatter;
+          // @ts-expect-error formatter type is missing
+          axisLabelFormatter = xAxisObj.axisLabel!.formatter;
         });
 
         it('formats axis label for first data point', function () {
@@ -130,7 +135,8 @@ describe('Chart XAxis', function () {
             utc: true,
           });
 
-          axisLabelFormatter = xAxisObj.axisLabel.formatter;
+          // @ts-expect-error formatter type is missing
+          axisLabelFormatter = xAxisObj.axisLabel!.formatter;
         });
 
         it('formats axis label for first data point', function () {

static/app/components/charts/components/xAxis.tsx

@@ -33,7 +33,7 @@ function XAxis({
   addSecondsToTimeFormat = false,
   ...props
 }: XAxisProps): XAXisComponentOption {
-  const AxisLabelFormatter = (value: string, index: number) => {
+  const AxisLabelFormatter = (value: string | number, index: number) => {
     const firstItem = index === 0;
     // Always show the date of the first item. Otherwise check the interval duration
     const showDate = firstItem ? true : !computeShortInterval({start, end, period});
@@ -51,7 +51,7 @@ function XAxis({
     }
 
     if (props.truncate) {
-      return truncationFormatter(value, props.truncate);
+      return truncationFormatter(value as string, props.truncate);
     }
 
     return undefined;

static/app/components/events/eventViewHierarchy.spec.tsx

@@ -53,8 +53,8 @@ const organization = OrganizationFixture({
 const event = EventFixture();
 
 describe('Event View Hierarchy', function () {
-  let mockAttachment;
-  let mockProject;
+  let mockAttachment!: ReturnType<typeof EventAttachmentFixture>;
+  let mockProject!: ReturnType<typeof ProjectFixture>;
   beforeEach(function () {
     mockAttachment = EventAttachmentFixture({type: 'event.view_hierarchy'});
     mockProject = ProjectFixture();

static/app/components/events/highlights/highlightsDataSection.spec.tsx

@@ -21,7 +21,7 @@ describe('HighlightsDataSection', function () {
     contexts: TEST_EVENT_CONTEXTS,
     tags: TEST_EVENT_TAGS,
   });
-  const eventTagMap = TEST_EVENT_TAGS.reduce(
+  const eventTagMap = TEST_EVENT_TAGS.reduce<Record<string, string>>(
     (tagMap, tag) => ({...tagMap, [tag.key]: tag.value}),
     {}
   );

static/app/components/events/interfaces/crashContent/stackTrace/rawContent.spec.tsx

@@ -161,7 +161,7 @@ describe('RawStacktraceContent', () => {
       );
     });
 
-    const inAppFrame = (fnName, line) =>
+    const inAppFrame = (fnName: string, line: number) =>
       FrameFixture({
         function: fnName,
         module: 'example.application',
@@ -169,7 +169,7 @@ describe('RawStacktraceContent', () => {
         filename: 'application',
         platform: undefined,
       });
-    const systemFrame = (fnName, line) =>
+    const systemFrame = (fnName: string, line: number) =>
       FrameFixture({
         function: fnName,
         module: 'example.application',

static/app/components/events/interfaces/searchBarAction.spec.tsx

@@ -63,7 +63,7 @@ const options: NonNullable<
 ];
 
 describe('SearchBarAction', () => {
-  let handleFilter;
+  let handleFilter!: jest.Mock;
 
   beforeEach(() => {
     handleFilter = jest.fn();

static/app/components/events/interfaces/spans/traceView.spec.tsx

@@ -20,14 +20,14 @@ import ProjectsStore from 'sentry/stores/projectsStore';
 import {QuickTraceContext} from 'sentry/utils/performance/quickTrace/quickTraceContext';
 import QuickTraceQuery from 'sentry/utils/performance/quickTrace/quickTraceQuery';
 
-function initializeData(settings) {
+function initializeData(settings: Parameters<typeof _initializeData>[0]) {
   const data = _initializeData(settings);
   ProjectsStore.loadInitialData(data.projects);
   return data;
 }
 
 describe('TraceView', () => {
-  let data;
+  let data!: ReturnType<typeof initializeData>;
 
   beforeEach(() => {
     data = initializeData({});

static/app/components/events/viewHierarchy/index.spec.tsx

@@ -2,7 +2,7 @@ import {ProjectFixture} from 'sentry-fixture/project';
 
 import {render, screen, userEvent, within} from 'sentry-test/reactTestingLibrary';
 
-import {ViewHierarchy} from '.';
+import {ViewHierarchy, type ViewHierarchyData} from './index';
 
 // Mocks for useVirtualizedTree hook
 class ResizeObserver {
@@ -47,8 +47,8 @@ const DEFAULT_MOCK_DATA = {
 };
 
 describe('View Hierarchy', function () {
-  let MOCK_DATA;
-  let project;
+  let MOCK_DATA!: ViewHierarchyData;
+  let project!: ReturnType<typeof ProjectFixture>;
   beforeEach(() => {
     MOCK_DATA = DEFAULT_MOCK_DATA;
     project = ProjectFixture();