ICEfaces
  1. ICEfaces
  2. ICE-10433

Normalize component support for HTML5 Passthrough attributes

          Details

          • Type: Improvement Improvement
          • Status: Closed
          • Priority: Major Major
          • Resolution: Fixed
          • Affects Version/s: 4.0
          • Fix Version/s: EE-4.0.0.GA, 4.1
          • Component/s: ACE-Components, MOBI-Components
          • Labels:
            None
          • Environment:
            ICEfaces 4 ACE and MOBI Components
          • Assignee Priority:
            P1

            Description

            Currently, HTML5 passthrough attributes are being rendered out into the outer-most/first rendered DOM element rendered by the component. This appears to be an automatic rendering behaviour done by JSF 2.2.

            Unfortunately, this results in none-operative pass-through attributes as the ACE and MOBI components typically use multiple levels of elements in their rendering, including a top-level SPAN or DIV that surrounds the component. Thus, the pass-through attributes are ending up on the SPAN or DIV and not targeted to the functional input or button elements where they would be functional.

            This JIRA is to make whatever changes are necessary in the ACE and MOBI components to have the pass-through attributes rendered onto the logical functional input element rendered by each component.

              Issue Links

              blocks

              Improvement - An improvement or enhancement to an existing feature or task. ICE-10434 Deprecate ACE component attributes that overlap with HTML5 passthrough attributes

              • Major - Major loss of function.
              • Closed

                Activity

                Ascending order - Click to sort in descending order
                Hide
                Permalink
                Ken Fyten added a comment -

                Example A (ace:textAreaEntry w/ p:placeholder="placeholder")

                <span id="form2:emailInput" placeholder="placeholder">
<span id="form2:emailInput_markup" class="ui-textareaentry-container">
<textarea id="form2:emailInput_input" class="ui-inputfield ui-textareaentry ui-widget ui-state-default ui-corner-all ui-state-optional ui-textareaentry-resizable" role="textbox" placeholder="placeholder" onfocus="var widget_form2_emailInput = ice.ace.lazy("TextAreaEntry",["form2:emailInput",{"inFieldLabelStyleClass":"ui-input-label-infield","maxlength":0,"placeholder":"placeholder"}]);" name="form2:emailInput_input" aria-multiline="true"/>
</span>

                In this scenario, the "p:placeholder" attribute is being picked up by both the JSF passthrough attribute handler, which is adding it to the outer SPAN element, and also by the ace:textAreaEntry component itself (which has a "placeholder" attribute), which renders it onto the TEXTAREA element. It appears that the component ignores any namespace prefix on the attribute name and simply processes it as it's own attribute, whether or not a valid namespace prefix exists in front of it.

                Example B (ace:textAreaEntry w/ placeholder="placeholder")

                <span id="form2:emailInput">
<span id="form2:emailInput_markup" class="ui-textareaentry-container">
<textarea id="form2:emailInput_input" class="ui-inputfield ui-textareaentry ui-widget ui-state-default ui-corner-all ui-state-optional ui-textareaentry-resizable" role="textbox" placeholder="placeholder" onfocus="var widget_form2_emailInput = ice.ace.lazy("TextAreaEntry",["form2:emailInput",{"inFieldLabelStyleClass":"ui-input-label-infield","maxlength":0,"placeholder":"placeholder"}]);" name="form2:emailInput_input" aria-multiline="true"/>

                Here we see the component processing the attribute as it's own, which is the expected behaviour in this scenario.

                Show
                Ken Fyten added a comment - Example A (ace:textAreaEntry w/ p:placeholder="placeholder") <span id= "form2:emailInput" placeholder= "placeholder" > <span id= "form2:emailInput_markup" class= "ui-textareaentry-container" > <textarea id= "form2:emailInput_input" class= "ui-inputfield ui-textareaentry ui-widget ui-state- default ui-corner-all ui-state-optional ui-textareaentry-resizable" role= "textbox" placeholder= "placeholder" onfocus= " var widget_form2_emailInput = ice.ace.lazy(" TextAreaEntry ",[" form2:emailInput ",{" inFieldLabelStyleClass ":" ui-input-label-infield "," maxlength ":0," placeholder ":" placeholder "}]);" name= "form2:emailInput_input" aria-multiline= " true " /> </span> In this scenario, the "p:placeholder" attribute is being picked up by both the JSF passthrough attribute handler, which is adding it to the outer SPAN element, and also by the ace:textAreaEntry component itself (which has a "placeholder" attribute), which renders it onto the TEXTAREA element. It appears that the component ignores any namespace prefix on the attribute name and simply processes it as it's own attribute, whether or not a valid namespace prefix exists in front of it. Example B (ace:textAreaEntry w/ placeholder="placeholder") <span id= "form2:emailInput" > <span id= "form2:emailInput_markup" class= "ui-textareaentry-container" > <textarea id= "form2:emailInput_input" class= "ui-inputfield ui-textareaentry ui-widget ui-state- default ui-corner-all ui-state-optional ui-textareaentry-resizable" role= "textbox" placeholder= "placeholder" onfocus= " var widget_form2_emailInput = ice.ace.lazy(" TextAreaEntry ",[" form2:emailInput ",{" inFieldLabelStyleClass ":" ui-input-label-infield "," maxlength ":0," placeholder ":" placeholder "}]);" name= "form2:emailInput_input" aria-multiline= " true " /> Here we see the component processing the attribute as it's own, which is the expected behaviour in this scenario.
                Hide
                Permalink
                Judy Guglielmin added a comment -

                rev 43977 for source, rev 40584 for qa test

                Show
                Judy Guglielmin added a comment - rev 43977 for source, rev 40584 for qa test
                Hide
                Permalink
                Liana Munroe added a comment -

                Verified ICEfaces 4 trunk r44012. Tomcat 7, IE 11, Chrome 40, FF 34. After speaking with Judy it was confirmed that some attributes such as placeholder may still appear in the higher level span as well as at the input level.

                Show
                Liana Munroe added a comment - Verified ICEfaces 4 trunk r44012. Tomcat 7, IE 11, Chrome 40, FF 34. After speaking with Judy it was confirmed that some attributes such as placeholder may still appear in the higher level span as well as at the input level.

                  People

                  • Assignee:
                    Judy Guglielmin
                    Reporter:
                    Ken Fyten
                  • Votes:
                    0 Vote for this issue
                    Watchers:
                    3 Start watching this issue

                    Dates

                    • Created:
                      Updated:
                      Resolved: