[gh11317] Added documentation for working with Jest and Alias Paths (#…

…11323)

Issue [11317](#11317)

## Feature description

I ran into errors when I created an alias path, and then tested that
component within Jest. Jest needs to know about your alias paths.

---------

Co-authored-by: Josh GM Walker <56300765+Josh-Walker-GM@users.noreply.github.com>

docs/docs/typescript/introduction.md

@@ -132,3 +132,22 @@ import { CustomModal } from '@adminUI/CustomModal'
 1. **Improved code readability**, by abstracting complex directory hierarchies, and having meaningful names for your imports.
 1. **Code maintainability**, aliases allow you to decouple your code from the file structure and more easily move files around, as they are not tied to the longer path.
 1. **Reduce boilerplate**, no more `../../src/components/modules/admin/common/ui/` 😮‍💨
+
+When you start writing tests for components that contain alias paths, you will need to add the following to your Jest configuration in `jest.config.js`:
+
+```js
+const config = {
+  rootDir: '../',
+  preset: '@redwoodjs/testing/config/jest/web',
+  moduleNameMapper: {
+    '^@adminUI/(.*)$':
+      '<rootDir>/web/src/components/modules/admin/common/ui/$1',
+  },
+}
+
+module.exports = config
+```
+
+:::info
+There are 3 `jest.config.js` files within a Redwood project. There's one inside the `web` directory, one inside the `api` directory, and one at the root of the project. Since the alias I created is used within the `web` directory, I added the `moduleNameMapper` to the `jest.config.js` file within the `web` directory.
+:::