Skip to content

Commit ded500b

Browse files
authored
update docs to describe usage of COLORS env variable (#1148)
1 parent 0bcd351 commit ded500b

File tree

1 file changed

+18
-4
lines changed

1 file changed

+18
-4
lines changed

docs/dom-testing-library/api-debugging.mdx

+18-4
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ title: Debugging
55

66
## Automatic Logging
77

8-
When you use any `get` calls in your test cases, the current state of the
9-
`container` (DOM) gets printed on the console. For example:
8+
When any `get` or `find` calls you use in your test cases fail, the current
9+
state of the `container` (DOM) gets printed on the console. For example:
1010

1111
```javascript
1212
// <div>Hello world</div>
@@ -26,7 +26,7 @@ Here is the state of your container:
2626
</div>
2727
```
2828

29-
Note: Since the DOM size can get really large, you can set the limit of DOM
29+
**Note**: Since the DOM size can get really large, you can set the limit of DOM
3030
content to be printed via environment variable `DEBUG_PRINT_LIMIT`. The default
3131
value is `7000`. You will see `...` in the console, when the DOM content is
3232
stripped off, because of the length you have set or due to default size limit.
@@ -40,6 +40,20 @@ This works on macOS/Linux, you'll need to do something else for Windows. If
4040
you'd like a solution that works for both, see
4141
[`cross-env`](https://www.npmjs.com/package/cross-env).
4242

43+
**Note**: The output of the DOM is colorized by default if your tests are
44+
running in a node environment. However, you may sometimes want to turn off
45+
colors, such as in cases where the output is written to a log file for
46+
debugging purposes. You can use the environment variable `COLORS` to explicitly
47+
force the colorization off or on. For example:
48+
49+
```
50+
COLORS=false npm test
51+
```
52+
53+
This works on macOS/Linux, you'll need to do something else for Windows. If
54+
you'd like a solution that works for both, see
55+
[`cross-env`](https://www.npmjs.com/package/cross-env).
56+
4357
## `prettyDOM`
4458

4559
Built on top of
@@ -76,7 +90,7 @@ This function is usually used alongside `console.log` to temporarily print out
7690
DOM trees during tests for debugging purposes:
7791

7892
```javascript
79-
import {prettyDOM } from '@testing-library/dom'
93+
import {prettyDOM} from '@testing-library/dom'
8094

8195
const div = document.createElement('div')
8296
div.innerHTML = '<div><h1>Hello World</h1></div>'

0 commit comments

Comments
 (0)