Existing inline snapshots get wrong indentation when new ones are added

[mmkal]

🐛 Bug Report

New snapshots cause existing multi-line snapshots to indent too far.

To Reproduce

1. Write a test consisting of expect({x:1}).toMatchInlineSnapshot()
2. Run jest. Snapshot gets inserted fine.
3. Write another test under the existing one, again consisting of expect({x:1}).toMatchInlineSnapshot()
4. Run jest again. The new snapshot is inserted correctly, but the first snapshot's indentation gets increased.

Pasting these commands into a bash script is an easy way to repro:

mkdir indent-bug
cd indent-bug
npm init -y
npm i jest prettier
echo 'test("one", () => expect({x: 1}).toMatchInlineSnapshot())' > index.test.js
npx jest
echo 'test("two", () => expect({x: 1}).toMatchInlineSnapshot())' >> index.test.js
npx jest
echo 'test("three", () => expect({x: 1}).toMatchInlineSnapshot())' >> index.test.js
npx jest

Then take a look at index.test.js - you'll see the indenting is inconsistent:

test("one", () =>
  expect({ x: 1 }).toMatchInlineSnapshot(`
            Object {
              "x": 1,
            }
      `));
test("two", () =>
  expect({ x: 1 }).toMatchInlineSnapshot(`
        Object {
          "x": 1,
        }
    `));
test("three", () =>
  expect({ x: 1 }).toMatchInlineSnapshot(`
    Object {
      "x": 1,
    }
  `));

@scotthovestadt from poking at the code, this was most likely introduced in #8198

Expected behavior

All the generated snapshots have the same indentation.

Link to repl or repo (highly encouraged)

Not possible since it requires editing source files via inline snapshots, but the bash script pasted above is self contained and can be run on any machine with recent versions of node and npm.

Run npx envinfo --preset jest

Paste the results here:

  System:
    OS: macOS 10.14.5
    CPU: (4) x64 Intel(R) Core(TM) i7-7660U CPU @ 2.50GHz
  Binaries:
    Node: 10.16.0 - /usr/local/bin/node
    Yarn: 1.17.0 - /usr/local/bin/yarn
    npm: 6.9.0 - /usr/local/bin/npm
  npmPackages:
    jest: ^24.8.0 => 24.8.0 

[mmkal]

looks like this is a dupe of #8424 and hopefully will be fixed when #8492 is released

[murilobd]

I'm having this issue but in a opposite way: all my inline snapshots don't follow the indentation

Here's my npx envinfo --preset jest

  System:
    OS: macOS 10.15.5
    CPU: (8) x64 Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz
  Binaries:
    Node: 14.4.0 - ~/.nvm/versions/node/v14.4.0/bin/node
    Yarn: 1.22.4 - ~/.yarn/bin/yarn
    npm: 6.14.5 - ~/.nvm/versions/node/v14.4.0/bin/npm
  npmPackages:
    jest: ^24.8.0 => 24.9.0

Prettier is configured to use tabs

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Please note this issue tracker is not a help forum. We recommend using StackOverflow or our discord channel for questions.