diff --git a/packages/components/table/__tests__/table.test.ts b/packages/components/table/__tests__/table.test.ts
index 03d87e4a2a..d8236cf9d0 100644
--- a/packages/components/table/__tests__/table.test.ts
+++ b/packages/components/table/__tests__/table.test.ts
@@ -2337,6 +2337,56 @@ describe('Table.vue', () => {
mockCellRect2.mockRestore()
})
+ it('should cleanup tooltip dynamically', async () => {
+ const mockRangeRect = vi
+ .spyOn(Range.prototype, 'getBoundingClientRect')
+ .mockReturnValue({
+ width: 150,
+ height: 30,
+ } as DOMRect)
+
+ const wrapper = mount({
+ components: {
+ ElTable,
+ ElTableColumn,
+ },
+ template: `
+
+
+
+ `,
+
+ data() {
+ return {
+ testData: getTestData(),
+ showOverflowTooltip: true,
+ }
+ },
+ })
+
+ await doubleWait()
+ const tr = wrapper.findAll('.overflow_tooltip')
+ const mockCellRect = vi
+ .spyOn(tr[1].find('.cell').element, 'getBoundingClientRect')
+ .mockReturnValue({
+ width: 100,
+ height: 30,
+ } as DOMRect)
+ await tr[1].trigger('mouseenter')
+ await rAF()
+ expect(wrapper.find('.el-popper').exists()).toBe(true)
+ await wrapper.setData({ showOverflowTooltip: false })
+ await tr[1].trigger('mouseleave')
+ await rAF()
+ await tr[1].trigger('mouseenter')
+ await rAF()
+ expect(wrapper.find('.el-popper').exists()).toBe(false)
+
+ mockRangeRect.mockRestore()
+ mockCellRect.mockRestore()
+ wrapper.unmount()
+ })
+
it('use-tooltip-formatter', async () => {
const testData = getTestData() as any
const mockRangeRect = vi
diff --git a/packages/components/table/src/table-body/events-helper.ts b/packages/components/table/src/table-body/events-helper.ts
index 79df90d3f3..81d815fe4f 100644
--- a/packages/components/table/src/table-body/events-helper.ts
+++ b/packages/components/table/src/table-body/events-helper.ts
@@ -125,6 +125,9 @@ function useEvents(props: Partial>) {
}
if (!tooltipOptions) {
+ if (removePopper?.trigger === cell) {
+ removePopper?.()
+ }
return
}
diff --git a/packages/components/table/src/util.ts b/packages/components/table/src/util.ts
index b55666f1f2..f0bf291e6f 100644
--- a/packages/components/table/src/util.ts
+++ b/packages/components/table/src/util.ts
@@ -507,8 +507,14 @@ export function createTablePopper(
vm.component!.exposed!.onOpen()
const scrollContainer = parentNode?.querySelector(`.${ns}-scrollbar__wrap`)
removePopper = () => {
+ if (vm.component?.exposed?.onClose) {
+ vm.component.exposed.onClose()
+ }
render(null, container)
- scrollContainer?.removeEventListener('scroll', removePopper!)
+ const currentRemovePopper = removePopper as RemovePopperFn
+ scrollContainer?.removeEventListener('scroll', currentRemovePopper)
+ currentRemovePopper.trigger = undefined
+ currentRemovePopper.vm = undefined
removePopper = null
}
removePopper.trigger = trigger ?? undefined