Upgrade Babel to 7.21

package.json

@@ -21,6 +21,7 @@
         "compile": "tsc",
         "preexample": "yarn run compile",
         "test": "vitest --run",
+        "test:watch": "vitest",
         "format": "prettier . --write",
         "format:check": "prettier . --check",
         "type-check": "tsc --noEmit",
@@ -52,11 +53,11 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "@babel/core": "^7.17.7",
-        "@babel/generator": "^7.17.7",
-        "@babel/parser": "^7.17.7",
-        "@babel/traverse": "^7.17.3",
-        "@babel/types": "^7.17.0",
+        "@babel/core": "^7.21.8",
+        "@babel/generator": "^7.21.5",
+        "@babel/parser": "^7.21.8",
+        "@babel/traverse": "^7.21.5",
+        "@babel/types": "^7.21.5",
         "lodash.clone": "^4.5.0",
         "lodash.isequal": "^4.5.0",
         "semver": "^7.5.0"

src/utils/__tests__/get-code-from-ast.spec.ts

@@ -28,6 +28,7 @@ import a from 'a';
     expect(format(formatted, { parser: 'babel' })).toEqual(
         `// first comment
 // second comment
+
 import a from "a";
 import c from "c";
 import g from "g";
@@ -65,6 +66,7 @@ import type {See} from 'c';
     expect(format(formatted, { parser: 'babel' })).toEqual(
         `// first comment
 // second comment
+
 import a, { b, type Bee } from "a";
 import c, { type C, type See } from "c";
 import g from "g";

src/utils/__tests__/merge-nodes-with-matching-flavors.spec.ts

@@ -61,6 +61,7 @@ import { Junk } from "junk-group-1";
 import "./side-effects1";
 
 // C, E and D will be separated from A, B because side-effects in-between
+
 import { D, type C, type E } from "a";
 
 // prettier-ignore

src/utils/has-ignore-next-node.ts

@@ -3,7 +3,9 @@ import type { Comment } from '@babel/types';
 /**
  * Detects if `// prettier-ignore` is present in the provided array of comments.
  */
-export const hasIgnoreNextNode = (comments: readonly Comment[] | null) =>
+export const hasIgnoreNextNode = (
+    comments: readonly Comment[] | null | undefined,
+) =>
     (comments ?? []).some(
         (comment) => comment.value.trim() === 'prettier-ignore',
     );

src/utils/remove-nodes-from-original-code.ts

@@ -11,7 +11,10 @@ import type {
 type Range = readonly [start: number, end: number];
 
 /** An optional range between a start position (inclusive) and an end position (exclusive). */
-type OptionalRange = readonly [start: number | null, end: number | null];
+type OptionalRange = readonly [
+    start: number | null | undefined,
+    end: number | null | undefined,
+];
 
 /** Compares two range by their start position. */
 function compareRangesByStart(range1: Range, range2: Range): number {

tests/Angular/__snapshots__/ppsi.spec.ts.snap

@@ -148,6 +148,7 @@ export class TemplateController {
 }
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment in this file.
+
 import thirdDisco0 from "third-disco0";
 import thirdParty0 from "third-party0";
 import otherthing3 from "@core/otherthing3";

tests/Babel/__snapshots__/ppsi.spec.ts.snap

@@ -20,6 +20,7 @@ function add(a,b) {
 }
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment in this file.
+
 import thirdParty from "third-party";
 import z from "z";
 import abc from "@core/abc";
@@ -87,6 +88,7 @@ function add(a,b) {
 }
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment in this file.
+
 import thirdDisco0 from "third-disco0";
 import thirdParty0 from "third-party0";
 import otherthing3 from "@core/otherthing3";

tests/Flow/__snapshots__/ppsi.spec.ts.snap

@@ -33,7 +33,9 @@ export function givesAFoo3Obj(): AliasFoo3 {
 /**
  * @flow
  */
+
 // I am top level comment in this file.
+
 import thirdParty from "third-party";
 import abc from "@core/abc";
 import otherthing from "@core/otherthing";
@@ -127,7 +129,9 @@ export function givesAFoo3Obj(): AliasFoo3 {
 /**
  * @flow
  */
+
 // I am top level comment in this file.
+
 import thirdDisco0 from "third-disco0";
 import thirdParty0 from "third-party0";
 import otherthing3 from "@core/otherthing3";
@@ -192,7 +196,6 @@ import {fooValue} from './foo';
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 /**
  * @flow
- */
-import { fooValue, type Foo } from "./foo";
+ */ import { fooValue, type Foo } from "./foo";
 
 `;

tests/ImportsNotSeparated/__snapshots__/ppsi.spec.ts.snap

@@ -131,6 +131,7 @@ function add(a:number,b:number) {
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment in this file.
 // I am second line of top level comment in this file.
+
 import thirdParty from "third-party";
 import z from "z";
 import abc from "@core/abc";
@@ -188,6 +189,7 @@ function add(a:number,b:number) {
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 //@ts-ignore
 // I am file top level comments
+
 import a from "a";
 import c from "c";
 // I am stick to third party comment
@@ -266,6 +268,7 @@ import fourLevelRelativePath from "../../../../fourLevelRelativePath";
 import something from "@server/something";
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment
+
 import abc from "@core/abc";
 import otherthing from "@core/otherthing";
 import something from "@server/something";
@@ -321,6 +324,7 @@ import './commands';
 // You can read more here:
 // https://on.cypress.io/configuration
 // ***********************************************************
+
 // Import commands.js using ES2015 syntax:
 import "./commands";
 

tests/ImportsSeparatedByEmptyRegex/__snapshots__/ppsi.spec.ts.snap

@@ -186,6 +186,7 @@ function add(a:number,b:number) {
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment in this file.
 // I am second line of top level comment in this file.
+
 import thirdParty from "third-party";
 import z from "z";
 
@@ -245,6 +246,7 @@ function add(a:number,b:number) {
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 //@ts-ignore
 // I am file top level comments
+
 import a from "a";
 import c from "c";
 // I am stick to third party comment
@@ -372,6 +374,7 @@ export function givesAFoo3Obj(): AliasFoo3 {
 };
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment in this file.
+
 import thirdDisco0 from "third-disco0";
 import thirdParty0 from "third-party0";
 
@@ -449,6 +452,7 @@ import fourLevelRelativePath from "../../../../fourLevelRelativePath";
 import something from "@server/something";
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment
+
 import abc from "@core/abc";
 import otherthing from "@core/otherthing";
 import something from "@server/something";
@@ -505,6 +509,7 @@ import './commands';
 // You can read more here:
 // https://on.cypress.io/configuration
 // ***********************************************************
+
 // Import commands.js using ES2015 syntax:
 import "./commands";
 

tests/ImportsSeparatedIntoSideEffectGroups/__snapshots__/ppsi.spec.ts.snap

@@ -41,6 +41,7 @@ import thirdDisco2 from "third-disco2";
 import thirdParty2 from "third-party2";
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment in this file.
+
 import thirdDisco0 from "third-disco0";
 import thirdParty0 from "third-party0";
 import otherthing3 from "@core/otherthing3";

tests/ImportsThirdParty/__snapshots__/ppsi.spec.ts.snap

@@ -131,6 +131,7 @@ function add(a:number,b:number) {
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment in this file.
 // I am second line of top level comment in this file.
+
 import abc from "@core/abc";
 import otherthing from "@core/otherthing";
 import qwerty from "@server/qwerty";
@@ -188,6 +189,7 @@ function add(a:number,b:number) {
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 //@ts-ignore
 // I am file top level comments
+
 import otherthing from "@core/otherthing";
 import something from "@server/something";
 import component from "@ui/hello";
@@ -266,6 +268,7 @@ import fourLevelRelativePath from "../../../../fourLevelRelativePath";
 import something from "@server/something";
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // I am top level comment
+
 import abc from "@core/abc";
 import otherthing from "@core/otherthing";
 import something from "@server/something";
@@ -321,6 +324,7 @@ import './commands';
 // You can read more here:
 // https://on.cypress.io/configuration
 // ***********************************************************
+
 // Import commands.js using ES2015 syntax:
 import "./commands";
 

tests/PreserveStrict/__snapshots__/ppsi.spec.ts.snap

@@ -15,11 +15,10 @@ import type { Period } from './Period'
 function foo() {
 }~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // Comment above
-
 /* foo
-   bar  */
-"use strict"; // Comment below
+   bar  */ "use strict";
 
+// Comment below
 "another directive";
 
 import "./SetupEnvironment";
@@ -68,8 +67,8 @@ function foo() {
 }~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 // below is a directive prologue
 "use custom";
-/* more directives... */
 
+/* more directives... */
 "enable typecheck";
 "forbid IE";
 

tests/RemoveStatementsFromOriginalCode/__snapshots__/ppsi.spec.ts.snap

@@ -28,6 +28,7 @@ import { bar } from "a";
 function baz() {
 }~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 /* foo */
+
 import { bar } from "a";
 import { foo } from "c";
 

tests/Vue/__snapshots__/ppsi.spec.ts.snap

@@ -27,6 +27,7 @@ function add(a,b) {
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <script setup>
 // I am top level comment in this file.
+
 import thirdParty from "third-party";
 import { defineComponent } from "vue";
 import z from "z";
@@ -81,6 +82,7 @@ export default defineComponent({
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <script>
 // I am top level comment in this file.
+
 import thirdParty from "third-party";
 import { defineComponent } from "vue";
 import z from "z";
@@ -132,6 +134,7 @@ export default defineComponent({
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <script lang="ts">
 // I am top level comment in this file.
+
 import thirdParty from "third-party";
 import { defineComponent } from "vue";
 import z from "z";
@@ -186,6 +189,7 @@ export default defineComponent({
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <script lang="tsx">
 // I am top level comment in this file.
+
 import thirdParty from "third-party";
 import { defineComponent } from "vue";
 import z from "z";