From 9a88fb4e46a5f0e44635a9f9cda0c5383ea8d692 Mon Sep 17 00:00:00 2001
From: JeremyWuuuuu <15975785+JeremyWuuuuu@users.noreply.github.com>
Date: Fri, 6 May 2022 18:41:50 +0800
Subject: [PATCH] fix(components): [popper] appendToBody API deprecation
 (#7534)

* fix(components): [popper] appendToBody API deprecation

- Remove `appendToBody` for components still using it.

* Remove duplicated attribute
---
 packages/components/dropdown/src/dropdown.vue          | 4 ++--
 packages/components/popover/src/index.vue              | 1 -
 packages/components/select-v2/__tests__/select.test.ts | 3 +--
 packages/components/table/src/filter-panel.vue         | 2 +-
 packages/components/time-picker/src/common/picker.vue  | 2 +-
 5 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/packages/components/dropdown/src/dropdown.vue b/packages/components/dropdown/src/dropdown.vue
index 3ec6d4aac0..7b39ca09e8 100644
--- a/packages/components/dropdown/src/dropdown.vue
+++ b/packages/components/dropdown/src/dropdown.vue
@@ -17,9 +17,9 @@
       :virtual-ref="triggeringElementRef"
       :virtual-triggering="splitButton"
       :disabled="disabled"
-      append-to-body
-      pure
       :transition="`${ns.namespace.value}-zoom-in-top`"
+      teleported
+      pure
       persistent
       @show="$emit('visible-change', true)"
       @hide="$emit('visible-change', false)"
diff --git a/packages/components/popover/src/index.vue b/packages/components/popover/src/index.vue
index 51c488cd27..ca572c1af3 100644
--- a/packages/components/popover/src/index.vue
+++ b/packages/components/popover/src/index.vue
@@ -9,7 +9,6 @@
     :transition="transition"
     :popper-options="popperOptions"
     :tabindex="tabindex"
-    :append-to-body="appendToBody"
     :content="content"
     :offset="offset"
     :show-after="showAfter"
diff --git a/packages/components/select-v2/__tests__/select.test.ts b/packages/components/select-v2/__tests__/select.test.ts
index 79a4959083..a0451fe562 100644
--- a/packages/components/select-v2/__tests__/select.test.ts
+++ b/packages/components/select-v2/__tests__/select.test.ts
@@ -106,7 +106,6 @@ const createSelect = (
         :collapseTagsTooltip="collapseTagsTooltip"
         :filterable="filterable"
         :multiple-limit="multipleLimit"
-        :popper-append-to-body="popperAppendToBody"
         :placeholder="placeholder"
         :allow-create="allowCreate"
         :remote="remote"
@@ -1503,7 +1502,7 @@ describe('Select', () => {
 
       await nextTick()
       expect(
-        document.body.querySelector(POPPER_CONTAINER_SELECTOR).innerHTML
+        document.body.querySelector(POPPER_CONTAINER_SELECTOR)!.innerHTML
       ).not.toBe('')
     })
 
diff --git a/packages/components/table/src/filter-panel.vue b/packages/components/table/src/filter-panel.vue
index 5dd2559b1c..3bd1a4831c 100644
--- a/packages/components/table/src/filter-panel.vue
+++ b/packages/components/table/src/filter-panel.vue
@@ -6,7 +6,7 @@
     :placement="placement"
     :show-arrow="false"
     :stop-popper-mouse-event="false"
-    append-to-body
+    teleported
     effect="light"
     pure
     :popper-class="ns.b()"
diff --git a/packages/components/time-picker/src/common/picker.vue b/packages/components/time-picker/src/common/picker.vue
index 822dd87a3d..45b6edcf01 100644
--- a/packages/components/time-picker/src/common/picker.vue
+++ b/packages/components/time-picker/src/common/picker.vue
@@ -6,7 +6,7 @@
     pure
     trigger="click"
     v-bind="$attrs"
-    append-to-body
+    teleported
     :transition="`${nsDate.namespace.value}-zoom-in-top`"
     :popper-class="[`${nsDate.namespace.value}-picker__popper`, popperClass]"
     :popper-options="elPopperOptions"