ICEfaces
  1. ICEfaces
  2. ICE-11018

mobi:flipswitch styling issue upon toggle

    Details

    • Type: Bug Bug
    • Status: Closed
    • Priority: Major Major
    • Resolution: Fixed
    • Affects Version/s: EE-4.1.0.RC1
    • Fix Version/s: EE-4.1.0.GA, 4.2.BETA, 4.2
    • Component/s: MOBI-Components
    • Labels:
      None
    • Environment:
      ICEfaces EE-4.1, ICEfaces 4 trunk r48675, Tomcat 8, all browsers and devices.
    • Assignee Priority:
      P2

      Description

      When first loading the page the flipswitches look as expected. After toggling the flipswitch it becomes noticeably smaller. See attached screen shots 1.PNG (before toggle) and 2.PNG (after toggle)
      To demonstrate open the showcase > mobi:flipswitch demo
      Toggle the flipswitches one or more times until the change in styling is seen.
      1. 1.PNG
        11 kB
      2. 2.PNG
        12 kB

        Activity

        Liana Munroe created issue -
        Liana Munroe made changes -
        Field Original Value New Value
        Attachment 1.PNG [ 22197 ]
        Attachment 2.PNG [ 22198 ]
        Ken Fyten made changes -
        Assignee Judy Guglielmin [ judy.guglielmin ]
        Fix Version/s EE-4.1.0.GA [ 12171 ]
        Affects Version/s 4.2 [ 12870 ]
        Assignee Priority P2 [ 10011 ]
        Ken Fyten made changes -
        Assignee Judy Guglielmin [ judy.guglielmin ] Arturo Zambrano [ artzambrano ]
        Repository Revision Date User Message
        ICEsoft Public SVN Repository #48828 Thu May 19 11:02:41 MDT 2016 art.zambrano ICE-11018 added more specificity to the flipswitch's CSS classes, in order to prevent jQuery UI classes from overriding its core styling
        Files Changed
        Commit graph MODIFY /icefaces4/trunk/icefaces/mobi/component/resources/org.icefaces.component.flipswitch/flip-switch.css
        Hide
        Arturo Zambrano added a comment -

        r48828: added more specificity to the flipswitch's CSS classes, in order to prevent jQuery UI classes from overriding its core styling

        What happens when activating a flipswitch for the first time after deploying the app and clearing the cache is that jquery-ui.css is loaded on the page and placed at the end of the <head> element, thus, giving precedence to all the CSS classes it contains. In particular, .ui-button was overriding the paddings of the flipswitch buttons. So, this was avoided by adding more specificity to the core CSS classes for those buttons.

        However, this behaviour of dynamically loading jquery-ui.css is still happening and it's affecting the font of the entire page. It's slightly noticeable, though. It seems to be a resource coalescing situation, since this doesn't occur when resource coalescing is turned off. What's weird is that jquery-ui.css is only loaded in this way at the first ajax request if there's a mobi:fieldSetGroup component on the page, which doesn't have jquery-ui.css as one of its resource dependencies, and its resource-dependencies don't depend on it either.

        Show
        Arturo Zambrano added a comment - r48828: added more specificity to the flipswitch's CSS classes, in order to prevent jQuery UI classes from overriding its core styling What happens when activating a flipswitch for the first time after deploying the app and clearing the cache is that jquery-ui.css is loaded on the page and placed at the end of the <head> element, thus, giving precedence to all the CSS classes it contains. In particular, .ui-button was overriding the paddings of the flipswitch buttons. So, this was avoided by adding more specificity to the core CSS classes for those buttons. However, this behaviour of dynamically loading jquery-ui.css is still happening and it's affecting the font of the entire page. It's slightly noticeable, though. It seems to be a resource coalescing situation, since this doesn't occur when resource coalescing is turned off. What's weird is that jquery-ui.css is only loaded in this way at the first ajax request if there's a mobi:fieldSetGroup component on the page, which doesn't have jquery-ui.css as one of its resource dependencies, and its resource-dependencies don't depend on it either.
        Arturo Zambrano made changes -
        Status Open [ 1 ] Resolved [ 5 ]
        Resolution Fixed [ 1 ]
        Hide
        Ken Fyten added a comment -

        Re-opened to have Mircea investigate the resource coalescing issue noted here.

        Show
        Ken Fyten added a comment - Re-opened to have Mircea investigate the resource coalescing issue noted here.
        Ken Fyten made changes -
        Resolution Fixed [ 1 ]
        Status Resolved [ 5 ] Reopened [ 4 ]
        Assignee Arturo Zambrano [ artzambrano ] Mircea Toma [ mircea.toma ]
        Hide
        Mircea Toma added a comment - - edited

        Indeed that was a problem in the ResourceOrdering system event listener where the resources that do not have ordering information could end up duplicated when coalesced.
        Fixed the resource ordering to avoid having resource duplication. Tested and confirmed the fix by running the trunk code with Art's commit reverted.

        Show
        Mircea Toma added a comment - - edited Indeed that was a problem in the ResourceOrdering system event listener where the resources that do not have ordering information could end up duplicated when coalesced. Fixed the resource ordering to avoid having resource duplication. Tested and confirmed the fix by running the trunk code with Art's commit reverted.
        Mircea Toma made changes -
        Status Reopened [ 4 ] Resolved [ 5 ]
        Resolution Fixed [ 1 ]
        Repository Revision Date User Message
        ICEsoft Public SVN Repository #48864 Mon May 30 18:32:45 MDT 2016 mircea.toma ICE-11018 Fixed resource ordering to avoid having resource duplication for the resources that do not have ordering information.
        Files Changed
        Commit graph MODIFY /icefaces4/trunk/icefaces/core/src/main/java/org/icefaces/impl/event/ResourceOrdering.java
        Hide
        Liana Munroe added a comment - - edited

        Verified ICEfaces 4 trunk r48864, Tomcat 8, IE edge, 11, 10, Chrome 50, FF 43 desktop browsers, ios 9.3.2 ipad and android 6.0.1 phone

        Show
        Liana Munroe added a comment - - edited Verified ICEfaces 4 trunk r48864, Tomcat 8, IE edge, 11, 10, Chrome 50, FF 43 desktop browsers, ios 9.3.2 ipad and android 6.0.1 phone
        Ken Fyten made changes -
        Security Private [ 10001 ]
        Hide
        Liana Munroe added a comment -

        ICEfaces EE-4.1.0.GA Jenkins build 2, Tomcat 8, IE 11, 10, Chrome 50, FF 43 desktop browsers, ios 9.3.2 ipad and android 6.0.1 phone

        Show
        Liana Munroe added a comment - ICEfaces EE-4.1.0.GA Jenkins build 2, Tomcat 8, IE 11, 10, Chrome 50, FF 43 desktop browsers, ios 9.3.2 ipad and android 6.0.1 phone
        Ken Fyten made changes -
        Fix Version/s 4.2.BETA [ 13091 ]
        Fix Version/s 4.2 [ 12870 ]
        Ken Fyten made changes -
        Status Resolved [ 5 ] Closed [ 6 ]

          People

          • Assignee:
            Mircea Toma
            Reporter:
            Liana Munroe
          • Votes:
            0 Vote for this issue
            Watchers:
            4 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved: