Opened 6 years ago

Closed 5 years ago

Last modified 5 years ago

#17366 closed defect (fixed)

closing Dialog launched from popup menu doesn't hide ValidationTextBox's tooltip

Reported by: gerhard presser Owned by: bill
Priority: undecided Milestone: 1.10
Component: Dijit Version: 1.9.1
Keywords: Cc: ben hockey
Blocked By: Blocking:

Description

I'm displaying a form with a nested validationtextbox in an dijit/Dialog. the textbox contains invalid data. if I destroy the dialog, the tooltip is still visible - hovering in mid-air.

Attachments (2)

dialog_test.html (1.2 KB) - added by gerhard presser 6 years ago.
test-case
dialog_test.2.html (1.2 KB) - added by gerhard presser 6 years ago.

Download all attachments as: .zip

Change History (19)

comment:1 Changed 6 years ago by ben hockey

Cc: ben hockey added

comment:2 Changed 6 years ago by ben hockey

i've had a similar issue - my workaround was to subclass the widget and call displayMessage() in destroy so that the tooltip goes away. i just mention that to help you get by until this can be addressed.

comment:3 Changed 6 years ago by bill

Owner: set to gerhard presser
Status: newpending

This sounds very strange. Why are you destroying the dialog while the user is in the middle of editing a field?

Also, sounds like the base issue is unrelated to dialog, but rather that destroying a ValidationTextBox? doesn't erase the tooltip (although again I don't understand why you would do that).

comment:4 Changed 6 years ago by gerhard presser

Status: pendingnew

the user decides to close the dialog - not me.

this just seems to happen if the tooltip is open and the user clicks on the 'x' in the top-right-corner.

there's also a cancel-button in the dialog, which hides/destroys the dialog too - if I click on the button, the tooltip disappears too - maybe a onblur-event gets fired in this case.

comment:5 Changed 6 years ago by bill

Status: newpending

Suddenly you are talking about closing the dialog, rather than destroying it as you originally said.

What's supposed to happen in this case is that closing the Dialog refocuses the Button that opened the Dialog, which causes a blur event on the ValidationTextBox?, which hides the Tooltip. Not sure why that's not working for you, but if you attach a test case using the "attach file" button, I'll take a look It should be a single HTML file that I can load in the browser (i.e. not PHP, JSP, etc.), with instructions on how to reproduce the problem using your attached test file, including the browser and version to use.

Alternately, you can give instructions on how to reproduce the problem with an existing test case (in the tests/ directory).

Changed 6 years ago by gerhard presser

Attachment: dialog_test.html added

test-case

comment:6 Changed 6 years ago by gerhard presser

Status: pendingnew

Attachment (dialog_test.html) added by ticket reporter.

Changed 6 years ago by gerhard presser

Attachment: dialog_test.2.html added

comment:7 Changed 6 years ago by gerhard presser

sorry for the duplicate files, there's been a problem while uploading.

steps to reproduce: -) click the dropdown button -) click the menu-item -) click into the textbox -) click anywhere outside the textbox -) click into the textbox - the tooltip appears -) click the 'x' on the dialog - the tooltip stays visible

comment:8 Changed 6 years ago by ben hockey

this is odd... i can't get it to fail on my local machine but when i use saucelabs i see the issue - https://saucelabs.com/tests/d0716a2927ce485783a2972c5bb15d96 has a video of it happening.

comment:9 Changed 6 years ago by bill

OK... well anyway it's probably because the element that launched the dialog can't be refocused because it's hidden. Which also means that your app has bad accessibility because after the dialog closes, where does the focus go?

I'll try to take a look but I bet you could fix/workaround the issue by sending focus somewhere sensible when the dialog closes.

comment:10 Changed 6 years ago by bill

Summary: destroying popup, doesn't destroy validationtextbox's tooltipclosing Dialog doesn't hide ValidationTextBox's tooltip

comment:11 Changed 6 years ago by bill

Summary: closing Dialog doesn't hide ValidationTextBox's tooltipclosing Dialog launched from popup menu doesn't hide ValidationTextBox's tooltip

Thanks for the test case. I do reproduce it at least on Chrome/mac. Not sure why it didn't reproduce locally for neonstalwart, but did reproduce on saucelabs, unless perhaps they were different browsers.

When I run your test, dijit/focus::_onBlurNode() isn't getting called, nor is the onblur handler on the ValidationTextBox? <input> itself. Seems the browser still considers that the <input> is focused. dijit/Dialog tries to refocus the MenuItem?, but to no effect, because it's hidden. Strangely, there seems to be no exception either.

Probably as I said above it's better to just workaround this problem in the app (by focusing something sensible), rather than adding code to dijit.

comment:12 Changed 5 years ago by zhuxw

This issue also occurs in my project. I find there are actually 2 problems.

  1. As Bill mentioned, when the dialog is hidden, there's nothing to focus, so the dijit/focus::_onBlurNode() isn't called. This can be worked around by focusing something in the app.
  2. If the dialog is destroyed immediately after hide(), the work around above does not work, because the ValidationTextBox::_onBlur will never be called. So I suggest to at least add Tooltip.hide(this.domNode) to the destroy() function of the ValidationTextBox?.

comment:13 Changed 5 years ago by zhuxw

For the 2nd case mentioned above, maybe it is necessory to add in all widgets that uses Tooltip, not only ValidationTextBox?.

comment:14 Changed 5 years ago by bill

Milestone: tbd1.10
Owner: changed from gerhard presser to bill
Status: newassigned

comment:15 Changed 5 years ago by bill

For the 2nd case mentioned above, maybe it is necessory to add in all widgets that uses Tooltip, not only ValidationTextBox?.

Agreed, that's Select and ValidationTextBox?. Technically the problem also exists for the Tooltip widget itself, if (one of) the DOMNodes it's connected to is destroyed. But not sure how to fix that.

So, I'll add the Tooltip.hide(this.domNode) call for Select and ValidationTextBox?.

comment:16 Changed 5 years ago by Bill Keese <bill@…>

Resolution: fixed
Status: assignedclosed

In b59f8a3599dbd9c731a7c359b12b039f8edff866/dijit:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

comment:17 Changed 5 years ago by Bill Keese <bill@…>

In 1e5607ae62e094bf30c264f373dfd96a6d484185/dijit:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 
Note: See TracTickets for help on using tickets.