Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

jest-diff: Add changeColor and patchColor options #8911

Merged
merged 6 commits into from
Sep 5, 2019
Merged

jest-diff: Add changeColor and patchColor options #8911

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
5d40900
jest-diff: Add changeColor and patchColor options
pedrottimark Sep 4, 2019
c2226b0
Edit comment
pedrottimark Sep 4, 2019
8ee0ac5
Update CHANGELOG.md
pedrottimark Sep 4, 2019
c0676ba
Fix prettier lint error in README.md
pedrottimark Sep 4, 2019
9be9c26
Replace 4 occurrences of change with changed
pedrottimark Sep 4, 2019
e5916a5
Replace 4 occurrences of change with changed correctly this time
pedrottimark Sep 4, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
- `[jest-diff]` Add options for colors and symbols ([#8841](https://github.com/facebook/jest/pull/8841))
- `[jest-diff]` [**BREAKING**] Export as ECMAScript module ([#8873](https://github.com/facebook/jest/pull/8873))
- `[jest-diff]` Add `includeChangeCounts` and rename `Indicator` options ([#8881](https://github.com/facebook/jest/pull/8881))
- `[jest-diff]` Add `changeColor` and `patchColor` options ([#8911](https://github.com/facebook/jest/pull/8911))
- `[jest-runner]` Warn if a worker had to be force exited ([#8206](https://github.com/facebook/jest/pull/8206))
- `[@jest/test-result]` Create method to create empty `TestResult` ([#8867](https://github.com/facebook/jest/pull/8867))
- `[jest-worker]` [**BREAKING**] Return a promise from `end()`, resolving with the information whether workers exited gracefully ([#8206](https://github.com/facebook/jest/pull/8206))
Expand Down
67 changes: 48 additions & 19 deletions packages/jest-diff/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ const difference = diffStringsUnified(a, b);
The returned **string** consists of:

- annotation lines: describe the two change indicators with labels, and a blank line
- comparison lines: similar to “unified” view on GitHub, and **changed substrings** have **inverted** foreground and background colors (which the following example does not show)
- comparison lines: similar to “unified” view on GitHub, and **changed substrings** have **inverse** foreground and background colors (which the following example does not show)

```diff
- Expected
Expand Down Expand Up @@ -212,20 +212,22 @@ For other applications, you can provide an options object as a third argument:

### Properties of options object

| name | default |
| :-------------------- | :------------ |
| `aAnnotation` | `'Expected'` |
| `aColor` | `chalk.green` |
| `aIndicator` | `'-'` |
| `bAnnotation` | `'Received'` |
| `bColor` | `chalk.red` |
| `bIndicator` | `'+'` |
| `commonColor` | `chalk.dim` |
| `commonIndicator` | `' '` |
| `contextLines` | `5` |
| `expand` | `true` |
| `includeChangeCounts` | `false` |
| `omitAnnotationLines` | `false` |
| name | default |
| :-------------------- | :-------------- |
| `aAnnotation` | `'Expected'` |
| `aColor` | `chalk.green` |
| `aIndicator` | `'-'` |
| `bAnnotation` | `'Received'` |
| `bColor` | `chalk.red` |
| `bIndicator` | `'+'` |
| `changeColor` | `chalk.inverse` |
| `commonColor` | `chalk.dim` |
| `commonIndicator` | `' '` |
| `contextLines` | `5` |
| `expand` | `true` |
| `includeChangeCounts` | `false` |
| `omitAnnotationLines` | `false` |
| `patchColor` | `chalk.yellow` |

### Example of options for labels

Expand All @@ -240,7 +242,7 @@ const options = {

The `jest-diff` package does not assume that the 2 labels have equal length.

### Example of options for colors
### Example of options for colors of change lines
pedrottimark marked this conversation as resolved.
Show resolved Hide resolved

For consistency with most diff tools, you might exchange the colors:

Expand All @@ -253,15 +255,31 @@ const options = {
};
```

### Example of option to keep the default color
### Example of option for color of change substrings

Although the default inverse of foreground and background colors is hard to beat for change substrings **within lines**, especially because it highlights spaces, if you want bold font weight on yellow background:

```js
const options = {
changeColor: chalk.bold.bgAnsi256(226), // #ffff00
};
```

### Example of options for no colors

The value of a color option is a function, which given a string, returns a string.

For common lines to keep the default (usually black) color, you might provide an identity function:
To store the difference in a file without escape codes for colors, provide an identity function:

```js
const identity = string => string;

const options = {
commonColor: line => line,
aColor: identity,
bColor: identity,
changeColor: identity,
commonColor: identity,
patchColor: identity,
};
```

Expand Down Expand Up @@ -293,6 +311,17 @@ const options = {

A patch mark like `@@ -12,7 +12,9 @@` accounts for omitted common lines.

### Example of option for color of patch marks

If you want patch marks to have the same dim color as common lines:

```js
const options = {
expand: false,
patchColor: chalk.dim,
};
```

### Example of option to include change counts

To display the number of change lines at the right of annotation lines:
Expand Down
17 changes: 14 additions & 3 deletions packages/jest-diff/src/__tests__/__snapshots__/diff.test.ts.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -103,7 +103,7 @@ exports[`context number of lines: -1 (5 default) 1`] = `
"<green>- Expected 1 -</>
<red>+ Received 1 +</>

<yellow>@@ -6,9 +6,9 @@</>
<dim>@@ -6,9 +6,9 @@</>
<dim> 4,</>
<dim> 5,</>
<dim> 6,</>
Expand Down Expand Up @@ -156,7 +156,7 @@ exports[`context number of lines: 3.1 (5 default) 1`] = `
"<green>- Expected 1 -</>
<red>+ Received 1 +</>

<yellow>@@ -6,9 +6,9 @@</>
<dim>@@ -6,9 +6,9 @@</>
<dim> 4,</>
<dim> 5,</>
<dim> 6,</>
Expand All @@ -173,7 +173,7 @@ exports[`context number of lines: undefined (5 default) 1`] = `
"<green>- Expected 1 -</>
<red>+ Received 1 +</>

<yellow>@@ -6,9 +6,9 @@</>
<dim>@@ -6,9 +6,9 @@</>
<dim> 4,</>
<dim> 5,</>
<dim> 6,</>
Expand Down Expand Up @@ -322,6 +322,17 @@ exports[`options 7980 diffStringsUnified 1`] = `
<green>+ \`\${Ti.App.<inverse>getN</>ame<inverse>()</>} \${Ti.App.<inverse>getV</>ersion<inverse>()</>} \${Ti.Platform.<inverse>getN</>ame<inverse>()</>} \${Ti.Platform.<inverse>getV</>ersion<inverse>()</>}\`</>"
`;

exports[`options change color diffStringsUnified 1`] = `
"<green>- Expected</>
<red>+ Received</>

<green>- delete</>
<green>- changed <bold>from</></>
<red>+ changed <bold>to</></>
<red>+ insert</>
<dim> common</>"
`;

exports[`options change indicators diff 1`] = `
"<green>< Expected</>
<red>> Received</>
Expand Down
Loading