Skip to content

Commit d9b690d

Browse files
committed
chore: restructure sections
1 parent 4f255fe commit d9b690d

File tree

4 files changed

+19
-37
lines changed

4 files changed

+19
-37
lines changed

docs/react/testing/introduction.md

+1-5
Original file line numberDiff line numberDiff line change
@@ -36,10 +36,6 @@ There are two types of tests that can be written:
3636

3737
[**Playwright**](https://playwright.dev): Playwright is a browser automation library that's used to run end-to-end tests. It allows developers to test the entire application, including the user interface, in a simulated environment.
3838

39-
## Conclusion
40-
41-
Testing is an important part of the development process, and React provides a robust set of tools and libraries for testing applications. By writing and running tests, you can ensure that your application is working as intended and catch bugs before they reach production.
42-
43-
### Additional Resources
39+
## Additional Resources
4440

4541
- [Testing Ionic React Apps with Jest and React Testing Library](https://ionicframework.com/blog/testing-ionic-react-apps-with-jest-and-react-testing-library/)

docs/react/testing/setup.md renamed to docs/react/testing/unit-testing/setup.md

+5-9
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,11 @@ title: Ionic React Unit Testing Setup
44
description: Learn how to set up unit tests for an Ionic React application.
55
---
66

7-
# Setup
7+
# Unit Testing Setup
88

99
Ionic requires a few additional steps to set up unit tests.
1010

11-
## Install Jest
12-
13-
### React Scripts
11+
## Jest
1412

1513
If your React project is using `react-scripts`, jest is already installed. You can confirm the version of Jest by running:
1614

@@ -24,15 +22,15 @@ Ionic recommends `react-scripts@5` and requires a minimum version of `jest@27`,
2422
npm install react-scripts@latest
2523
```
2624

27-
## Install React Testing Library
25+
### Install React Testing Library
2826

2927
React Testing Library is a set of utilities that make it easier to test React components. It's used to interact with components and test their behavior.
3028

3129
```bash
3230
npm install --save-dev @testing-library/react @testing-library/jest-dom @testing-library/user-event
3331
```
3432

35-
## Initialize Ionic React
33+
### Initialize Ionic React
3634

3735
Ionic React requires the `setupIonicReact` function to be called before any tests are run. Failing to do so will result in mode-based classes and platform behaviors not being applied to your components.
3836

@@ -44,12 +42,10 @@ import { setupIonicReact } from '@ionic/react';
4442
setupIonicReact();
4543
```
4644

47-
## Test Environment
45+
### Test Environment
4846

4947
Ionic requires a DOM environment to be available in order to render components. This is typically provided by the `jsdom` test environment. In Jest 27 and later, the default environment is `node`.
5048

51-
### React Scripts
52-
5349
To configure this behavior, update your `test` command to include `--env=jsdom`:
5450

5551
```json title="package.json"

sidebars.js

+13-23
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,7 @@ module.exports = {
1010
type: 'category',
1111
label: 'Upgrade Guides',
1212
collapsed: false,
13-
items: [
14-
'updating/7-0',
15-
'updating/6-0',
16-
'updating/5-0',
17-
'updating/4-0'
18-
]
13+
items: ['updating/7-0', 'updating/6-0', 'updating/5-0', 'updating/4-0'],
1914
},
2015
{
2116
type: 'category',
@@ -30,7 +25,7 @@ module.exports = {
3025
'developing/tips',
3126
'developing/hardware-back-button',
3227
'developing/keyboard',
33-
'developing/config'
28+
'developing/config',
3429
],
3530
},
3631
{
@@ -45,7 +40,7 @@ module.exports = {
4540
href: '/docs/api/grid',
4641
},
4742
'layout/global-stylesheets',
48-
'layout/css-utilities'
43+
'layout/css-utilities',
4944
],
5045
},
5146
{
@@ -129,9 +124,13 @@ module.exports = {
129124
type: 'category',
130125
label: 'Testing',
131126
items: [
132-
'react/testing/introduction',
133-
'react/testing/setup',
134-
'react/testing/examples'
127+
'react/testing/introduction',
128+
{
129+
type: 'category',
130+
label: 'Unit Testing',
131+
collapsed: false,
132+
items: ['react/testing/unit-testing/setup', 'react/testing/unit-testing/examples'],
133+
},
135134
],
136135
},
137136
'react/performance',
@@ -237,7 +236,7 @@ module.exports = {
237236
href: 'https://github.com/ionic-team/ionic/blob/master/CHANGELOG.md',
238237
},
239238
'reference/support',
240-
'reference/browser-support'
239+
'reference/browser-support',
241240
],
242241
},
243242
],
@@ -370,12 +369,7 @@ module.exports = {
370369
type: 'category',
371370
label: 'Media',
372371
collapsed: false,
373-
items: [
374-
'api/avatar',
375-
'api/icon',
376-
'api/img',
377-
'api/thumbnail',
378-
],
372+
items: ['api/avatar', 'api/icon', 'api/img', 'api/thumbnail'],
379373
},
380374
{
381375
type: 'category',
@@ -528,11 +522,7 @@ module.exports = {
528522
type: 'category',
529523
label: 'Getting Started',
530524
collapsed: false,
531-
items: [
532-
'native',
533-
'native-setup',
534-
'native-faq',
535-
],
525+
items: ['native', 'native-setup', 'native-faq'],
536526
},
537527
{
538528
type: 'category',

0 commit comments

Comments
 (0)