upgrade jest (#15642)

.depcheckrc.yml

@@ -44,6 +44,8 @@ ignores:
   - 'css-loader'
   - 'sass-loader'
   - 'resolve-url-loader'
+  # jest environments
+  - 'jest-environment-jsdom'
 
 # files depcheck should not parse
 ignorePatterns:

jest.config.js

@@ -44,8 +44,19 @@ module.exports = {
     '<rootDir>/app/scripts/lib/createRPCMethodTrackingMiddleware.test.js',
   ],
   testTimeout: 2500,
-  transform: {
-    '^.+\\.[tj]sx?$': 'babel-jest',
-    '^.+\\.mdx$': '@storybook/addon-docs/jest-transform-mdx',
-  },
+  // We have to specify the environment we are running in, which is jsdom. The
+  // default is 'node'. This can be modified *per file* using a comment at the
+  // head of the file. So it may be worth while to switch to 'node' in any
+  // background tests.
+  testEnvironment: 'jsdom',
+  // Our configuration somehow is calling into the esm folder / files of
+  // some modules. Jest supports ESM but our code is not set to emit ESM files
+  // so we are telling jest to use babel to transform the node_modules listed.
+  // Note: for some reason I could not hammer down to the node_modules
+  // installed in @metamask/controllers so I had to just blanket specify all
+  // of the @metamask/controllers folder.
+  transformIgnorePatterns: [
+    '/node_modules/(?!(multiformats|uuid|nanoid|@metamask/controllers|@metamask/snap-controllers)/)',
+  ],
+  workerIdleMemoryLimit: '500MB',
 };

jest.stories.config.js

@@ -13,4 +13,5 @@ module.exports = {
     '^.+\\.[tj]sx?$': 'babel-jest',
     '^.+\\.mdx$': '@storybook/addon-docs/jest-transform-mdx',
   },
+  testEnvironment: 'jsdom',
 };

lavamoat/browserify/beta/policy.json

@@ -61,11 +61,11 @@
       },
       "packages": {
         "3box>3box-orbitdb-plugins>ipfs-log>json-stringify-deterministic": true,
+        "3box>3box-orbitdb-plugins>ipfs-log>p-each-series": true,
         "3box>3box-orbitdb-plugins>ipfs-log>p-map": true,
         "3box>3box-orbitdb-plugins>ipfs-log>p-whilst": true,
         "3box>orbit-db>orbit-db-io": true,
-        "browserify>buffer": true,
-        "jest>@jest/core>p-each-series": true
+        "browserify>buffer": true
       }
     },
     "3box>3id-resolver": {

lavamoat/browserify/flask/policy.json

@@ -61,11 +61,11 @@
       },
       "packages": {
         "3box>3box-orbitdb-plugins>ipfs-log>json-stringify-deterministic": true,
+        "3box>3box-orbitdb-plugins>ipfs-log>p-each-series": true,
         "3box>3box-orbitdb-plugins>ipfs-log>p-map": true,
         "3box>3box-orbitdb-plugins>ipfs-log>p-whilst": true,
         "3box>orbit-db>orbit-db-io": true,
-        "browserify>buffer": true,
-        "jest>@jest/core>p-each-series": true
+        "browserify>buffer": true
       }
     },
     "3box>3id-resolver": {

lavamoat/browserify/main/policy.json

@@ -61,11 +61,11 @@
       },
       "packages": {
         "3box>3box-orbitdb-plugins>ipfs-log>json-stringify-deterministic": true,
+        "3box>3box-orbitdb-plugins>ipfs-log>p-each-series": true,
         "3box>3box-orbitdb-plugins>ipfs-log>p-map": true,
         "3box>3box-orbitdb-plugins>ipfs-log>p-whilst": true,
         "3box>orbit-db>orbit-db-io": true,
-        "browserify>buffer": true,
-        "jest>@jest/core>p-each-series": true
+        "browserify>buffer": true
       }
     },
     "3box>3id-resolver": {

lavamoat/build-system/policy-override.json

@@ -25,12 +25,18 @@
         "@babel/eslint-parser>semver": true,
         "@babel/parser": true,
         "depcheck>@babel/parser": true,
-        "eslint": true
+        "eslint": true,
+        "lavamoat>lavamoat-tofu>@babel/parser": true
       },
       "globals": {
         "process.versions": true
       }
     },
