chore: upgrade to jest 27 (#30783)

* chore: upgrade devDeps

* upgrade @ant-design/tools

* support  CSS Minification

* test: jsdom as testEnvironment

* fix setImmediate

* update snapshot

* fix test

* fix test

* fix test

* fix test

.jest.js

@@ -14,6 +14,7 @@ function getTestRegex(libDir) {
 
 module.exports = {
   verbose: true,
+  testEnvironment: 'jsdom',
   setupFiles: ['./tests/setup.js'],
   setupFilesAfterEnv: ['./tests/setupAfterEnv.ts'],
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'md'],

components/badge/__tests__/__snapshots__/index.test.js.snap

@@ -202,11 +202,70 @@ exports[`Badge should render when count is changed 1`] = `
     </span>
     <span
       class="ant-scroll-number-only"
-      style="transition: none;"
+      style="transform: translateY(-100%);"
     >
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -900%; left: 0px;"
+      >
+        0
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -800%; left: 0px;"
+      >
+        1
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -700%; left: 0px;"
+      >
+        2
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -600%; left: 0px;"
+      >
+        3
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -500%; left: 0px;"
+      >
+        4
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -400%; left: 0px;"
+      >
+        5
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -300%; left: 0px;"
+      >
+        6
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -200%; left: 0px;"
+      >
+        7
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -100%; left: 0px;"
+      >
+        8
+      </p>
       <p
         class="ant-scroll-number-only-unit current"
-        style=""
+      >
+        9
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 100%; left: 0px;"
       >
         0
       </p>
@@ -236,11 +295,70 @@ exports[`Badge should render when count is changed 2`] = `
     </span>
     <span
       class="ant-scroll-number-only"
-      style="transition: none;"
+      style="transform: translateY(-100%);"
     >
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -900%; left: 0px;"
+      >
+        1
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -800%; left: 0px;"
+      >
+        2
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -700%; left: 0px;"
+      >
+        3
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -600%; left: 0px;"
+      >
+        4
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -500%; left: 0px;"
+      >
+        5
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -400%; left: 0px;"
+      >
+        6
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -300%; left: 0px;"
+      >
+        7
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -200%; left: 0px;"
+      >
+        8
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -100%; left: 0px;"
+      >
+        9
+      </p>
       <p
         class="ant-scroll-number-only-unit current"
-        style=""
+      >
+        0
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 100%; left: 0px;"
       >
         1
       </p>
@@ -341,11 +459,70 @@ exports[`Badge should render when count is changed 6`] = `
   >
     <span
       class="ant-scroll-number-only"
-      style="transition: none;"
+      style="transform: translateY(100%);"
     >
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: -100%; left: 0px;"
+      >
+        9
+      </p>
       <p
         class="ant-scroll-number-only-unit current"
-        style=""
+      >
+        0
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 100%; left: 0px;"
+      >
+        1
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 200%; left: 0px;"
+      >
+        2
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 300%; left: 0px;"
+      >
+        3
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 400%; left: 0px;"
+      >
+        4
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 500%; left: 0px;"
+      >
+        5
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 600%; left: 0px;"
+      >
+        6
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 700%; left: 0px;"
+      >
+        7
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 800%; left: 0px;"
+      >
+        8
+      </p>
+      <p
+        class="ant-scroll-number-only-unit"
+        style="position: absolute; top: 900%; left: 0px;"
       >
         9
       </p>

components/config-provider/__tests__/form.test.js

@@ -6,6 +6,14 @@ import zhCN from '../../locale/zh_CN';
 import Form from '../../form';
 
 describe('ConfigProvider.Form', () => {
+  beforeAll(() => {
+    jest.useFakeTimers();
+  });
+
+  afterAll(() => {
+    jest.useRealTimers();
+  });
+
   describe('form validateMessages', () => {
     const wrapperComponent = ({ validateMessages }) => {
       const formRef = React.createRef();
@@ -26,14 +34,6 @@ describe('ConfigProvider.Form', () => {
       return [wrapper, formRef];
     };
 
-    beforeEach(() => {
-      jest.useFakeTimers();
-    });
-
-    afterEach(() => {
-      jest.useRealTimers();
-    });
-
     it('set locale zhCN', async () => {
       const [wrapper, formRef] = wrapperComponent({});
 

components/menu/__tests__/index.test.js

@@ -66,6 +66,14 @@ describe('Menu', () => {
   window.requestAnimationFrame = callback => window.setTimeout(callback, 16);
   window.cancelAnimationFrame = window.clearTimeout;
 
+  beforeAll(() => {
+    jest.useFakeTimers();
+  });
+
+  afterAll(() => {
+    jest.useRealTimers();
+  });
+
   mountTest(() => (
     <Menu>
       <Menu.Item />
@@ -107,12 +115,10 @@ describe('Menu', () => {
   beforeEach(() => {
     div = document.createElement('div');
     document.body.appendChild(div);
-    jest.useFakeTimers();
   });
 
   afterEach(() => {
     document.body.removeChild(div);
-    jest.useRealTimers();
   });
 
   it('If has select nested submenu item ,the menu items on the grandfather level should be highlight', () => {
@@ -416,14 +422,6 @@ describe('Menu', () => {
   });
 
   describe('open submenu when click submenu title', () => {
-    beforeEach(() => {
-      jest.useFakeTimers();
-    });
-
-    afterEach(() => {
-      jest.useRealTimers();
-    });
-
     const toggleMenu = (wrapper, index, event) => {
       wrapper.find('.ant-menu-submenu-title').at(index).simulate(event);
       jest.runAllTimers();

components/select/__tests__/index.test.js

@@ -18,8 +18,8 @@ describe('Select', () => {
     act(() => {
       wrapper.find('.ant-select-selector').simulate('mousedown');
       jest.runAllTimers();
-      wrapper.update();
     });
+    wrapper.update();
   }
 
   beforeEach(() => {

components/statistic/__tests__/index.test.js

@@ -126,8 +126,8 @@ describe('Statistic', () => {
         };
         const wrapper = mount(<Statistic.Countdown value={deadline} onChange={onChange} />);
         wrapper.update();
-        await sleep(100)
-        expect(remainingTime).toBeGreaterThan(0)
+        await sleep(100);
+        expect(remainingTime).toBeGreaterThan(0);
       });
     });
 
@@ -145,17 +145,13 @@ describe('Statistic', () => {
       });
 
       it('called if finished', async () => {
-        jest.useFakeTimers();
         const now = Date.now() + 10;
         const onFinish = jest.fn();
         const wrapper = mount(<Statistic.Countdown value={now} onFinish={onFinish} />);
         wrapper.update();
-
         MockDate.set(moment('2019-11-28 00:00:00').valueOf());
-        jest.runAllTimers();
-
+        await sleep(100);
         expect(onFinish).toHaveBeenCalled();
-        jest.useFakeTimers();
       });
     });
   });

components/tree/__tests__/__snapshots__/directory.test.js.snap

@@ -1145,7 +1145,104 @@ exports[`Directory Tree expand click 2`] = `
           <div
             class="ant-tree-treenode-motion ant-motion-collapse-leave ant-motion-collapse-leave-start ant-motion-collapse"
             style="height: 0px;"
-          />
+          >
+            <div
+              class="ant-tree-treenode ant-tree-treenode-switcher-close"
+            >
+              <span
+                aria-hidden="true"
+                class="ant-tree-indent"
+              >
+                <span
+                  class="ant-tree-indent-unit ant-tree-indent-unit-start"
+                />
+              </span>
+              <span
+                class="ant-tree-switcher ant-tree-switcher-noop"
+              />
+              <span
+                class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
+                title="---"
+              >
+                <span
+                  class="ant-tree-iconEle ant-tree-icon__customize"
+                >
+                  <span
+                    aria-label="folder"
+                    class="anticon anticon-folder"
+                    role="img"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      data-icon="folder"
+                      fill="currentColor"
+                      focusable="false"
+                      height="1em"
+                      viewBox="64 64 896 896"
+                      width="1em"
+                    >
+                      <path
+                        d="M880 298.4H521L403.7 186.2a8.15 8.15 0 00-5.5-2.2H144c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V330.4c0-17.7-14.3-32-32-32zM840 768H184V256h188.5l119.6 114.4H840V768z"
+                      />
+                    </svg>
+                  </span>
+                </span>
+                <span
+                  class="ant-tree-title"
+                >
+                  ---
+                </span>
+              </span>
+            </div>
+            <div
+              class="ant-tree-treenode ant-tree-treenode-switcher-close ant-tree-treenode-leaf-last"
+            >
+              <span
+                aria-hidden="true"
+                class="ant-tree-indent"
+              >
+                <span
+                  class="ant-tree-indent-unit ant-tree-indent-unit-start"
+                />
+              </span>
+              <span
+                class="ant-tree-switcher ant-tree-switcher-noop"
+              />
+              <span
+                class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
+                title="---"
+              >
+                <span
+                  class="ant-tree-iconEle ant-tree-icon__customize"
+                >
+                  <span
+                    aria-label="folder"
+                    class="anticon anticon-folder"
+                    role="img"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      data-icon="folder"
+                      fill="currentColor"
+                      focusable="false"
+                      height="1em"
+                      viewBox="64 64 896 896"
+                      width="1em"
+                    >
+                      <path
+                        d="M880 298.4H521L403.7 186.2a8.15 8.15 0 00-5.5-2.2H144c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V330.4c0-17.7-14.3-32-32-32zM840 768H184V256h188.5l119.6 114.4H840V768z"
+                      />
+                    </svg>
+                  </span>
+                </span>
+                <span
+                  class="ant-tree-title"
+                >
+                  ---
+                </span>
+              </span>
+            </div>
+          </div>
           <div
             class="ant-tree-treenode ant-tree-treenode-switcher-close ant-tree-treenode-leaf-last"
           >
@@ -1596,7 +1693,104 @@ exports[`Directory Tree expand double click 2`] = `
           <div
             class="ant-tree-treenode-motion ant-motion-collapse-leave ant-motion-collapse-leave-start ant-motion-collapse"
             style="height: 0px;"
-          />
+          >
+            <div
+              class="ant-tree-treenode ant-tree-treenode-switcher-close"
+            >
+              <span
+                aria-hidden="true"
+                class="ant-tree-indent"
+              >
+                <span
+                  class="ant-tree-indent-unit ant-tree-indent-unit-start"
+                />
+              </span>
+              <span
+                class="ant-tree-switcher ant-tree-switcher-noop"
+              />
+              <span
+                class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
+                title="---"
+              >
+                <span
+                  class="ant-tree-iconEle ant-tree-icon__customize"
+                >
+                  <span
+                    aria-label="folder"
+                    class="anticon anticon-folder"
+                    role="img"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      data-icon="folder"
+                      fill="currentColor"
+                      focusable="false"
+                      height="1em"
+                      viewBox="64 64 896 896"
+                      width="1em"
+                    >
+                      <path
+                        d="M880 298.4H521L403.7 186.2a8.15 8.15 0 00-5.5-2.2H144c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V330.4c0-17.7-14.3-32-32-32zM840 768H184V256h188.5l119.6 114.4H840V768z"
+                      />
+                    </svg>
+                  </span>
+                </span>
+                <span
+                  class="ant-tree-title"
+                >
+                  ---
+                </span>
+              </span>
+            </div>
+            <div
+              class="ant-tree-treenode ant-tree-treenode-switcher-close ant-tree-treenode-leaf-last"
+            >
+              <span
+                aria-hidden="true"
+                class="ant-tree-indent"
+              >
+                <span
+                  class="ant-tree-indent-unit ant-tree-indent-unit-start"
+                />
+              </span>
+              <span
+                class="ant-tree-switcher ant-tree-switcher-noop"
+              />
+              <span
+                class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
+                title="---"
+              >
+                <span
+                  class="ant-tree-iconEle ant-tree-icon__customize"
+                >
+                  <span
+                    aria-label="folder"
+                    class="anticon anticon-folder"
+                    role="img"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      data-icon="folder"
+                      fill="currentColor"
+                      focusable="false"
+                      height="1em"
+                      viewBox="64 64 896 896"
+                      width="1em"
+                    >
+                      <path
+                        d="M880 298.4H521L403.7 186.2a8.15 8.15 0 00-5.5-2.2H144c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V330.4c0-17.7-14.3-32-32-32zM840 768H184V256h188.5l119.6 114.4H840V768z"
+                      />
+                    </svg>
+                  </span>
+                </span>
+                <span
+                  class="ant-tree-title"
+                >
+                  ---
+                </span>
+              </span>
+            </div>
+          </div>
           <div
             class="ant-tree-treenode ant-tree-treenode-switcher-close ant-tree-treenode-leaf-last"
           >
@@ -1771,57 +1965,52 @@ exports[`Directory Tree expand with state control click 1`] = `
             </span>
           </div>
           <div
-            class="ant-tree-treenode-motion ant-motion-collapse-appear ant-motion-collapse-appear-start ant-motion-collapse"
-            style="height: 0px; opacity: 0;"
+            class="ant-tree-treenode ant-tree-treenode-switcher-close ant-tree-treenode-leaf-last"
           >
-            <div
-              class="ant-tree-treenode ant-tree-treenode-switcher-close ant-tree-treenode-leaf-last"
+            <span
+              aria-hidden="true"
+              class="ant-tree-indent"
             >
               <span
-                aria-hidden="true"
-                class="ant-tree-indent"
-              >
-                <span
-                  class="ant-tree-indent-unit ant-tree-indent-unit-start ant-tree-indent-unit-end"
-                />
-              </span>
-              <span
-                class="ant-tree-switcher ant-tree-switcher-noop"
+                class="ant-tree-indent-unit ant-tree-indent-unit-start ant-tree-indent-unit-end"
               />
+            </span>
+            <span
+              class="ant-tree-switcher ant-tree-switcher-noop"
+            />
+            <span
+              class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
+              title="children"
+            >
               <span
-                class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
-                title="children"
+                class="ant-tree-iconEle ant-tree-icon__customize"
               >
                 <span
-                  class="ant-tree-iconEle ant-tree-icon__customize"
+                  aria-label="folder"
+                  class="anticon anticon-folder"
+                  role="img"
                 >
-                  <span
-                    aria-label="folder"
-                    class="anticon anticon-folder"
-                    role="img"
+                  <svg
+                    aria-hidden="true"
+                    data-icon="folder"
+                    fill="currentColor"
+                    focusable="false"
+                    height="1em"
+                    viewBox="64 64 896 896"
+                    width="1em"
                   >
-                    <svg
-                      aria-hidden="true"
-                      data-icon="folder"
-                      fill="currentColor"
-                      focusable="false"
-                      height="1em"
-                      viewBox="64 64 896 896"
-                      width="1em"
-                    >
-                      <path
-                        d="M880 298.4H521L403.7 186.2a8.15 8.15 0 00-5.5-2.2H144c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V330.4c0-17.7-14.3-32-32-32zM840 768H184V256h188.5l119.6 114.4H840V768z"
-                      />
-                    </svg>
-                  </span>
-                </span>
-                <span
-                  class="ant-tree-title"
-                >
-                  children
+                    <path
+                      d="M880 298.4H521L403.7 186.2a8.15 8.15 0 00-5.5-2.2H144c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V330.4c0-17.7-14.3-32-32-32zM840 768H184V256h188.5l119.6 114.4H840V768z"
+                    />
+                  </svg>
                 </span>
               </span>
-            </div>
+              <span
+                class="ant-tree-title"
+              >
+                children
+              </span>
+            </span>
           </div>
         </div>
       </div>
@@ -1933,57 +2122,52 @@ exports[`Directory Tree expand with state control doubleClick 1`] = `
             </span>
           </div>
           <div
-            class="ant-tree-treenode-motion ant-motion-collapse-appear ant-motion-collapse-appear-start ant-motion-collapse"
-            style="height: 0px; opacity: 0;"
+            class="ant-tree-treenode ant-tree-treenode-switcher-close ant-tree-treenode-leaf-last"
           >
-            <div
-              class="ant-tree-treenode ant-tree-treenode-switcher-close ant-tree-treenode-leaf-last"
+            <span
+              aria-hidden="true"
+              class="ant-tree-indent"
             >
               <span
-                aria-hidden="true"
-                class="ant-tree-indent"
-              >
-                <span
-                  class="ant-tree-indent-unit ant-tree-indent-unit-start ant-tree-indent-unit-end"
-                />
-              </span>
-              <span
-                class="ant-tree-switcher ant-tree-switcher-noop"
+                class="ant-tree-indent-unit ant-tree-indent-unit-start ant-tree-indent-unit-end"
               />
+            </span>
+            <span
+              class="ant-tree-switcher ant-tree-switcher-noop"
+            />
+            <span
+              class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
+              title="children"
+            >
               <span
-                class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
-                title="children"
+                class="ant-tree-iconEle ant-tree-icon__customize"
               >
                 <span
-                  class="ant-tree-iconEle ant-tree-icon__customize"
+                  aria-label="folder"
+                  class="anticon anticon-folder"
+                  role="img"
                 >
-                  <span
-                    aria-label="folder"
-                    class="anticon anticon-folder"
-                    role="img"
+                  <svg
+                    aria-hidden="true"
+                    data-icon="folder"
+                    fill="currentColor"
+                    focusable="false"
+                    height="1em"
+                    viewBox="64 64 896 896"
+                    width="1em"
                   >
-                    <svg
-                      aria-hidden="true"
-                      data-icon="folder"
-                      fill="currentColor"
-                      focusable="false"
-                      height="1em"
-                      viewBox="64 64 896 896"
-                      width="1em"
-                    >
-                      <path
-                        d="M880 298.4H521L403.7 186.2a8.15 8.15 0 00-5.5-2.2H144c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V330.4c0-17.7-14.3-32-32-32zM840 768H184V256h188.5l119.6 114.4H840V768z"
-                      />
-                    </svg>
-                  </span>
-                </span>
-                <span
-                  class="ant-tree-title"
-                >
-                  children
+                    <path
+                      d="M880 298.4H521L403.7 186.2a8.15 8.15 0 00-5.5-2.2H144c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V330.4c0-17.7-14.3-32-32-32zM840 768H184V256h188.5l119.6 114.4H840V768z"
+                    />
+                  </svg>
                 </span>
               </span>
-            </div>
+              <span
+                class="ant-tree-title"
+              >
+                children
+              </span>
+            </span>
           </div>
         </div>
       </div>

components/typography/__tests__/index.test.js

@@ -30,8 +30,10 @@ describe('Typography', () => {
   const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
 
   // Mock offsetHeight
-  const originOffsetHeight = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'offsetHeight')
-    .get;
+  const originOffsetHeight = Object.getOwnPropertyDescriptor(
+    HTMLElement.prototype,
+    'offsetHeight',
+  ).get;
   Object.defineProperty(HTMLElement.prototype, 'offsetHeight', {
     get() {
       let html = this.innerHTML;
@@ -333,6 +335,7 @@ describe('Typography', () => {
           }
 
           jest.useFakeTimers();
+          wrapper.find('.ant-typography-copy').first().simulate('click');
           jest.runAllTimers();
           wrapper.update();
 

components/upload/__tests__/upload.test.js

@@ -433,7 +433,7 @@ describe('Upload', () => {
 
     wrapper.find('div.ant-upload-list-item .anticon-delete').simulate('click');
 
-    setImmediate(() => {
+    setTimeout(() => {
       wrapper.update();
 
       expect(mockRemove).toHaveBeenCalled();
@@ -499,7 +499,7 @@ describe('Upload', () => {
 
     wrapper.find('div.ant-upload-list-item .anticon-download').simulate('click');
 
-    setImmediate(() => {
+    setTimeout(() => {
       wrapper.update();
 
       expect(props.fileList).toHaveLength(1);

package.json

@@ -153,12 +153,12 @@
   "devDependencies": {
     "@ant-design/bisheng-plugin": "^2.3.0",
     "@ant-design/hitu": "^0.0.0-alpha.13",
-    "@ant-design/tools": "^13.4.0",
+    "@ant-design/tools": "^13.4.1-beta.0",
     "@qixian.cs/github-contributors-list": "^1.0.3",
     "@stackblitz/sdk": "^1.3.0",
     "@types/classnames": "^2.2.8",
     "@types/enzyme": "^3.10.5",
-    "@types/gtag.js": "^0.0.4",
+    "@types/gtag.js": "^0.0.5",
     "@types/jest": "^26.0.0",
     "@types/jest-environment-puppeteer": "^4.4.0",
     "@types/jest-image-snapshot": "^4.1.0",
@@ -188,14 +188,12 @@
     "cheerio": "^1.0.0-rc.3",
     "concurrently": "^6.0.0",
     "cross-env": "^7.0.0",
-    "css-minimizer-webpack-plugin": "^1.1.1",
-    "css-split-webpack-plugin": "^0.2.6",
     "dekko": "^0.2.1",
     "docsearch.js": "^2.6.3",
     "enquire-js": "^0.2.1",
     "enzyme": "^3.10.0",
     "enzyme-to-json": "^3.6.0",
-    "esbuild-loader": "^2.7.0",
+    "esbuild-loader": "^2.13.1",
     "eslint": "^7.9.0",
     "eslint-config-airbnb": "^18.0.0",
     "eslint-config-prettier": "^8.0.0",
@@ -220,7 +218,7 @@
     "immutability-helper": "^3.0.0",
     "inquirer": "^8.0.0",
     "intersection-observer": "^0.12.0",
-    "jest": "^26.0.0",
+    "jest": "^27.0.3",
     "jest-image-snapshot": "^4.0.0",
     "jest-puppeteer": "^5.0.1",
     "jquery": "^3.4.1",

site/bisheng.config.js

@@ -1,7 +1,6 @@
 const path = require('path');
 const replaceLib = require('@ant-design/tools/lib/replaceLib');
 const getWebpackConfig = require('@ant-design/tools/lib/getWebpackConfig');
-const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
 const { ESBuildMinifyPlugin } = require('esbuild-loader');
 const { version } = require('../package.json');
 const themeConfig = require('./themeConfig');
@@ -86,8 +85,8 @@ module.exports = {
       config.optimization.minimizer = [
         new ESBuildMinifyPlugin({
           target: 'es2015',
+          css: true,
         }),
-        new CssMinimizerPlugin(),
       ];
     }
 

webpack.config.js

@@ -101,6 +101,7 @@ if (process.env.RUN_ENV === 'PRODUCTION') {
     if (process.env.ESBUILD || process.env.CSB_REPO) {
       config.optimization.minimizer[0] = new ESBuildMinifyPlugin({
         target: 'es2015',
+        css: true,
       });
     }