[ICE-10508] ace:animation - JavaScript error thrown when chaining animations - ICEsoft JIRA Issue Tracker

Details

Type: Bug
Status: Closed
Priority: Major
Resolution: Fixed
Affects Version/s: EE-3.3.0.GA_P02
Fix Version/s: EE-3.3.0.GA_P04
Component/s: ACE-Components
Labels:
None
Environment:
IE8

Assignee Priority:
P3
Support Case References:
Support Case #13313 - https://icesoft.my.salesforce.com/50070000011vjBI
Workaround Exists:

Yes
Workaround Description:

Hide
Swap the order of the animation tags:

                                <ace:animation event="click"
                                               name="highlight"/>
                                <ace:animation event="click"
                                               name="fade"/>

Show
Swap the order of the animation tags:                                 <ace:animation event="click"                                                name="highlight"/>                                 <ace:animation event="click"                                                name="fade"/>

Description

An h:commandLink uses two ace:animation tags to chain two animations. This commandLink is used to close an ace:dialog. When the link is clicked in IE8, a JavaScript error is thrown:

Unable to get value of the property '0': object is null or undefined

This is from the bundled JQuery JavaScript.

Sample code:
                            <h:commandLink id="closeEffect"
                                           value="close with effect">
                                <f:ajax execute="@this"
                                        render="popDetails"
                                        event="click"
                                        listener="#{TestBean.setDialogVisible(false)}"/>
                                <ace:animation event="click"
                                               name="fade"/>
                                <ace:animation event="click"
                                               name="highlight"/>
                            </h:commandLink>

Options
- Sort By Name
- Sort By Date
- Ascending
- Descending
- Download All

Attachments

Hide
Case13313Example.war

20/Feb/15 11:22 AM

9.74 MB

Arran Mccullough
META-INF/MANIFEST.MF 0.1 kB

META-INF/context.xml 0.1 kB

WEB-INF/classes/.../support/TestBean.class 0.6 kB

WEB-INF/lib/commons-beanutils.jar 226 kB

WEB-INF/lib/commons-collections.jar 558 kB

WEB-INF/lib/commons-digester.jar 140 kB

WEB-INF/lib/commons-logging.jar 52 kB

WEB-INF/lib/icefaces-ee-ace.jar 5.58 MB

WEB-INF/lib/icefaces-ee-ext.jar 60 kB

WEB-INF/lib/icefaces-ee.jar 619 kB

WEB-INF/lib/javax.faces.jar 2.54 MB

WEB-INF/web.xml 2 kB

index.xhtml 0.5 kB

welcomeICEfaces.xhtml 3 kB

Download Zip
Show

Case13313Example.war

20/Feb/15 11:22 AM

9.74 MB

Arran Mccullough
Case13313Example.zip

20/Feb/15 11:22 AM

20 kB

Arran Mccullough

Issue Links

depends on

ICE-11078 Update jQuery library to 1.12.3 release

Closed

Activity

Ascending order - Click to sort in descending order

Hide

Permalink

Arran Mccullough added a comment - 20/Feb/15 11:22 AM

Attached test case that shows this issue.

Steps:

Load welcomeICEfaces.jsf in IE8 or newer IE browser with IE8 emulation on.
Click the 'open dialog' link. A dialog is now shown.
Click the 'close with effect' link, a JS error will be thrown.
Clearing the message will close the dialog but the next time it is opened only the modal layer is shown.

Show

Arran Mccullough added a comment - 20/Feb/15 11:22 AM Attached test case that shows this issue. Steps: Load welcomeICEfaces.jsf in IE8 or newer IE browser with IE8 emulation on. Click the 'open dialog' link. A dialog is now shown. Click the 'close with effect' link, a JS error will be thrown. Clearing the message will close the dialog but the next time it is opened only the modal layer is shown.

4 older comments

Hide

Permalink

Carmen Cristurean added a comment - 23/Jun/16 9:12 AM - edited

EE-3.3.0-maintenance branch r.48972: the issue is resolved on IE8 (or newer IE version in IE8 document mode), and on FF41.

Browser console errors have been reproduced on Chrome 51:

ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:21295 Uncaught TypeError: Cannot read property '0' of undefined$.fx.step.(anonymous function) @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:21295set @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7463run @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7429tick @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7759jQuery.fx.timer @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:8094Animation @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7835doAnimation @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7938each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:370each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:137animate @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7948(anonymous function) @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:22308dequeue @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4157(anonymous function) @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4207each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:370each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:137dequeue @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4206(anonymous function) @ ace-components.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:5450dequeue @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4157(anonymous function) @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4207each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:370each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:137dequeue @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4206complete @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:22211opt.complete @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7912fire @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:3232fireWith @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:3362tick @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7767jQuery.fx.tick @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:8081
878ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:21295 Uncaught TypeError: Cannot read property '0' of undefined$.fx.step.(anonymous function) @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:21295set @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7463run @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7429tick @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7759jQuery.fx.tick @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:8081

