refactor(element-plus): remove `el-teleport` by micaiguai · Pull Request #23219 · element-plus/element-plus

micaiguai · 2025-12-26T01:53:01Z

Perhaps Vue has fixed the Teleport hydration issues by now. Just try removing the v-if and let the Teleport render unconditionally.

Related PR:

Summary by CodeRabbit

Refactor
- Switched several UI overlays (dialogs, drawers, tooltips, image viewer, tour, affix, etc.) to use Vue's native teleport for rendering.
- Removed the packaged Teleport component and its public exports.
Dependencies
- Bumped Vue peer dependency to ^3.3.7.

github-actions · 2025-12-26T01:53:09Z

micaiguai · 2025-12-26T01:53:51Z

Related: #23053 (comment)

pkg-pr-new · 2025-12-26T01:54:49Z

Open in StackBlitz

pnpm add https://pkg.pr.new/element-plus@23219

npm i https://pkg.pr.new/element-plus@23219

yarn add https://pkg.pr.new/[email protected]

commit: 4a08a66

github-actions · 2025-12-26T02:00:56Z

🧪 Playground Preview: https://element-plus.run/?pr=23219
Please comment the example via this playground if needed.

micaiguai · 2025-12-26T02:08:46Z

Notice the mountCount change when the Affix teleported status changes.

Before
After

rzzf

Thanks for your investigation. look good to me.

warmthsea

LGTM

tolking · 2025-12-27T02:39:26Z

"peerDependencies": {
    "vue": "^3.3.0"
  },

We now require a minimum Vue version of 3.3.0, and we also need to modify the peerDependencies versions accordingly.

Furthermore, after this PR, the ElTeleport seems unnecessary, perhaps this component can be directly deleted.

coderabbitai · 2025-12-28T15:21:46Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 95160cf9-2b61-4c0d-9c40-b367a3eaebf7

📥 Commits

Reviewing files that changed from the base of the PR and between 3dbab3b and 4a08a66.

📒 Files selected for processing (5)

packages/components/affix/src/affix.ts
packages/components/affix/src/affix.vue
packages/components/dialog/src/dialog.ts
packages/components/dialog/src/dialog.vue
packages/components/drawer/src/drawer.vue

✅ Files skipped from review due to trivial changes (3)

packages/components/dialog/src/dialog.vue
packages/components/drawer/src/drawer.vue
packages/components/affix/src/affix.vue

🚧 Files skipped from review as they are similar to previous changes (1)

packages/components/dialog/src/dialog.ts

📝 Walkthrough

Walkthrough

Replaces internal Element Plus Teleport usage with Vue's native across multiple components, removes the Teleport component and its public exports/tests/types, updates several appendTo prop types to string | HTMLElement, and updates the Vue peerDependency to ^3.3.7.

Changes

