ICEfaces
  1. ICEfaces
  2. ICE-11292

ace:accordionPanel, unnecessary scrollbars appear when autoHeight="true"

          Details

          • Type: Bug Bug
          • Status: Closed
          • Priority: Major Major
          • Resolution: Fixed
          • Affects Version/s: 4.2
          • Fix Version/s: EE-4.2.0.GA
          • Component/s: ACE-Components
          • Labels:
            None
          • Environment:
            Any

            Description

            After fixes related to ICE-11280, vertical scrollbars appear in accordion panes when they don't seem necessary. This occurs when autoHeight="true", because, in this case, all panes are set an explicit height in pixels, which is the height of the tallest pane. The fix for ICE-11280 adds style="height:100%;" to the inner content div. Thus, no matter what height is set, the scrollbars will always appear because the inner content node will take the same height plus the padding and border.
            1. horizontal.PNG
              49 kB
            2. vertical.png
              49 kB

              Activity

              Ascending order - Click to sort in descending order
              Arturo Zambrano created issue -
              Arturo Zambrano made changes -
              Field Original Value New Value
              Assignee Arturo Zambrano [ artzambrano ]
              Arturo Zambrano made changes -
              Fix Version/s EE-4.2.0.GA [ 13071 ]
              Arturo Zambrano made changes -
              Description After fixes related to ICE-11280, vertical scrollbars appear in accordion panes when they don't seem necessary. This occurs when autoHeight="true", because, in this case, all panes are set an explicit height in pixels, which is the height of the tallest pane. The fix for ICE-11280 adds style="height:100%;" to the inner content div. Thus, no matter what height is set, the scrollbars will always appear because the inner content node will take the same height plus the padding and border, so the scrollbars will appear. After fixes related to ICE-11280, vertical scrollbars appear in accordion panes when they don't seem necessary. This occurs when autoHeight="true", because, in this case, all panes are set an explicit height in pixels, which is the height of the tallest pane. The fix for ICE-11280 adds style="height:100%;" to the inner content div. Thus, no matter what height is set, the scrollbars will always appear because the inner content node will take the same height plus the padding and border.
              Hide
              Permalink
              Arturo Zambrano added a comment -

              r51448: set the overflow CSS property to hidden on the main content pane, since the inner content pane will now contain the overflow:auto; styling (and thus, the scrollbars will appear as part of the inner content pane, if necessary)

              Taking into account the padding and border when calculating this height, wouldn't solve the problem, since the inner content node will always be the exact same height as the outer div, simply because of the "height:100%;" setting, plus the padding, which will still be applied on top of that, so the contents would always be taller than the outer div, regardless of how the height is calculated.

              Show
              Arturo Zambrano added a comment - r51448: set the overflow CSS property to hidden on the main content pane, since the inner content pane will now contain the overflow:auto; styling (and thus, the scrollbars will appear as part of the inner content pane, if necessary) Taking into account the padding and border when calculating this height, wouldn't solve the problem, since the inner content node will always be the exact same height as the outer div, simply because of the "height:100%;" setting, plus the padding, which will still be applied on top of that, so the contents would always be taller than the outer div, regardless of how the height is calculated.
              Arturo Zambrano made changes -
              Status Open [ 1 ] Resolved [ 5 ]
              Resolution Fixed [ 1 ]
              Repository Revision Date User Message
              ICEsoft Public SVN Repository #51448 Mon Apr 24 16:52:55 MDT 2017 art.zambrano ICE-11292 set overflow CSS property to hidden on the main content pane, since the inner content pane will now contain the overflow:auto; styling
              Files Changed
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/src/org/icefaces/ace/component/accordion/AccordionPaneRenderer.java
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/resources/icefaces.ace/jquery/ui/readme.txt
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/resources/icefaces.ace/jquery/ui/jquery-ui.js
              Liana Munroe made changes -
              Attachment horizontal.PNG [ 22507 ]
              Liana Munroe made changes -
              Resolution Fixed [ 1 ]
              Status Resolved [ 5 ] Reopened [ 4 ]
              Hide
              Permalink
              Ken Fyten added a comment -

              When testing Emporium (IF4 trunk, svn rvn#51455) I'm seeing an issue when the browser window is resized.

              1. Open emporium.
              2. Make window wider, emporium app resizes appropriately.
              3. Make window narrower, emporium app doesn't shrink again like it should.
              Show
              Ken Fyten added a comment - When testing Emporium (IF4 trunk, svn rvn#51455) I'm seeing an issue when the browser window is resized. Open emporium. Make window wider, emporium app resizes appropriately. Make window narrower, emporium app doesn't shrink again like it should.
              Hide
              Permalink
              Arturo Zambrano added a comment -

              r51498: changed <li> elements for <p> elements with bvllet characters to avoid the issue of <li> elements taking the entire width and causing the horizontal scrollbars to appear

              r51499: ace:dataTable, modified the adjust footer width function to allow making the footer shorter when resizing the window

              The app wasn't shrinking only when tabs that contain an ace:dataTable were being displayed, and that was because an automatic width adjustment of the table footer (ICE-10727), which didn't allow to make it shorter.

              I could never see that brief appearance of the vertical scrollbars.

              Show
              Arturo Zambrano added a comment - r51498: changed <li> elements for <p> elements with bvllet characters to avoid the issue of <li> elements taking the entire width and causing the horizontal scrollbars to appear r51499: ace:dataTable, modified the adjust footer width function to allow making the footer shorter when resizing the window The app wasn't shrinking only when tabs that contain an ace:dataTable were being displayed, and that was because an automatic width adjustment of the table footer ( ICE-10727 ), which didn't allow to make it shorter. I could never see that brief appearance of the vertical scrollbars.
              Arturo Zambrano made changes -
              Status Reopened [ 4 ] Resolved [ 5 ]
              Resolution Fixed [ 1 ]
              Repository Revision Date User Message
              ICEsoft Public SVN Repository #51498 Tue May 09 14:23:14 MDT 2017 art.zambrano ICE-11292 changed <li> elements for <p> elements with bvllet characters to avoid the issue of <li> elements taking the entire width and causing the horizontal scrollbars to appear
              Files Changed
              Commit graph MODIFY /icefaces4/trunk/icefaces/samples/ace/emporium/src/main/webapp/WEB-INF/includes/about-tab.xhtml
              Repository Revision Date User Message
              ICEsoft Public SVN Repository #51499 Tue May 09 14:26:01 MDT 2017 art.zambrano ICE-11292, ICE-10727 ace:dataTable, modified the adjust footer width function to allow making the footer shorter when resizing the window
              Files Changed
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/resources/icefaces.ace/datatable/datatable.js
              Liana Munroe made changes -
              Attachment vertical.png [ 22519 ]
              Hide
              Permalink
              Liana Munroe added a comment -

              Tested with ICEfaces 4 trunk r51500, Tomcat 8, MS Edge, IE 11, 10, 9, 8, FF 47, Chrome 57.
              Verified that the extraneous horizontal scroll bars and resizing issue are fixed. I set up a test machine for Art to view the vertical scrollbars appearing when expanding or contracting an accordionPane . See screen shot vertical.PNG captured on my machine.

              Show
              Liana Munroe added a comment - Tested with ICEfaces 4 trunk r51500, Tomcat 8, MS Edge, IE 11, 10, 9, 8, FF 47, Chrome 57. Verified that the extraneous horizontal scroll bars and resizing issue are fixed. I set up a test machine for Art to view the vertical scrollbars appearing when expanding or contracting an accordionPane . See screen shot vertical.PNG captured on my machine.
              Hide
              Permalink
              Arturo Zambrano added a comment -

              r51505: fix to prevent vertical scrollbars from showing while applying effects

              Show
              Arturo Zambrano added a comment - r51505: fix to prevent vertical scrollbars from showing while applying effects
              Repository Revision Date User Message
              ICEsoft Public SVN Repository #51505 Wed May 10 13:57:19 MDT 2017 art.zambrano ICE-11292 fix to prevent vertical scrollbars from showing while applying effects
              Files Changed
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/resources/icefaces.ace/accordion/accordion.js
              Hide
              Permalink
              Liana Munroe added a comment -

              Tested with ICEfaces 4 trunk r51505, tomcat 8.
              The vertical scrollbars are no longer appearing however this fix causes a js console error in the showcase Required Styling demos:

              TypeError: a.newContent.get(...) is undefined
http://localhost:8080/showcase2542/javax.faces.resource/coalesced.js.jsf?ln=ice.core&dgst=m2ofw5
Line 14089
              Show
              Liana Munroe added a comment - Tested with ICEfaces 4 trunk r51505, tomcat 8. The vertical scrollbars are no longer appearing however this fix causes a js console error in the showcase Required Styling demos: TypeError: a.newContent.get(...) is undefined http: //localhost:8080/showcase2542/javax.faces.resource/coalesced.js.jsf?ln=ice.core&dgst=m2ofw5 Line 14089
              Liana Munroe made changes -
              Resolution Fixed [ 1 ]
              Status Resolved [ 5 ] Reopened [ 4 ]
              Hide
              Permalink
              Arturo Zambrano added a comment -

              r51513: fix to prevent null pointer exceptions in cases where an accordion panel has only one pane

              Show
              Arturo Zambrano added a comment - r51513: fix to prevent null pointer exceptions in cases where an accordion panel has only one pane
              Arturo Zambrano made changes -
              Status Reopened [ 4 ] Resolved [ 5 ]
              Resolution Fixed [ 1 ]
              Repository Revision Date User Message
              ICEsoft Public SVN Repository #51513 Wed May 10 18:21:34 MDT 2017 art.zambrano ICE-11292 fix to prevent null pointer exceptions in cases where an accordion panel has only one pane
              Files Changed
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/resources/icefaces.ace/accordion/accordion.js
              Hide
              Permalink
              Liana Munroe added a comment -

              Verified ICEfaces 4 trunk r51513, Tomcat 8, MS Edge, IE 11, 10, 9, 8, FF 47, Chrome 57.

              Show
              Liana Munroe added a comment - Verified ICEfaces 4 trunk r51513, Tomcat 8, MS Edge, IE 11, 10, 9, 8, FF 47, Chrome 57.
              Ken Fyten made changes -
              Status Resolved [ 5 ] Closed [ 6 ]

                People

                • Assignee:
                  Arturo Zambrano
                  Reporter:
                  Arturo Zambrano
                • Votes:
                  0 Vote for this issue
                  Watchers:
                  3 Start watching this issue

                  Dates

                  • Created:
                    Updated:
                    Resolved: