Skip to main content
MaxBarrass
New Participant
February 16, 2019

using data-sly-element and data-sly-unwrap creates malfromed html

  • February 16, 2019
  • 9 replies
  • 26822 views

Hi all, does any one else have this problem?

doing this:

<div data-sly-unwrap="${true}" data-sly-element="${'span'}">

    TEST

    </div>

creates this:

<span

    TEST

    </span>

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

    9 replies

    MaxBarrass
    New Participant
    February 19, 2019

    So if I refer to the:

    Block Statements Priority

    When used on the same element, the following priority list defines how block statements are evaluated:

    1. data-sly-template
    2. data-sly-set, data-sly-test, data-sly-use
    3. data-sly-call
    4. data-sly-text
    5. data-sly-element, data-sly-include, data-sly-resource
    6. data-sly-unwrap
    7. data-sly-list, data-sly-repeat
    8. data-sly-attribute

    When two block statements have the same priority, their evaluation order is from left to right.

    This would mean that when this is evaluated:

    <thisdoesnotwork data-sly-unwrap="${true}" data-sly-element="${'div'}">TEST</thisdoesnotwork>

    Then data-sly-element will convert this line into :

    <div data-sly-unwrap="${true}" >TEST</div>

    Then the unwarp should change it into

    TEST

    Desired outcome.

    Obviously right now I had to do it the long way.

    Also please note that the first line also has a wierd tab characted output when this happens, I am sure people would have noticed this as well, when they tested this.

    {TAB}<span    // missing closing brace

    {space}{space}{space}{space}TEST

    {space}{space}</span>

    https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#3-special-html-tags

    arunpatidar
    New Participant
    February 18, 2019

    Hi,

    If you want text without tag you can use below:

    <span data-sly-unwrap="${true}">

        Text

        </span>

    if you want Text within span, simply use like below:

    <span> Text </span>

    Arun Patidar
    Gaurav-Behl
    New Participant
    February 16, 2019

    I can reproduce this with both sly or div tags, it generates malformed structure, probably because 'editor' also uses <span> tags internally -

    <sly data-sly-unwrap="${true}" data-sly-element="${'span'}">

        TEST

        </sly>

    <span    // missing closing brace

        TEST

        </span>

    You should open a bug for this..

    MaxBarrass
    New Participant
    February 16, 2019

    this happens to any tag you use

        <whatyousayin data-sly-unwrap="${'false'}" data-sly-element="${'div'}">

        TEST

        </whatyousayin>

        <whatyousayin data-sly-unwrap="${'true'}" data-sly-element="${'div'}">

        TEST

        </whatyousayin>

        <whatyousayin data-sly-unwrap="${''}" data-sly-element="${'div'}">

        TEST

        </whatyousayin>

        <whatyousayin data-sly-unwrap="${}" data-sly-element="${'div'}">

        TEST

        </whatyousayin>

    as soon as you remove unwrap works fine

        <whatyousayin  data-sly-element="${'div'}">

        TEST

        </whatyousayin>

    VeenaVikraman
    New Participant
    February 17, 2019

    Hi Max

      I know the above issue is persisting and might need a bug ticket to fix the same, I was wondering , why you need to do

    <div data-sly-unwrap="${true}" data-sly-element="${'span'}">

        TEST

        </div>

      when

    <span data-sly-unwrap="${true}" >

        TEST

        </span> will work in your case.

    Thanks

    Veena

    smacdonald2008
    New Participant
    February 16, 2019

    For proper syntax for HTL - please consult the HTL Spec here -- htl-spec/SPECIFICATION.md at master · adobe/htl-spec · GitHub