Cohort / File(s)	Summary
Native teleport usage `packages/components/affix/src/affix.vue`, `packages/components/dialog/src/dialog.vue`, `packages/components/drawer/src/drawer.vue`, `packages/components/image-viewer/src/image-viewer.vue`, `packages/components/tooltip/src/content.vue`, `packages/components/tour/src/tour.vue`	Replaced `<el-teleport>` with native `<teleport>` tags in templates and removed `ElTeleport` imports. Teleport destination (`:to`) and `:disabled` bindings retained; template logic otherwise unchanged.
Teleport component removal (impl & API) `packages/components/teleport/src/teleport.vue`, `packages/components/teleport/src/teleport.ts`, `packages/components/teleport/index.ts`, `packages/components/teleport/__tests__/teleport.test.tsx`, `packages/components/teleport/style/css.ts`, `packages/components/teleport/style/index.ts`	Removed the Teleport component implementation, its exported prop/type declarations, package entry exports, tests, and trivial style exports — eliminating the Teleport public API surface.
appendTo prop type updates `packages/components/affix/src/affix.ts`, `packages/components/dialog/src/dialog.ts`, `packages/components/tooltip/src/content.ts`, `packages/components/tour/src/tour.ts`	Dropped `teleportProps` dependency and changed `appendTo` (and equivalent) prop runtime typing to `definePropType<string
Peer dependency bump `packages/element-plus/package.json`	Updated peerDependencies.vue from `^3.3.0` to `^3.3.7`.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

refactor(components): [affix] use type-based definitions #23400 — Overlaps with affix prop/type changes (appendTo typing and props refactor).
refactor(components): [tooltip] use type-based definitions #23475 — Related changes to tooltip content props and appendTo typing.
fix(components): [tour] avoid Teleport inheriting attribute #23336 — Related teleport usage changes in tour component (teleport attribute handling).

Suggested reviewers

rzzf
btea

Poem

🐇 I swapped a cloak for open sky,
Teleports trimmed — I gave a try.
Props now clear, small exports fall,
A lighter hop, I celebrate all. 🥕

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'refactor(element-plus): remove `el-teleport`' accurately and concisely describes the main objective of the PR.
Description check	✅ Passed	The description provides context about the change (removing conditional rendering around Teleport), references related issues and PRs, and includes supporting evidence (screenshot), but lacks explicit contributions checklist completion.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

pull-request-triage Bot assigned micaiguai Dec 26, 2025

pull-request-triage Bot added the Needs Review label Dec 26, 2025

github-actions Bot added the Contribution::Community label Dec 26, 2025

micaiguai changed the title ~~fix(components): [affix] change v-if to disabled prop~~ fix(components): [teleport] change v-if to disabled prop Dec 26, 2025

micaiguai mentioned this pull request Dec 26, 2025

feat(components): [affix] support append-to and teleported #23053

Merged

rzzf approved these changes Dec 26, 2025

View reviewed changes

warmthsea approved these changes Dec 26, 2025

View reviewed changes

btea requested a review from tolking December 26, 2025 14:22

btea approved these changes Dec 26, 2025

View reviewed changes

tolking added breaking change Minor Version labels Dec 27, 2025

coderabbitai Bot reviewed Dec 28, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

refactor(element-plus): remove `el-teleport`#23219

refactor(element-plus): remove `el-teleport`#23219
rzzf merged 5 commits into
element-plus:devfrom
micaiguai:fix/affix-teleport

micaiguai commented Dec 26, 2025 •

edited by coderabbitai Bot

Loading

Uh oh!

github-actions Bot commented Dec 26, 2025 •

edited

Loading

Uh oh!

micaiguai commented Dec 26, 2025

Uh oh!

pkg-pr-new Bot commented Dec 26, 2025 •

edited

Loading

Uh oh!

github-actions Bot commented Dec 26, 2025 •

edited

Loading

Uh oh!

micaiguai commented Dec 26, 2025 •

edited

Loading

Uh oh!

rzzf left a comment

Uh oh!

warmthsea left a comment

Uh oh!

tolking commented Dec 27, 2025

Uh oh!

coderabbitai Bot commented Dec 28, 2025 •

edited

Loading

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Uh oh!

Uh oh!

Conversation

micaiguai commented Dec 26, 2025 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

github-actions Bot commented Dec 26, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

micaiguai commented Dec 26, 2025

Uh oh!

pkg-pr-new Bot commented Dec 26, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented Dec 26, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

micaiguai commented Dec 26, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

rzzf left a comment

Choose a reason for hiding this comment

Uh oh!

warmthsea left a comment

Choose a reason for hiding this comment

Uh oh!

tolking commented Dec 27, 2025

Uh oh!

coderabbitai Bot commented Dec 28, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Uh oh!

micaiguai commented Dec 26, 2025 •

edited by coderabbitai Bot

Loading

github-actions Bot commented Dec 26, 2025 •

edited

Loading

pkg-pr-new Bot commented Dec 26, 2025 •

edited

Loading

github-actions Bot commented Dec 26, 2025 •

edited

Loading

micaiguai commented Dec 26, 2025 •

edited

Loading

coderabbitai Bot commented Dec 28, 2025 •

edited

Loading