Element: [Bug Report] 【el-dialog】close bug

Created on 8 Apr 2019  ·  17Comments  ·  Source: ElemeFE/element

Element UI version

2.7.2

OS/Browsers version

chrome

Vue version

2.6.10

Reproduction Link

https://jsfiddle.net/cx56bm1y/

Steps to reproduce

I have a dialog, I want to close it by click-modal

but if I mousedown on the dialog and mouseup on the modal, it also closed!! I don't want that

because sometimes I select text in the input will out of bounds, and dialog be closed

What is Expected?

I just want to close it by click-modal only

but after I set close-on-click-modal to false

both of them are invalid, I want to reserve click event

thanks everyone

What is actually happening?

Dialog close issue

dialog bug

Most helpful comment

@W-Lynn @YuLinXi @danielktaylor @hkwin i am curious, what's the scenarios,why click inside the dialog then slides outside the dialog ?

Let me explain this with a gif which is more specific than I type the words.
Just a normal selection with the mouse, no any other actions.
el-dialog-close-bug

All 17 comments

I have the same problem, It is currently positioned as the latest version of the Google browser(73.0.3683.86)

Definitely a change in Google Chrome - lots of sites are broken now in the same way.

Might be related to this? https://bugs.chromium.org/p/chromium/issues/detail?id=941910

I don't think this problem only in Google Chrome.
I've tested in Safari and Firefox, also have this issue!

Same issue here, it seems like every mouseup event triggers an event click, who calls handleWrapperClick, cause div.el-dialog__wrapper is a parent node of div.el-dialog, but not a sibling node.

The "wrapper" should not handle the click close event, there should be a backdrop node which just fill the background and close the dialog when being clicked

遇到同样问题,当点击dialog 内部,鼠标滑动到 dialog 外部时松开鼠标,dialog 会关闭。这是个bug

i have the same problem, when you click inside the dialog and the mouse slides outside the dialog, then you release the mouse and the dialog will close. This is a bug.

遇到同样问题,当点击dialog 内部,鼠标滑动到 dialog 外部时松开鼠标,dialog 会关闭。这是个bug

i have the same problem, when you click inside the dialog and the mouse slides outside the dialog, then you release the mouse and the dialog will close. This is a bug.

How to avoid this ? Thanks

@W-Lynn @YuLinXi @danielktaylor @hkwin i am curious, what's the scenarios,why click inside the dialog then slides outside the dialog ?

@W-Lynn @YuLinXi @danielktaylor @hkwin i am curious, what's the scenarios,why click inside the dialog then slides outside the dialog ?

Let me explain this with a gif which is more specific than I type the words.
Just a normal selection with the mouse, no any other actions.
el-dialog-close-bug

how can we solve this issue ,is there a temporary solution ?

how can we solve this issue ,is there a temporary solution ?

Actually I don't expect the el team has willings to fix this problem.
It may be not a problem for them I guess, as you can see this problem can be seen in the early version: 1.4, and last to the latest version(2.9.1)!
So, set the close-on-click-modal to false, or just remind your users to make their hands steady😂!

@luckyCao, likes comment by @ansonhorse
when I want to select text for copy, sometimes will out of bounds
(some people did not want to input password twice for confirm....)
I feel the User Experience is not good
because the question be found by client
Thank you for solved it~

遇到同样问题,当点击dialog 内部,鼠标滑动到 dialog 外部时松开鼠标,dialog 会关闭。这是个bug

这个有解决方案吗

Looks that this issue is still on?

Can you please fix this bug ASAP? It's very annoying!!!

Why did you revert the bug fix when it work well?

Why are you reverting the fix? It would be working. Please fix this asap. Lots of people have this problem.

Was this page helpful?
0 / 5 - 0 ratings