Show

Carmen Cristurean added a comment - 23/Jun/16 9:12 AM - edited EE-3.3.0-maintenance branch r.48972: the issue is resolved on IE8 (or newer IE version in IE8 document mode), and on FF41. Browser console errors have been reproduced on Chrome 51: ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:21295 Uncaught TypeError: Cannot read property '0' of undefined$.fx.step.(anonymous function) @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:21295set @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7463run @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7429tick @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7759jQuery.fx.timer @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:8094Animation @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7835doAnimation @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7938each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:370each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:137animate @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7948(anonymous function) @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:22308dequeue @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4157(anonymous function) @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4207each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:370each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:137dequeue @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4206(anonymous function) @ ace-components.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:5450dequeue @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4157(anonymous function) @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4207each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:370each @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:137dequeue @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:4206complete @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:22211opt.complete @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7912fire @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:3232fireWith @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:3362tick @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7767jQuery.fx.tick @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:8081 878ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:21295 Uncaught TypeError: Cannot read property '0' of undefined$.fx.step.(anonymous function) @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:21295set @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7463run @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7429tick @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:7759jQuery.fx.tick @ ace-jquery.uncompressed.js.jsf?ln=icefaces.ace&v=3_3_0_160622:8081

Hide

Permalink

Carmen Cristurean added a comment - 29/Jun/16 4:01 PM

Re-tested EE 3.3.0.GA_P04 Jenkins Build # 652 with attached test case.
The console error from the comment above has been reproduced only on Chrome51, when clicking the 'close with effect' link on the dialog.

Show

Carmen Cristurean added a comment - 29/Jun/16 4:01 PM Re-tested EE 3.3.0.GA_P04 Jenkins Build # 652 with attached test case. The console error from the comment above has been reproduced only on Chrome51, when clicking the 'close with effect' link on the dialog.

Hide

Permalink

Arturo Zambrano added a comment - 04/Jul/16 6:41 PM

It's not very clear to me what's the purpose of the test app. The ace:animation tag is only applicable to standard h:* components, meaning that the effects can only be applied to them. So, in this case, the effects are applied to the command link itself, which are not really visible because the ajax behaviour to close the dialog is run first, before running the animations.

So far, what I've managed to find out is that the problem has to do with nodes not being available or visible by the time the second animation runs. Using only one animation shows to issues. Reversing the order of the animations (highlight first, fade out second) doesn't show any issues either. Also, applying the same animations in the original order but outside of the dialog shows no issues either.

Show

Arturo Zambrano added a comment - 04/Jul/16 6:41 PM It's not very clear to me what's the purpose of the test app. The ace:animation tag is only applicable to standard h:* components, meaning that the effects can only be applied to them. So, in this case, the effects are applied to the command link itself, which are not really visible because the ajax behaviour to close the dialog is run first, before running the animations. So far, what I've managed to find out is that the problem has to do with nodes not being available or visible by the time the second animation runs. Using only one animation shows to issues. Reversing the order of the animations (highlight first, fade out second) doesn't show any issues either. Also, applying the same animations in the original order but outside of the dialog shows no issues either.

Hide

Permalink

Arturo Zambrano added a comment - 05/Jul/16 1:20 PM

r49015: updated jQuery UI Effects to version 1.11.4

The effects library is actually part of jQuery UI. It seems like there were some compatibility issues with the newer version of jQuery. The effects library is totally independent of any other jQuery UI components, so it's safe to update separately from any other jQuery UI components. The 1.11.4 version is the latest stable release of jQuery UI.

This update was committed under ~~ICE-11078~~.

Show

Arturo Zambrano added a comment - 05/Jul/16 1:20 PM r49015: updated jQuery UI Effects to version 1.11.4 The effects library is actually part of jQuery UI. It seems like there were some compatibility issues with the newer version of jQuery. The effects library is totally independent of any other jQuery UI components, so it's safe to update separately from any other jQuery UI components. The 1.11.4 version is the latest stable release of jQuery UI. This update was committed under ICE-11078 .

Hide

Permalink

Liana Munroe added a comment - 05/Jul/16 2:14 PM

Verified ICEfaces EE-3.3.0 maintenance branch r49017. Tomcat 8, FF 43, Chrome 51, IE edge, 11, 10, 9, 8, 7.

Show

Liana Munroe added a comment - 05/Jul/16 2:14 PM Verified ICEfaces EE-3.3.0 maintenance branch r49017. Tomcat 8, FF 43, Chrome 51, IE edge, 11, 10, 9, 8, 7.

People

Assignee:

Arturo Zambrano

Reporter:

Arran Mccullough

Votes:

0 Vote for this issue

Watchers:

6 Start watching this issue

Dates

Created:

20/Feb/15 11:13 AM

Updated:

13/Mar/17 1:32 PM

Resolved:

05/Jul/16 1:20 PM