+    "depcheck>@babel/traverse": {
+      "packages": {
+        "babel/preset-env>b@babel/types": true
+      }
+    },
     "eslint>@eslint/eslintrc": {
       "builtin": {
         "assert": true,

lavamoat/build-system/policy.json

@@ -219,7 +219,8 @@
         "@babel/eslint-parser>semver": true,
         "@babel/parser": true,
         "depcheck>@babel/parser": true,
-        "eslint": true
+        "eslint": true,
+        "lavamoat>lavamoat-tofu>@babel/parser": true
       }
     },
     "@babel/eslint-parser>eslint-scope": {
@@ -2044,6 +2045,7 @@
         "@babel/core>@babel/generator": true,
         "@babel/core>@babel/parser": true,
         "@babel/core>@babel/types": true,
+        "babel/preset-env>b@babel/types": true,
         "depcheck>@babel/traverse>@babel/helper-environment-visitor": true,
         "depcheck>@babel/traverse>@babel/helper-function-name": true,
         "depcheck>@babel/traverse>@babel/helper-hoist-variables": true,
@@ -2072,8 +2074,8 @@
       "packages": {
         "@babel/code-frame": true,
         "depcheck>cosmiconfig>parse-json>error-ex": true,
-        "depcheck>cosmiconfig>parse-json>lines-and-columns": true,
-        "webpack>json-parse-better-errors": true
+        "depcheck>cosmiconfig>parse-json>json-parse-even-better-errors": true,
+        "depcheck>cosmiconfig>parse-json>lines-and-columns": true
       }
     },
     "depcheck>cosmiconfig>parse-json>error-ex": {
@@ -2084,6 +2086,11 @@
         "depcheck>cosmiconfig>parse-json>error-ex>is-arrayish": true
       }
     },
+    "depcheck>cosmiconfig>parse-json>json-parse-even-better-errors": {
+      "globals": {
+        "Buffer.isBuffer": true
+      }
+    },
     "depcheck>cosmiconfig>yaml": {
       "globals": {
         "Buffer": true,
@@ -2785,10 +2792,10 @@
         "eslint-plugin-prettier": true,
         "eslint-plugin-react": true,
         "eslint-plugin-react-hooks": true,
-        "eslint>@eslint/eslintrc>strip-json-comments": true,
         "eslint>ajv": true,
         "eslint>globals": true,
         "eslint>minimatch": true,
+        "eslint>strip-json-comments": true,
         "globby>ignore": true,
         "madge>debug": true
       }
@@ -3672,7 +3679,7 @@
       "packages": {
         "gulp-rtlcss>rtlcss>@choojs/findup": true,
         "gulp-rtlcss>rtlcss>postcss": true,
-        "mocha>strip-json-comments": true
+        "gulp-rtlcss>rtlcss>strip-json-comments": true
       }
     },
     "gulp-rtlcss>rtlcss>@choojs/findup": {

package.json

@@ -274,7 +274,7 @@
     "@testing-library/jest-dom": "^5.11.10",
     "@testing-library/react": "^10.4.8",
     "@testing-library/react-hooks": "^3.2.1",
-    "@testing-library/user-event": "^14.0.0-beta.12",
+    "@testing-library/user-event": "^14.4.3",
     "@tsconfig/node16": "^1.0.3",
     "@types/babelify": "^7.3.7",
     "@types/browserify": "^12.0.37",
@@ -348,8 +348,9 @@
     "history": "^5.0.0",
     "improved-yarn-audit": "^3.0.0",
     "ini": "^3.0.0",
-    "jest": "^26.6.3",
+    "jest": "^29.0.0-alpha.5",
     "jest-canvas-mock": "^2.3.1",
+    "jest-environment-jsdom": "^29.0.0-alpha.4",
     "jest-it-up": "^2.0.2",
     "jsdom": "^11.2.0",
     "koa": "^2.7.0",

patches/@types+jsdom++parse5+7.0.0.patch

@@ -0,0 +1,91 @@
+diff --git a/node_modules/@types/jsdom/node_modules/parse5/dist/index.d.ts b/node_modules/@types/jsdom/node_modules/parse5/dist/index.d.ts
+index 81253d3..d2333bf 100644
+--- a/node_modules/@types/jsdom/node_modules/parse5/dist/index.d.ts
++++ b/node_modules/@types/jsdom/node_modules/parse5/dist/index.d.ts
+@@ -1,10 +1,10 @@
+-import { type ParserOptions } from './parser/index.js';
++import { ParserOptions } from './parser/index.js';
+ import type { DefaultTreeAdapterMap } from './tree-adapters/default.js';
+ import type { TreeAdapterTypeMap } from './tree-adapters/interface.js';
+-export { type DefaultTreeAdapterMap, defaultTreeAdapter } from './tree-adapters/default.js';
++export { DefaultTreeAdapterMap, defaultTreeAdapter } from './tree-adapters/default.js';
+ export type { TreeAdapter, TreeAdapterTypeMap } from './tree-adapters/interface.js';
+-export { type ParserOptions, /** @internal */ Parser } from './parser/index.js';
+-export { serialize, serializeOuter, type SerializerOptions } from './serializer/index.js';
++export { ParserOptions, /** @internal */ Parser } from './parser/index.js';
++export { serialize, serializeOuter, SerializerOptions } from './serializer/index.js';
+ export type { ParserError } from './common/error-codes.js';
+ /** @internal */
+ export * as foreignContent from './common/foreign-content.js';
+@@ -13,7 +13,7 @@ export * as html from './common/html.js';
+ /** @internal */
+ export * as Token from './common/token.js';
+ /** @internal */
+-export { Tokenizer, type TokenizerOptions, TokenizerMode, type TokenHandler } from './tokenizer/index.js';
++export { Tokenizer, TokenizerOptions, TokenizerMode, TokenHandler } from './tokenizer/index.js';
+ /**
+  * Parses an HTML string.
+  *
+diff --git a/node_modules/@types/jsdom/node_modules/parse5/dist/parser/index.d.ts b/node_modules/@types/jsdom/node_modules/parse5/dist/parser/index.d.ts
+index 50a9bd0..df1863e 100644
+--- a/node_modules/@types/jsdom/node_modules/parse5/dist/parser/index.d.ts
++++ b/node_modules/@types/jsdom/node_modules/parse5/dist/parser/index.d.ts
+@@ -1,10 +1,10 @@
+-import { Tokenizer, TokenizerMode, type TokenHandler } from '../tokenizer/index.js';
+-import { OpenElementStack, type StackHandler } from './open-element-stack.js';
++import { Tokenizer, TokenizerMode, TokenHandler } from '../tokenizer/index.js';
++import { OpenElementStack, StackHandler } from './open-element-stack.js';
+ import { FormattingElementList } from './formatting-element-list.js';
+-import { ERR, type ParserErrorHandler } from '../common/error-codes.js';
++import { ERR, ParserErrorHandler } from '../common/error-codes.js';
+ import { TAG_ID as $, NS } from '../common/html.js';
+ import type { TreeAdapter, TreeAdapterTypeMap } from '../tree-adapters/interface.js';
+-import { type Token, type CommentToken, type CharacterToken, type TagToken, type DoctypeToken, type EOFToken, type LocationWithAttributes } from '../common/token.js';
++import { Token, CommentToken, CharacterToken, TagToken, DoctypeToken, EOFToken, LocationWithAttributes } from '../common/token.js';
+ declare enum InsertionMode {
+     INITIAL = 0,
+     BEFORE_HTML = 1,
+diff --git a/node_modules/@types/jsdom/node_modules/parse5/dist/serializer/index.d.ts b/node_modules/@types/jsdom/node_modules/parse5/dist/serializer/index.d.ts
+index d944fae..432464c 100644
+--- a/node_modules/@types/jsdom/node_modules/parse5/dist/serializer/index.d.ts
++++ b/node_modules/@types/jsdom/node_modules/parse5/dist/serializer/index.d.ts
+@@ -1,5 +1,5 @@
+ import type { TreeAdapter, TreeAdapterTypeMap } from '../tree-adapters/interface';
+-import { type DefaultTreeAdapterMap } from '../tree-adapters/default.js';
++import { DefaultTreeAdapterMap } from '../tree-adapters/default.js';
+ export interface SerializerOptions<T extends TreeAdapterTypeMap> {
+     /**
+      * Specifies input tree format.
+diff --git a/node_modules/@types/jsdom/node_modules/parse5/dist/tokenizer/index.d.ts b/node_modules/@types/jsdom/node_modules/parse5/dist/tokenizer/index.d.ts
+index de6e234..89e2484 100644
+--- a/node_modules/@types/jsdom/node_modules/parse5/dist/tokenizer/index.d.ts
++++ b/node_modules/@types/jsdom/node_modules/parse5/dist/tokenizer/index.d.ts
+@@ -1,6 +1,6 @@
+ import { Preprocessor } from './preprocessor.js';
+-import { type CharacterToken, type DoctypeToken, type TagToken, type EOFToken, type CommentToken } from '../common/token.js';
+-import { type ParserErrorHandler } from '../common/error-codes.js';
++import { CharacterToken, DoctypeToken, TagToken, EOFToken, CommentToken } from '../common/token.js';
++import { ParserErrorHandler } from '../common/error-codes.js';
+ declare const enum State {
+     DATA = 0,
+     RCDATA = 1,
+diff --git a/node_modules/@types/jsdom/node_modules/parse5/dist/tokenizer/preprocessor.d.ts b/node_modules/@types/jsdom/node_modules/parse5/dist/tokenizer/preprocessor.d.ts
+index e74a590..d145dcc 100644
+--- a/node_modules/@types/jsdom/node_modules/parse5/dist/tokenizer/preprocessor.d.ts
++++ b/node_modules/@types/jsdom/node_modules/parse5/dist/tokenizer/preprocessor.d.ts
+@@ -1,4 +1,4 @@
+-import { ERR, type ParserError, type ParserErrorHandler } from '../common/error-codes.js';
++import { ERR, ParserError, ParserErrorHandler } from '../common/error-codes.js';
+ export declare class Preprocessor {
+     private handler;
+     html: string;
+diff --git a/node_modules/@types/jsdom/node_modules/parse5/dist/tree-adapters/default.d.ts b/node_modules/@types/jsdom/node_modules/parse5/dist/tree-adapters/default.d.ts
+index cccdf8f..d70b8fa 100644
+--- a/node_modules/@types/jsdom/node_modules/parse5/dist/tree-adapters/default.d.ts
++++ b/node_modules/@types/jsdom/node_modules/parse5/dist/tree-adapters/default.d.ts
+@@ -1,4 +1,4 @@
+-import { DOCUMENT_MODE, type NS } from '../common/html.js';
++import { DOCUMENT_MODE, NS } from '../common/html.js';
+ import type { Attribute, Location, ElementLocation } from '../common/token.js';
+ import type { TreeAdapter, TreeAdapterTypeMap } from './interface.js';
+ export declare enum NodeType {

test/helpers/setup-helper.js

@@ -57,6 +57,12 @@ global.Element = window.Element;
 // required by `react-popper`
 global.HTMLElement = window.HTMLElement;
 
+// Jest no longer adds the following timers so we use set/clear Timeouts
+global.setImmediate =
+  global.setImmediate || ((fn, ...args) => global.setTimeout(fn, 0, ...args));
+global.clearImmediate =
+  global.clearImmediate || ((id) => global.clearTimeout(id));
+
 // required by any components anchored on `popover-content`
 const popoverContent = window.document.createElement('div');
 popoverContent.setAttribute('id', 'popover-content');

ui/components/app/transaction-list-item/transaction-list-item.component.test.js

@@ -101,7 +101,7 @@ describe('TransactionListItem', () => {
     });
 
     afterAll(() => {
-      useGasFeeEstimates.restore();
+      useGasFeeEstimates.mockRestore();
     });
 
     it(`should indicate account has insufficient funds to cover gas price for cancellation of pending transaction`, () => {

ui/components/ui/button/button.stories.test.js

@@ -1,12 +0,0 @@
-/* eslint-disable jest/require-top-level-describe */
-import React from 'react';
-
-import { render, screen } from '@testing-library/react';
-
-import '@testing-library/jest-dom/extend-expect';
-import { DefaultStory } from './button.stories';
-
-it('renders the button in the primary state', () => {
-  render(<DefaultStory {...DefaultStory.args} />);
-  expect(screen.getByRole('button')).toHaveTextContent('Default');
-});

ui/pages/first-time-flow/metametrics-opt-in/metametrics-opt-in.test.js

@@ -6,9 +6,6 @@ import MetaMetricsOptIn from './metametrics-opt-in.container';
 
 describe('MetaMetricsOptIn', () => {
   it('opt out of MetaMetrics', () => {
-    afterEach(() => {
-      sinon.resetHistory();
-    });
     const props = {
       history: {
         push: sinon.spy(),
@@ -23,5 +20,6 @@ describe('MetaMetricsOptIn', () => {
     expect(
       props.setParticipateInMetaMetrics.calledOnceWithExactly(false),
     ).toStrictEqual(true);
+    sinon.resetHistory();
   });
 });