Opened 3 years ago

Last modified 2 years ago

#18977 assigned defect

Tree and wipeIn/wipeOut-based Toggler anim erratic when started while previous anim in progress

Reported by: donhatch Owned by: dylan
Priority: undecided Milestone: 1.14
Component: fx Version: 1.12.1
Keywords: Cc:
Blocked By: Blocking:

Description

Tree behaves erratically (that is, the animation jumps in various ways) when a node's +/- button is clicked while a previous expand or collapse is in progress. Toggler also behaves erratically (discontinuities, and attributes being animated out-of-sync with other attributes) when showFunc/hideFunc are set to wipeIn/wipeOut. I'll give recipes to reproduce some specific bad behaviors below.

My basic premise is that both of these widgets's animations should be continous in all cases, no matter in what crazy way the user clicks around on them, and so any discontinuities in their animations is a bug.

The discontinuities in both widgets apparently began with this commit, 6 years ago:

https://github.com/dojo/dojo/commit/944f8ad4c8dd3314b97f9ce8e015cad6db8ec96b

commit 944f8ad4c8dd3314b97f9ce8e015cad6db8ec96b Author: Douglas Hays <doughays@…> Date: Fri Mar 25 23:51:19 2011 +0000

Fixes #12177. Duplicate cleanup handler for both onStop and onEnd. Added automated test. git-svn-id: http://svn.dojotoolkit.org/src/dojo/trunk@24124 560b804f-0ae3-0310-86f3-f6aa0a117693

My recipe to reproduce these problems is based on the first Tree example and third (last) Toggler example from the docs. I'm starting from the 1.7 docs, since that's the doc version whose code is most compatible with dojo&dijit as they have changed over the past 6 years:

https://dojotoolkit.org/reference-guide/1.7/dijit/Tree.html#a-programmatic-tree https://dojotoolkit.org/reference-guide/1.7/dojo/fx/Toggler.html#example-2-toggle-a-dom-node-with-custom-animation-functions

(note that the "example-2" is really example 3; that has since been fixed on the Toggler doc page). I lengthened the animation durations to 2 seconds in both examples; I've attached the two modified examples.

To demonstrate various bad behavious, first save the two examples I attached, and put up-to-date dojo&dijit repos in the appropriate places so they can be found by the example pages (i.e. put them under ../_stat

Attachments (2)

TreeExample1.html (874 bytes) - added by donhatch 3 years ago.
first tree example from 1.7 doc, with default duration changed to 2 secs
TogglerExample3.html (1.3 KB) - added by donhatch 3 years ago.
third Toggler example from 1.7 doc, with both durations lengthened to 2 secs

Download all attachments as: .zip

Change History (5)

Changed 3 years ago by donhatch

Attachment: TreeExample1.html added

first tree example from 1.7 doc, with default duration changed to 2 secs

Changed 3 years ago by donhatch

Attachment: TogglerExample3.html added

third Toggler example from 1.7 doc, with both durations lengthened to 2 secs

comment:1 Changed 3 years ago by donhatch

[I see my original bug description got truncated. At the risk of creating a bigger mess, I'm including the missing part here.]

ic/js and ../../_static/js).

Then try each of the following (I'm using chrome Version 56.0.2924.87 on a macbook pro, but I doubt it matters):

  • TreeExample1.html (default duration set to 2000:
    • Start with root expanded:
      • Click, wait 1 sec, Click:
        • Result: starts to collapse, 2nd click makes it jump to collapsed then starts to expand
        • Expected: should be continuous
      • Double-click (i.e. two clicks within .25 secs or so of each other): (actually easier to see with default duration)
        • Result: starts to collapse, 2nd click makes it jump back to expanded and then start to collapse again
        • Expected: should be continuous
      • Triple-click:
        • Result: first click starts to collapse, 2nd click jumps back to expanded and starts to collapse, 3rd click jumps to collapsed and starts to expand
        • Expected: should be continuous
    • Start with root collapsed:
      • Same as with root expanded, but interchange "expand" with "collapse" throughout description
  • ToggleExample3.html (both durations set to 2000):
    • Show (even though already shown) then Hide about 1 sec later
      • Result: does an animated hide of just the background, then the text disappears all at once at the end of the animation
      • Expected: text should get wiped out continously with the background
    • Start hidden, Hide (even though already hidden) then Show about 1 sec later
      • Result: stays hidden
      • Expected: should expand

All of the bad behaviors described above started at the previously mentioned commit 6 years ago. In other words:

  • GOOD: git checkout `git rev-list -n 1 --before="2011-03-25 23:51 +0000" master`
  • BAD: git checkout `git rev-list -n 1 --before="2011-03-25 23:52 +0000" master`

(I run the same checkout command in both dojo&dijit directories, so that dojo&dijit stay compatible with each other.)

Last edited 3 years ago by donhatch (previous) (diff)

comment:2 Changed 3 years ago by dylan

Milestone: tbd1.12.3
Owner: set to dylan
Status: newassigned

comment:3 Changed 2 years ago by dylan

Milestone: 1.12.31.14
Note: See TracTickets for help on using tickets.