docs: add example usage of buildQueries to custom queries example

Author: kierenhughes

docs/react-testing-library/setup.md

@@ -147,31 +147,64 @@ module.exports = {
 <details>
 <summary>Customize queries globally with custom render</summary>
 
-You can override and append queries via the render function by passing a [`queries`](api.md#render-options) option.
+You can define your own custom queries as described in the example in the 
+[Helpers API](/doc/dom-testing-library/api-helpers.md) documentation, or via the
+ [`buildQueries`](/doc/dom-testing-library/api-helpers#buildQueries) helper:
 
-You can define your own custom queries as described in the example in the [Helpers API](api-helpers.md) documentation.
+```js
+// custom-queries.js
+import { queryHelpers, buildQueries } from '@testing-library/react';
+
+const queryAllByDataCy = (...args) => 
+  queryHelpers.queryAllByAttribute('data-cy', ...args);
+
+const getMultipleError = (c, dataCyValue) => (
+  `Found multiple elements with the data-cy attribute of: ${dataCyValue}`
+);
+const getMissingError = (c, dataCyValue) => (
+  `Unable to find an element with the data-cy attribute of: ${dataCyValue}`
+);
+
+const [
+  queryByDataCy,
+  getAllByDataCy,
+  getByDataCy,
+  findAllByDataCy,
+  findByDataCy
+] = buildQueries(
+  queryAllByDataCy,
+  getMultipleError,
+  getMissingError,
+);
+
+export {
+  queryByDataCy,
+  queryAllByDataCy,
+  getByDataCy,
+  getAllByDataCy,
+  findAllByDataCy,
+  findByDataCy,
+};
+```
+
+You can then override and append queries via the render function by passing a 
+[`queries`](api.md#render-options) option.
 
 If you want to add custom queries globally, you can do this by defining a custom render method:
 
 ```js
 // test-utils.js
-import { render, queries, queryHelpers } from '@testing-library/react'
-
-const customQueries = {
-  getByDataCy: queryHelpers.queryByAttribute.bind(
-    null,
-    'data-cy'
-  ),
-};
+import { render, queries, queryHelpers } from '@testing-library/react';
+import * as customQueries from './custom-queries';
 
 const customRender = (ui, options) =>
-  render(ui, { queries: { ...queries, ...customQueries } })
+  render(ui, { queries: { ...queries, ...customQueries } });
 
 // re-export everything
-export * from '@testing-library/react'
+export * from '@testing-library/react';
 
 // override render method
-export { customRender as render }
+export { customRender as render };
 ```
 
 You can then use your custom queries as you would any other query: