Skip to content

Commit

Permalink
chore(deps-dev): upgrade to jest 28 (#35334)
Browse files Browse the repository at this point in the history
  • Loading branch information
afc163 committed May 9, 2022
1 parent 0f63293 commit ed4d416
Show file tree
Hide file tree
Showing 9 changed files with 180 additions and 19 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/preview-build.yml
Expand Up @@ -30,7 +30,7 @@ jobs:
key: lock-${{ github.sha }}

- name: create package-lock.json
run: npm i --package-lock-only --ignore-scripts
run: npm i --package-lock-only --ignore-scripts --legacy-peer-deps

- name: hack for single file
run: |
Expand Down
2 changes: 1 addition & 1 deletion .github/workflows/site-deploy.yml
Expand Up @@ -22,7 +22,7 @@ jobs:
key: lock-${{ github.sha }}

- name: create package-lock.json
run: npm i --package-lock-only --ignore-scripts
run: npm i --package-lock-only --ignore-scripts --legacy-peer-deps

- name: hack for single file
run: |
Expand Down
2 changes: 1 addition & 1 deletion .github/workflows/test.yml
Expand Up @@ -26,7 +26,7 @@ jobs:
key: lock-${{ github.sha }}

- name: create package-lock.json
run: npm i --package-lock-only --ignore-scripts
run: npm i --package-lock-only --ignore-scripts --legacy-peer-deps

- name: hack for single file
run: |
Expand Down
2 changes: 1 addition & 1 deletion .github/workflows/ui.yml
Expand Up @@ -28,7 +28,7 @@ jobs:
node-version: '16'

- name: create package-lock.json
run: npm i --package-lock-only --ignore-scripts
run: npm i --package-lock-only --ignore-scripts --legacy-peer-deps

- name: hack for single file
run: |
Expand Down
18 changes: 10 additions & 8 deletions .jest.js
Expand Up @@ -20,13 +20,13 @@ module.exports = {
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'md'],
modulePathIgnorePatterns: ['/_site/'],
moduleNameMapper: {
'^dnd-core$': 'dnd-core/dist/cjs',
'^react-dnd$': 'react-dnd/dist/cjs',
'^react-dnd-html5-backend$': 'react-dnd-html5-backend/dist/cjs',
'^react-dnd-touch-backend$': 'react-dnd-touch-backend/dist/cjs',
'^react-dnd-test-backend$': 'react-dnd-test-backend/dist/cjs',
'^react-dnd-test-utils$': 'react-dnd-test-utils/dist/cjs',
'\\.(css|less)$': 'identity-obj-proxy',
'/^dnd-core$/': 'dnd-core/dist/cjs',
'/^react-dnd$/': 'react-dnd/dist/cjs',
'/^react-dnd-html5-backend$/': 'react-dnd-html5-backend/dist/cjs',
'/^react-dnd-touch-backend$/': 'react-dnd-touch-backend/dist/cjs',
'/^react-dnd-test-backend$/': 'react-dnd-test-backend/dist/cjs',
'/^react-dnd-test-utils$/': 'react-dnd-test-utils/dist/cjs',
'/\\.(css|less)$/': 'identity-obj-proxy',
},
testPathIgnorePatterns: ['/node_modules/', 'dekko', 'node', 'image.test.js', 'image.test.ts'],
transform: {
Expand All @@ -52,5 +52,7 @@ module.exports = {
tsConfig: './tsconfig.test.json',
},
},
testURL: 'http://localhost',
testEnvironmentOptions: {
url: 'http://localhost',
},
};
13 changes: 7 additions & 6 deletions package.json
Expand Up @@ -159,9 +159,9 @@
"scroll-into-view-if-needed": "^2.2.25"
},
"devDependencies": {
"@ant-design/bisheng-plugin": "^3.0.1",
"@ant-design/bisheng-plugin": "^3.2.0",
"@ant-design/hitu": "^0.0.0-alpha.13",
"@ant-design/tools": "^14.0.2",
"@ant-design/tools": "^15.0.0",
"@docsearch/css": "^3.0.0",
"@qixian.cs/github-contributors-list": "^1.0.3",
"@stackblitz/sdk": "^1.3.0",
Expand All @@ -187,7 +187,7 @@
"antd-img-crop": "^4.0.0",
"array-move": "^4.0.0",
"babel-plugin-add-react-displayname": "^0.0.5",
"bisheng": "^3.3.0",
"bisheng": "^3.5.0",
"bisheng-plugin-description": "^0.1.4",
"bisheng-plugin-react": "^1.2.0",
"bisheng-plugin-toc": "^0.4.4",
Expand Down Expand Up @@ -230,10 +230,11 @@
"inquirer": "^8.0.0",
"intersection-observer": "^0.12.0",
"isomorphic-fetch": "^3.0.0",
"jest": "^27.0.3",
"jest": "^28.0.3",
"jest-axe": "^6.0.0",
"jest-environment-node": "^27.4.4",
"jest-image-snapshot": "^4.5.1",
"jest-environment-jsdom": "^28.0.2",
"jest-environment-node": "^28.0.2",
"@ant-design/jest-image-snapshot": "^4.5.2",
"jest-puppeteer": "^6.0.0",
"jquery": "^3.4.1",
"jsdom": "^19.0.0",
Expand Down
13 changes: 13 additions & 0 deletions tests/setup.js
@@ -1,4 +1,6 @@
const React = require('react');
const util = require('util');

const { _rs: onLibResize } = require('rc-resize-observer/lib/utils/observerUtil');
const { _rs: onEsResize } = require('rc-resize-observer/es/utils/observerUtil');

Expand Down Expand Up @@ -34,6 +36,17 @@ if (typeof window !== 'undefined') {
// https://github.com/yiminghe/css-animation/blob/a5986d73fd7dfce75665337f39b91483d63a4c8c/src/Event.js#L44
window.AnimationEvent = window.AnimationEvent || window.Event;
window.TransitionEvent = window.TransitionEvent || window.Event;

// ref: https://jestjs.io/docs/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom
// ref: https://github.com/jsdom/jsdom/issues/2524
Object.defineProperty(window, 'TextEncoder', {
writable: true,
value: util.TextEncoder,
});
Object.defineProperty(window, 'TextDecoder', {
writable: true,
value: util.TextDecoder,
});
}

const Enzyme = require('enzyme');
Expand Down
2 changes: 1 addition & 1 deletion tests/shared/imageTest.tsx
@@ -1,7 +1,7 @@
import React from 'react';
// Reference: https://github.com/ant-design/ant-design/pull/24003#discussion_r427267386
// eslint-disable-next-line import/no-unresolved
import { configureToMatchImageSnapshot } from 'jest-image-snapshot';
import { configureToMatchImageSnapshot } from '@ant-design/jest-image-snapshot';
import ReactDOMServer from 'react-dom/server';
import glob from 'glob';
import MockDate from 'mockdate';
Expand Down
145 changes: 145 additions & 0 deletions typings/jest-image-snapshot.d.ts
@@ -0,0 +1,145 @@
// Type definitions for jest-image-snapshot 4.3
// Project: https://github.com/americanexpress/jest-image-snapshot#readme
// Definitions by: Janeene Beeforth <https://github.com/dawnmist>
// erbridge <https://github.com/erbridge>
// Piotr Błażejewicz <https://github.com/peterblazejewicz>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
// TypeScript Version: 3.8

/// <reference types="jest" />

declare module '@ant-design/jest-image-snapshot' {
import { PixelmatchOptions } from 'pixelmatch';
import { Options as SSIMOptions } from 'ssim.js';

export interface MatchImageSnapshotOptions {
/**
* If set to true, the build will not fail when the screenshots to compare have different sizes.
*
* @default false
*/
allowSizeMismatch?: boolean | undefined;
/** Custom config passed to 'pixelmatch' or 'ssim' */
customDiffConfig?: PixelmatchOptions | Partial<SSIMOptions> | undefined;
/**
* The method by which images are compared. `pixelmatch` does a pixel by pixel comparison,
* whereas `ssim` does a structural similarity comparison.
*
* @default 'pixelmatch'
*/
comparisonMethod?: 'pixelmatch' | 'ssim' | undefined;
/** Custom snapshots directory. Absolute path of a directory to keep the snapshot in. */
customSnapshotsDir?: string | undefined;
/** A custom absolute path of a directory to keep this diff in */
customDiffDir?: string | undefined;
/**
* A custom name to give this snapshot. If not provided, one is computed automatically. When a
* function is provided it is called with an object containing testPath, currentTestName,
* counter and defaultIdentifier as its first argument. The function must return an identifier
* to use for the snapshot.
*/
customSnapshotIdentifier?:
| ((parameters: {
testPath: string;
currentTestName: string;
counter: number;
defaultIdentifier: string;
}) => string)
| string
| undefined;
/**
* Changes diff image layout direction.
*
* @default 'horizontal'
*/
diffDirection?: 'horizontal' | 'vertical' | undefined;
/**
* Will output base64 string of a diff image to console in case of failed tests (in addition to
* creating a diff image). This string can be copy-pasted to a browser address string to preview
* the diff for a failed test.
*
* @default false
*/
dumpDiffToConsole?: boolean | undefined;
/**
* Will output the image to the terminal using iTerm's Inline Images Protocol. If the term is
* not compatible, it does the same thing as `dumpDiffToConsole`.
*
* @default false
*/
dumpInlineDiffToConsole?: boolean | undefined;
/**
* Removes coloring from the console output, useful if storing the results to a file.
*
* @default false
*/
noColors?: boolean | undefined;
/**
* Sets the threshold that would trigger a test failure based on the failureThresholdType
* selected. This is different to the customDiffConfig.threshold above - the
* customDiffConfig.threshold is the per pixel failure threshold, whereas this is the failure
* threshold for the entire comparison.
*
* @default 0
*/
failureThreshold?: number | undefined;
/**
* Sets the type of threshold that would trigger a failure.
*
* @default 'pixel'
*/
failureThresholdType?: 'pixel' | 'percent' | undefined;
/**
* Updates a snapshot even if it passed the threshold against the existing one.
*
* @default false
*/
updatePassedSnapshot?: boolean | undefined;
/**
* Applies Gaussian Blur on compared images, accepts radius in pixels as value. Useful when you
* have noise after scaling images per different resolutions on your target website, usually
* setting its value to 1-2 should be enough to solve that problem.
*
* @default 0
*/
blur?: number | undefined;
/**
* Runs the diff in process without spawning a child process.
*
* @default false
*/
runInProcess?: boolean | undefined;
}

/**
* Function to be passed to jest's expect.extend. Example: import { toMatchImageSnapshot } from
* 'jest-image-snapshot'; expect.extend({ toMatchImageSnapshot });
*/
export function toMatchImageSnapshot(options?: MatchImageSnapshotOptions): {
message(): string;
pass: boolean;
};

/**
* Configurable function that can be passed to jest's expect.extend. Example: import {
* configureToMatchImageSnapshot } from 'jest-image-snapshot'; const toMatchImageSnapshot =
* configureToMatchImageSnapshot({ noColors: true }); expect.extend({ toMatchImageSnapshot });
*/
export function configureToMatchImageSnapshot(
options: MatchImageSnapshotOptions,
): () => { message(): string; pass: boolean };

/** Mutates original state with new state */
export function updateSnapshotState<TObject, TPartial>(
originalSnapshotState: TObject,
partialSnapshotState: TPartial,
): TObject & TPartial;

declare global {
namespace jest {
interface Matchers<R, T> {
toMatchImageSnapshot(options?: MatchImageSnapshotOptions): R;
}
}
}
}

0 comments on commit ed4d416

Please sign in to comment.