Uploaded image for project: 'PUBLIC - Liferay Portal Community Edition'
  1. PUBLIC - Liferay Portal Community Edition
  2. LPS-70588

When + operator is used, CSS calc() function will result into an invalid property value

    Details

      Description

      Reproduction Steps:
      1) Get 6.2 fbb0b31fbf18b92bd03408171a73766c24ef3595start it, login as admin
      2) Edit the Look and Feel of the Sign In portlet and add the below CSS with some other property e.g. color :

      .portlet-login {
      	width: calc(50% + 10px);
              color: green;
      }
      

      3) Save and refresh the page
      4) Inspect the page and get the width of the CSS element (div.portlet-body of Sign In portlet)

      Expected result: Such styling to be applied
      Actual result: The styling is not applied, there will be a message saying "Invalid property value" (pls see screenshot reproduced.png)
      Branch:
      Reproduced on +6.2.x @ e42a82511b232d7dd7a711cdce095d5249ef81c4

      Master:
      Seems fixed @ 2bc8839f43e37af7319dcdc327cbd3eee10369ba on Hello World portlet, although It looks like there is no change in the yui-compressor used, compared to 6.2.x

      Info
      Root cause seems to be that yui compressor strips calc(50% + 10px); as calc(50%+10px); ,whereby the spaces are removed but would need to be preserved.

      Related discussion: https://github.com/yui/yuicompressor/issues/59

      Seems to be fixed here:
      https://github.com/yui/yuicompressor/pull/107
      https://github.com/yui/yuicompressor/commit/849356ce1493557b58fea14be2ab2111598c455b

      and included in YUI Compressor v2.4.9: https://github.com/yui/yuicompressor/issues/59#issuecomment-25393403

      In 6.2, the css returns as minified after this call: https://github.com/liferay/liferay-portal-ee/blob/ee-6.2.x/portal-impl/src/com/liferay/portal/servlet/filters/strip/StripFilter.java#L293
      The reason this issue is not reproducible on current master @ bfa109dfe5289121ec56d9d55395605826addecf it it looks is because StripFilter.processCSS() is never called because it fails the following check: https://github.com/liferay/liferay-portal/blob/master/portal-impl/src/com/liferay/portal/servlet/filters/strip/StripFilter.java#L659

        Attachments

        1. fixed.png
          fixed.png
          15 kB
        2. reproduced.png
          reproduced.png
          131 kB

          Issue Links

            Activity

              People

              • Votes:
                0 Vote for this issue
                Watchers:
                1 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:
                  Days since last comment:
                  2 years, 10 weeks, 1 day ago

                  Packages

                  Version Package
                  6.2.X EE
                  7.0.0 DXP FP30
                  7.0.4 CE GA5
                  7.1.X
                  Master