Opened 11 years ago

Closed 10 years ago

#9296 closed defect (fixed)

Tree: throws "Can't move focus to the control because it is invisible, not enabled, or of a type that does not accept the focus." when nodes have a margin

Reported by: Phil DeJarnett Owned by: bill
Priority: high Milestone: 1.4
Component: Dijit Version: 1.3.0
Keywords: Cc:
Blocked By: Blocking:

Description (last modified by bill)

I don't have an easy test case, but I know how to fix it: If you:

  1. Have a rootless tree, and
  2. You style the nodes to use margins for spacing, and
  3. A user clicks in the margin,

The tree attempts to focus on the rootNode. Since this node is not actually visible (1), but isTreeNode is true, the tree attempts focus.

The solution is to modify _onClick and _onDblClick to ignore the rootNode when the rootNode is hidden.

Again, this is only a problem if margins are used to space out nodes. For example, I have a horizontal line separating two sections, and I create it by setting a top border, top padding, and top margin on the node. It's easy to click that space and that's what throws the error.

Attachments (1)

test_Tree.html (6.7 KB) - added by bill 10 years ago.
margin added to tree nodes; clicking near the nodes in the second tree makes them all disappear

Download all attachments as: .zip

Change History (5)

comment:1 Changed 11 years ago by Phil DeJarnett

Update: I tried hacking in a solution that stopped the checks on rootNode - then the error just migrated to a different node.

Instead, I think a better solution is to wrap focusNode in a try/catch block:

try {
    node.labelNode.focus();
} catch(e) {} // suppress focus errors

This resolved the issue (even if it feels hacky) for me under IE.

comment:2 Changed 11 years ago by bill

Component: GeneralDijit
Description: modified (diff)
Owner: anonymous deleted
Summary: dijit.Tree throws "Can't move focus to the control because it is invisible, not enabled, or of a type that does not accept the focus." when nodes have a marginTree: throws "Can't move focus to the control because it is invisible, not enabled, or of a type that does not accept the focus." when nodes have a margin

Hmm, I think I need a test case before checking in a fix.

Changed 10 years ago by bill

Attachment: test_Tree.html added

margin added to tree nodes; clicking near the nodes in the second tree makes them all disappear

comment:3 Changed 10 years ago by bill

Milestone: tbd1.4
Owner: set to bill
Status: newassigned

OK, I tried a test and reproduced the problem... it's from the _onClick handler on Tree itself (Tree is trying to be clever by only having a single click handler for the entire tree), which does:

var domElement = e.target;
var nodeWidget = dijit.getEnclosingWidget(domElement);

As you've pointed out that doesn't work well. The handler should really be on the row node.

Same story for onDblClick.

I'll fix it now.

comment:4 Changed 10 years ago by bill

Resolution: fixed
Status: assignedclosed

(In [20145]) Put click handlers on each TreeNode? rather than at root of tree, to avoid issues where margin was clicked, etc. Since we already have mouseEnter/mouseLeave handlers on each node there's not a big change in performance. Fixes #9296 !strict.

Note: See TracTickets for help on using tickets.