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

              Descending order - Click to sort in ascending order
              Hide
              Permalink
              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
              Hide
              Permalink
              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
              Hide
              Permalink
              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.
              Hide
              Permalink
              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.
              Hide
              Permalink
              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.

                People

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

                  Dates

                  • Created:
                    Updated:
                    Resolved: