chore(types): Convert src/query-helpers to TS (#1016)

Co-authored-by: Tim Deschryver <[email protected]>
Co-authored-by: Rayat Rahman <[email protected]>
Co-authored-by: Tim Deschryver <[email protected]>

Author: 3 people

src/queries/alt-text.ts

@@ -18,16 +18,15 @@ const queryAllByAltText: AllByBoundAttribute = (
   )
 }
 
-const getMultipleError: GetErrorFunction = (c, alt) =>
+const getMultipleError: GetErrorFunction<[unknown]> = (c, alt) =>
   `Found multiple elements with the alt text: ${alt}`
-const getMissingError: GetErrorFunction = (c, alt) =>
+const getMissingError: GetErrorFunction<[unknown]> = (c, alt) =>
   `Unable to find an element with the alt text: ${alt}`
 
-const queryAllByAltTextWithSuggestions = wrapAllByQueryWithSuggestion(
-  queryAllByAltText,
-  queryAllByAltText.name,
-  'queryAll',
-)
+const queryAllByAltTextWithSuggestions = wrapAllByQueryWithSuggestion<
+  // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+  [altText: Matcher, options?: SelectorMatcherOptions]
+>(queryAllByAltText, queryAllByAltText.name, 'queryAll')
 const [
   queryByAltText,
   getAllByAltText,

src/queries/display-value.ts

@@ -1,6 +1,11 @@
 import {wrapAllByQueryWithSuggestion} from '../query-helpers'
 import {checkContainerType} from '../helpers'
-import {AllByBoundAttribute, GetErrorFunction} from '../../types'
+import {
+  AllByBoundAttribute,
+  GetErrorFunction,
+  Matcher,
+  MatcherOptions,
+} from '../../types'
 import {
   getNodeText,
   matches,
@@ -38,16 +43,15 @@ const queryAllByDisplayValue: AllByBoundAttribute = (
   })
 }
 
-const getMultipleError: GetErrorFunction = (c, value) =>
+const getMultipleError: GetErrorFunction<[unknown]> = (c, value) =>
   `Found multiple elements with the display value: ${value}.`
-const getMissingError: GetErrorFunction = (c, value) =>
+const getMissingError: GetErrorFunction<[unknown]> = (c, value) =>
   `Unable to find an element with the display value: ${value}.`
 
-const queryAllByDisplayValueWithSuggestions = wrapAllByQueryWithSuggestion(
-  queryAllByDisplayValue,
-  queryAllByDisplayValue.name,
-  'queryAll',
-)
+const queryAllByDisplayValueWithSuggestions = wrapAllByQueryWithSuggestion<
+  // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+  [value: Matcher, options?: MatcherOptions]
+>(queryAllByDisplayValue, queryAllByDisplayValue.name, 'queryAll')
 
 const [
   queryByDisplayValue,

src/queries/label-text.ts

@@ -1,7 +1,13 @@
 import {getConfig} from '../config'
 import {checkContainerType} from '../helpers'
 import {getLabels, getRealLabels, getLabelContent} from '../label-helpers'
-import {AllByText, GetErrorFunction} from '../../types'
+import {
+  AllByText,
+  GetErrorFunction,
+  Matcher,
+  MatcherOptions,
+  SelectorMatcherOptions,
+} from '../../types'
 import {
   fuzzyMatches,
   matches,
@@ -100,9 +106,6 @@ const queryAllByLabelText: AllByText = (
       return labelledElements
     }, [])
     .concat(
-      // TODO: Remove ignore after `queryAllByAttribute` will be moved to TS
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-expect-error
       queryAllByAttribute('aria-label', container, text, {
         exact,
         normalizer: matchNormalizer,
@@ -171,42 +174,44 @@ function getTagNameOfElementAssociatedWithLabelViaFor(
 }
 
 // the reason mentioned above is the same reason we're not using buildQueries
-const getMultipleError: GetErrorFunction = (c, text) =>
+const getMultipleError: GetErrorFunction<[unknown]> = (c, text) =>
   `Found multiple elements with the text of: ${text}`
-const queryByLabelText = wrapSingleQueryWithSuggestion(
+const queryByLabelText = wrapSingleQueryWithSuggestion<
+  // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+  [labelText: Matcher, options?: SelectorMatcherOptions]
+>(
   makeSingleQuery(queryAllByLabelText, getMultipleError),
   queryAllByLabelText.name,
   'query',
 )
 const getByLabelText = makeSingleQuery(getAllByLabelText, getMultipleError)
 
 const findAllByLabelText = makeFindQuery(
-  wrapAllByQueryWithSuggestion(
-    getAllByLabelText,
-    getAllByLabelText.name,
-    'findAll',
-  ),
+  wrapAllByQueryWithSuggestion<
+    // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+    [labelText: Matcher, options?: SelectorMatcherOptions]
+  >(getAllByLabelText, getAllByLabelText.name, 'findAll'),
 )
 const findByLabelText = makeFindQuery(
-  wrapSingleQueryWithSuggestion(getByLabelText, getAllByLabelText.name, 'find'),
-)
-
-const getAllByLabelTextWithSuggestions = wrapAllByQueryWithSuggestion(
-  getAllByLabelText,
-  getAllByLabelText.name,
-  'getAll',
-)
-const getByLabelTextWithSuggestions = wrapSingleQueryWithSuggestion(
-  getByLabelText,
-  getAllByLabelText.name,
-  'get',
+  wrapSingleQueryWithSuggestion<
+    // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+    [labelText: Matcher, options?: SelectorMatcherOptions]
+  >(getByLabelText, getAllByLabelText.name, 'find'),
 )
 
-const queryAllByLabelTextWithSuggestions = wrapAllByQueryWithSuggestion(
-  queryAllByLabelText,
-  queryAllByLabelText.name,
-  'queryAll',
-)
+const getAllByLabelTextWithSuggestions = wrapAllByQueryWithSuggestion<
+  // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+  [labelText: Matcher, options?: MatcherOptions]
+>(getAllByLabelText, getAllByLabelText.name, 'getAll')
+const getByLabelTextWithSuggestions = wrapSingleQueryWithSuggestion<
+  // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+  [labelText: Matcher, options?: SelectorMatcherOptions]
+>(getByLabelText, getAllByLabelText.name, 'get')
+
+const queryAllByLabelTextWithSuggestions = wrapAllByQueryWithSuggestion<
+  // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+  [labelText: Matcher, options?: SelectorMatcherOptions]
+>(queryAllByLabelText, queryAllByLabelText.name, 'queryAll')
 
 export {
   queryAllByLabelTextWithSuggestions as queryAllByLabelText,

src/queries/placeholder-text.ts

@@ -5,21 +5,17 @@ import {queryAllByAttribute, buildQueries} from './all-utils'
 
 const queryAllByPlaceholderText: AllByBoundAttribute = (...args) => {
   checkContainerType(args[0])
-  // TODO: Remove ignore after `queryAllByAttribute` will be moved to TS
-  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-  // @ts-expect-error
   return queryAllByAttribute('placeholder', ...args)
 }
-const getMultipleError: GetErrorFunction = (c, text) =>
+const getMultipleError: GetErrorFunction<[unknown]> = (c, text) =>
   `Found multiple elements with the placeholder text of: ${text}`
-const getMissingError: GetErrorFunction = (c, text) =>
+const getMissingError: GetErrorFunction<[unknown]> = (c, text) =>
   `Unable to find an element with the placeholder text of: ${text}`
 
-const queryAllByPlaceholderTextWithSuggestions = wrapAllByQueryWithSuggestion(
-  queryAllByPlaceholderText,
-  queryAllByPlaceholderText.name,
-  'queryAll',
-)
+const queryAllByPlaceholderTextWithSuggestions = wrapAllByQueryWithSuggestion<
+  // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+  [placeholderText: Matcher, options?: MatcherOptions]
+>(queryAllByPlaceholderText, queryAllByPlaceholderText.name, 'queryAll')
 
 const [
   queryByPlaceholderText,

src/queries/test-id.ts

@@ -7,22 +7,18 @@ const getTestIdAttribute = () => getConfig().testIdAttribute
 
 const queryAllByTestId: AllByBoundAttribute = (...args) => {
   checkContainerType(args[0])
-  // TODO: Remove ignore after `queryAllByAttribute` will be moved to TS
-  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-  // @ts-expect-error
   return queryAllByAttribute(getTestIdAttribute(), ...args)
 }
 
-const getMultipleError: GetErrorFunction = (c, id) =>
+const getMultipleError: GetErrorFunction<[unknown]> = (c, id) =>
   `Found multiple elements by: [${getTestIdAttribute()}="${id}"]`
-const getMissingError: GetErrorFunction = (c, id) =>
+const getMissingError: GetErrorFunction<[unknown]> = (c, id) =>
   `Unable to find an element by: [${getTestIdAttribute()}="${id}"]`
 
-const queryAllByTestIdWithSuggestions = wrapAllByQueryWithSuggestion(
-  queryAllByTestId,
-  queryAllByTestId.name,
-  'queryAll',
-)
+const queryAllByTestIdWithSuggestions = wrapAllByQueryWithSuggestion<
+  // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+  [testId: Matcher, options?: MatcherOptions]
+>(queryAllByTestId, queryAllByTestId.name, 'queryAll')
 
 const [
   queryByTestId,

src/queries/text.ts

@@ -40,16 +40,15 @@ const queryAllByText: AllByText = (
   )
 }
 
-const getMultipleError: GetErrorFunction = (c, text) =>
+const getMultipleError: GetErrorFunction<[unknown]> = (c, text) =>
   `Found multiple elements with the text: ${text}`
-const getMissingError: GetErrorFunction = (c, text) =>
+const getMissingError: GetErrorFunction<[unknown]> = (c, text) =>
   `Unable to find an element with the text: ${text}. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.`
 
-const queryAllByTextWithSuggestions = wrapAllByQueryWithSuggestion(
-  queryAllByText,
-  queryAllByText.name,
-  'queryAll',
-)
+const queryAllByTextWithSuggestions = wrapAllByQueryWithSuggestion<
+  // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+  [text: Matcher, options?: MatcherOptions]
+>(queryAllByText, queryAllByText.name, 'queryAll')
 
 const [queryByText, getAllByText, getByText, findAllByText, findByText] =
   buildQueries(queryAllByText, getMultipleError, getMissingError)

src/queries/title.ts

@@ -1,6 +1,11 @@
 import {wrapAllByQueryWithSuggestion} from '../query-helpers'
 import {checkContainerType} from '../helpers'
-import {AllByBoundAttribute, GetErrorFunction} from '../../types'
+import {
+  AllByBoundAttribute,
+  GetErrorFunction,
+  Matcher,
+  MatcherOptions,
+} from '../../types'
 import {
   fuzzyMatches,
   matches,
@@ -31,16 +36,15 @@ const queryAllByTitle: AllByBoundAttribute = (
   )
 }
 
-const getMultipleError: GetErrorFunction = (c, title) =>
+const getMultipleError: GetErrorFunction<[unknown]> = (c, title) =>
   `Found multiple elements with the title: ${title}.`
-const getMissingError: GetErrorFunction = (c, title) =>
+const getMissingError: GetErrorFunction<[unknown]> = (c, title) =>
   `Unable to find an element with the title: ${title}.`
 
-const queryAllByTitleWithSuggestions = wrapAllByQueryWithSuggestion(
-  queryAllByTitle,
-  queryAllByTitle.name,
-  'queryAll',
-)
+const queryAllByTitleWithSuggestions = wrapAllByQueryWithSuggestion<
+  // @ts-expect-error -- See `wrapAllByQueryWithSuggestion` Argument constraint comment
+  [title: Matcher, options?: MatcherOptions]
+>(queryAllByTitle, queryAllByTitle.name, 'queryAll')
 
 const [queryByTitle, getAllByTitle, getByTitle, findAllByTitle, findByTitle] =
   buildQueries(queryAllByTitle, getMultipleError, getMissingError)