Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Animated Dataview creates two DOM elements with same ID #1632

Closed
fabriciomurta opened this Issue Feb 23, 2019 · 2 comments

Comments

Projects
None yet
1 participant
@fabriciomurta
Copy link
Contributor

fabriciomurta commented Feb 23, 2019

Found: 4.8.0 (prior to release)
Sencha thread: Ext.ux.DataView.Animated example broken and UX issue

The animated dataview UX plugin now throws an exception while the store filter causes items to be redrawn. The fade-out animation's callback attempt to get the faded out element results in a query returning two different DOM elements, and an error is triggered because the fetched ID DOM element differs from which one is cached in ExtJS (during Ext.get() to fetch the just animated/faded_out content).

The temporary double-ID DOM element should be avoided, or the animation callback should reliably fetch the target that needs to be removed from DOM to address the issue; being the former preferred, the latter alternative is known to be feasible at this moment.

The drawback of changing how the animated/faded DOM element is that it will require replacing the whole Ext.ux.DataView.Animated.init() method in an override, a simpler patch override is not possible.

@fabriciomurta

This comment has been minimized.

Copy link
Contributor Author

fabriciomurta commented Feb 23, 2019

Unfortunately the most feasible way was to just fix how the animation fetched the target dom element; meant just one line change in the code, although the whole init() method (corresponding to more than 50% of the Ext.ux.DataView.Animated code), had to be copypasted into the override.

The way the plugin is written allows little to no advantage on overriding. Keeping the original file instead of fully replacing it will allow to identify whenever Sencha fixes their version of the plug in.

Notice: Sencha's examples have one for the animated dataview which has not been working since, at least, version 6.0.0 release. The URL for 6.7.0 would be: https://examples.sencha.com/extjs/6.7.0/examples/classic/view/animated-dataview.html

It breaks because it makes references to several non-existing resources; before it failed during require() call.

Without that example working, there's little to do as to create a new Sencha forum thread. An existing thread was found and bumped but it was a little unrelated, and also for Ext JS 5. A new thread has been created for Ext JS 6, and specific to this issue: Ext.ux.DataView.Animated example broken and UX issue.

@fabriciomurta

This comment has been minimized.

Copy link
Contributor Author

fabriciomurta commented Feb 23, 2019

Update: Issue still open after ExtJS 6.7.0.161 release. Issue has not been reviewed by Sencha.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.