diff --git a/components/config-provider/__tests__/__snapshots__/components.test.js.snap b/components/config-provider/__tests__/__snapshots__/components.test.js.snap
index 8450f41e5c..721aa37cf4 100644
--- a/components/config-provider/__tests__/__snapshots__/components.test.js.snap
+++ b/components/config-provider/__tests__/__snapshots__/components.test.js.snap
@@ -8153,7 +8153,9 @@ exports[`ConfigProvider components Menu prefixCls 1`] = `
 
 exports[`ConfigProvider components Modal configProvider 1`] = `
 <div>
-  <div>
+  <div
+    class="config-modal-root"
+  >
     <div
       class="config-modal-mask"
     />
@@ -8245,7 +8247,9 @@ exports[`ConfigProvider components Modal configProvider 1`] = `
 
 exports[`ConfigProvider components Modal normal 1`] = `
 <div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask"
     />
@@ -8337,7 +8341,9 @@ exports[`ConfigProvider components Modal normal 1`] = `
 
 exports[`ConfigProvider components Modal prefixCls 1`] = `
 <div>
-  <div>
+  <div
+    class="prefix-Modal-root"
+  >
     <div
       class="prefix-Modal-mask"
     />
diff --git a/components/locale-provider/__tests__/__snapshots__/index.test.js.snap b/components/locale-provider/__tests__/__snapshots__/index.test.js.snap
index 7c1c46f6eb..09cd4ba7b6 100644
--- a/components/locale-provider/__tests__/__snapshots__/index.test.js.snap
+++ b/components/locale-provider/__tests__/__snapshots__/index.test.js.snap
@@ -7725,7 +7725,9 @@ exports[`Locale Provider should display the text as ar 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -13057,7 +13059,9 @@ exports[`Locale Provider should display the text as bg 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -18389,7 +18393,9 @@ exports[`Locale Provider should display the text as ca 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -23721,7 +23727,9 @@ exports[`Locale Provider should display the text as cs 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -29053,7 +29061,9 @@ exports[`Locale Provider should display the text as da 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -34385,7 +34395,9 @@ exports[`Locale Provider should display the text as de 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -39717,7 +39729,9 @@ exports[`Locale Provider should display the text as el 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -45049,7 +45063,9 @@ exports[`Locale Provider should display the text as en 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -50381,7 +50397,9 @@ exports[`Locale Provider should display the text as en-gb 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -55713,7 +55731,9 @@ exports[`Locale Provider should display the text as es 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -61045,7 +61065,9 @@ exports[`Locale Provider should display the text as et 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -66377,7 +66399,9 @@ exports[`Locale Provider should display the text as fa 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -71709,7 +71733,9 @@ exports[`Locale Provider should display the text as fi 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -77041,7 +77067,9 @@ exports[`Locale Provider should display the text as fr 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -82373,7 +82401,9 @@ exports[`Locale Provider should display the text as fr 2`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -87705,7 +87735,9 @@ exports[`Locale Provider should display the text as he 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -93037,7 +93069,9 @@ exports[`Locale Provider should display the text as hi 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -98369,7 +98403,9 @@ exports[`Locale Provider should display the text as hr 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -103701,7 +103737,9 @@ exports[`Locale Provider should display the text as hu 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -109033,7 +109071,9 @@ exports[`Locale Provider should display the text as hy 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -114365,7 +114405,9 @@ exports[`Locale Provider should display the text as id 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -119697,7 +119739,9 @@ exports[`Locale Provider should display the text as is 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -125029,7 +125073,9 @@ exports[`Locale Provider should display the text as it 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -130361,7 +130407,9 @@ exports[`Locale Provider should display the text as ja 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -135693,7 +135741,9 @@ exports[`Locale Provider should display the text as kn 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -141025,7 +141075,9 @@ exports[`Locale Provider should display the text as ko 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -146357,7 +146409,9 @@ exports[`Locale Provider should display the text as ku-iq 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -151689,7 +151743,9 @@ exports[`Locale Provider should display the text as lv 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -157021,7 +157077,9 @@ exports[`Locale Provider should display the text as mk 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -162353,7 +162411,9 @@ exports[`Locale Provider should display the text as mn-mn 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -167685,7 +167745,9 @@ exports[`Locale Provider should display the text as ms-my 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -173017,7 +173079,9 @@ exports[`Locale Provider should display the text as nb 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -178349,7 +178413,9 @@ exports[`Locale Provider should display the text as ne-np 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -183681,7 +183747,9 @@ exports[`Locale Provider should display the text as nl 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -189013,7 +189081,9 @@ exports[`Locale Provider should display the text as nl-be 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -194345,7 +194415,9 @@ exports[`Locale Provider should display the text as pl 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -199677,7 +199749,9 @@ exports[`Locale Provider should display the text as pt 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -205009,7 +205083,9 @@ exports[`Locale Provider should display the text as pt-br 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -210341,7 +210417,9 @@ exports[`Locale Provider should display the text as ro 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -215673,7 +215751,9 @@ exports[`Locale Provider should display the text as ru 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -221005,7 +221085,9 @@ exports[`Locale Provider should display the text as sk 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -226337,7 +226419,9 @@ exports[`Locale Provider should display the text as sl 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -231669,7 +231753,9 @@ exports[`Locale Provider should display the text as sr 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -237001,7 +237087,9 @@ exports[`Locale Provider should display the text as sv 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -242333,7 +242421,9 @@ exports[`Locale Provider should display the text as ta 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -247665,7 +247755,9 @@ exports[`Locale Provider should display the text as th 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -252997,7 +253089,9 @@ exports[`Locale Provider should display the text as tr 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -258329,7 +258423,9 @@ exports[`Locale Provider should display the text as uk 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -263661,7 +263757,9 @@ exports[`Locale Provider should display the text as vi 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -268993,7 +269091,9 @@ exports[`Locale Provider should display the text as zh-cn 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
@@ -274325,7 +274425,9 @@ exports[`Locale Provider should display the text as zh-tw 1`] = `
       </div>
     </div>
   </div>
-  <div>
+  <div
+    class="ant-modal-root"
+  >
     <div
       class="ant-modal-mask fade-appear"
     />
diff --git a/components/modal/__tests__/__snapshots__/Modal.test.js.snap b/components/modal/__tests__/__snapshots__/Modal.test.js.snap
index 1fc56f54e0..6888748019 100644
--- a/components/modal/__tests__/__snapshots__/Modal.test.js.snap
+++ b/components/modal/__tests__/__snapshots__/Modal.test.js.snap
@@ -4,7 +4,9 @@ exports[`Modal render correctly 1`] = `
 <div>
   <div>
     <div>
-      <div>
+      <div
+        class="ant-modal-root"
+      >
         <div
           class="ant-modal-mask fade-appear"
         />
@@ -100,7 +102,9 @@ exports[`Modal render without footer 1`] = `
 <div>
   <div>
     <div>
-      <div>
+      <div
+        class="ant-modal-root"
+      >
         <div
           class="ant-modal-mask fade-appear"
         />
@@ -171,7 +175,9 @@ exports[`Modal render without footer 1`] = `
 `;
 
 exports[`Modal support closeIcon 1`] = `
-<div>
+<div
+  class="ant-modal-root"
+>
   <div
     class="ant-modal-mask fade-appear"
   />