Skip to content

Commit

Permalink
fix: Access process only if defined
Browse files Browse the repository at this point in the history
  • Loading branch information
eps1lon committed Jul 5, 2024
1 parent be5d9c1 commit f52e794
Show file tree
Hide file tree
Showing 2 changed files with 50 additions and 47 deletions.
89 changes: 44 additions & 45 deletions src/__tests__/pretty-dom.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,7 @@ function prettyDOM(...args) {
throw new Error('process is no longer defined. Remove this setup code.')
} else {
originalProcess = process
// TODO: Delete to test browser environments
// delete globalThis.process
delete globalThis.process
}

try {
Expand All @@ -23,11 +22,11 @@ function prettyDOM(...args) {
test('prettyDOM prints out the given DOM element tree highlighted', () => {
const {container} = render('<div>Hello World!</div>')
expect(prettyDOM(container)).toMatchInlineSnapshot(`
[36m<div>[39m
[36m<div>[39m
[0mHello World![0m
[36m</div>[39m
[36m</div>[39m
<div>
<div>
Hello World!
</div>
</div>
`)
})

Expand All @@ -36,21 +35,21 @@ test('prettyDOM supports truncating the output length', () => {
expect(prettyDOM(container, 5)).toMatch(/\.\.\./)
expect(prettyDOM(container, 0)).toMatch('')
expect(prettyDOM(container, Number.POSITIVE_INFINITY)).toMatchInlineSnapshot(`
[36m<div>[39m
[36m<div>[39m
[0mHello World![0m
[36m</div>[39m
[36m</div>[39m
<div>
<div>
Hello World!
</div>
</div>
`)
})

test('prettyDOM defaults to document.body', () => {
const defaultInlineSnapshot = `
[36m<body>[39m
[36m<div>[39m
[0mHello World![0m
[36m</div>[39m
[36m</body>[39m
<body>
<div>
Hello World!
</div>
</body>
`
renderIntoDocument('<div>Hello World!</div>')
expect(prettyDOM()).toMatchInlineSnapshot(defaultInlineSnapshot)
Expand All @@ -59,10 +58,10 @@ test('prettyDOM defaults to document.body', () => {

test('prettyDOM supports receiving the document element', () => {
expect(prettyDOM(document)).toMatchInlineSnapshot(`
[36m<html>[39m
[36m<head />[39m
[36m<body />[39m
[36m</html>[39m
<html>
<head />
<body />
</html>
`)
})

Expand Down Expand Up @@ -90,11 +89,11 @@ test('prettyDOM ignores script elements and comments nodes by default', () => {
)

expect(prettyDOM(container)).toMatchInlineSnapshot(`
[36m<body>[39m
[36m<p>[39m
[0mHello, Dave[0m
[36m</p>[39m
[36m</body>[39m
<body>
<p>
Hello, Dave
</p>
</body>
`)
})

Expand All @@ -106,15 +105,15 @@ test('prettyDOM can include all elements with a custom filter', () => {
expect(
prettyDOM(container, Number.POSITIVE_INFINITY, {filterNode: () => true}),
).toMatchInlineSnapshot(`
[36m<body>[39m
[36m<script[39m
[33msrc[39m=[32m"context.js"[39m
[36m/>[39m
[90m<!-- Some comment -->[39m
[36m<p>[39m
[0mHello, Dave[0m
[36m</p>[39m
[36m</body>[39m
<body>
<script
src="context.js"
/>
<!-- Some comment -->
<p>
Hello, Dave
</p>
</body>
`)
})

Expand All @@ -127,11 +126,11 @@ test('prettyDOM supports named custom elements', () => {
const {container} = render('<my-element-1>Hello World!</my-element-1>')

expect(prettyDOM(container)).toMatchInlineSnapshot(`
[36m<div>[39m
[36m<my-element-1>[39m
[0mHello World![0m
[36m</my-element-1>[39m
[36m</div>[39m
<div>
<my-element-1>
Hello World!
</my-element-1>
</div>
`)
})

Expand All @@ -141,10 +140,10 @@ test('prettyDOM supports anonymous custom elements', () => {
const {container} = render('<my-element-2>Hello World!</my-element-2>')

expect(prettyDOM(container)).toMatchInlineSnapshot(`
[36m<div>[39m
[36m<my-element-2>[39m
[0mHello World![0m
[36m</my-element-2>[39m
[36m</div>[39m
<div>
<my-element-2>
Hello World!
</my-element-2>
</div>
`)
})
8 changes: 6 additions & 2 deletions src/pretty-dom.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,13 @@ import {getDocument} from './helpers'
import {getConfig} from './config'

const shouldHighlight = () => {
if (typeof process === 'undefined') {
// Don't add ANSI colors outside of Node.js (e.g. in browsers).
return false
}
// Try to safely parse env COLORS: We will default behavior if any step fails.
try {
const colors = process?.env?.COLORS
const colors = process.env?.COLORS
if (colors) {
const b = JSON.parse(colors)
if (typeof b === 'boolean') return b
Expand All @@ -18,7 +22,7 @@ const shouldHighlight = () => {

// In all other cases, whether COLORS was a weird type, or the attempt threw:
// Fall back to colorizing if we are running in node.
return !!process?.versions?.node
return Boolean(process.versions?.node)
}

const {DOMCollection} = prettyFormat.plugins
Expand Down

0 comments on commit f52e794

Please sign in to comment.