XF 2.2 xf:main is not showing xf:explain content

[asprin]

I've the following in the template

<div class="block">
    <div class="block-container">
        <div class="block-body">
            <xf:datalist>                             
                <xf:foreach loop="$events" value="$event">
                    <xf:datarow rowclass="dataList-row--noHover">                       
                        <xf:main href="{{ link('foo/bar/view', $event) }}" label="{$event.title}">                           
                            <xf:explain>
                                <ul class="listInline listInline--bullet">
                                    <li><xf:username user="$event.Owner" /></li>
                                    <li><xf:date time="$event.sys_created_on" /></li>
                                </ul>                               
                            </xf:explain>
                        </xf:main>                                                                     
                    </xf:datarow>
                </xf:foreach>
            </xf:datalist>           
        </div>
    </div>
</div>

This is the resultant output


Expectation was something along the following lines:


If I remove the href attribute from the xf:main tag, then I'm getting the expected output. But if I add it back, I'm getting the first screenshot output.

Looking at the HTML, it seems odd that the dataList-subRow div isn't a child of the dataList-cell--main > a tag

Shouldn't the highlighted yellow div be a child of the anchor tag? What am I missing here?

 

[asprin]

Any help here please?

 

[asprin]

I'm guessing no one is able to reproduce it?

 

[asprin]

Trying out my luck with some tagging @Jeremy P @digitalpoint @Kier @Chris D

 

[Jeremy P]

It works as expected. <xf:username> outputs an <a> tag, and nesting <a> tags is not valid markup. The inspector shows the state of the DOM after the browser applies error correction. If you view the source instead, you will see:

<td class="dataList-cell dataList-cell--link dataList-cell--main">
    <a href="/xen/index.php?foo/bar/3/view" >
        <div class="dataList-mainRow">test 3</div>
        <div class="dataList-subRow">
            <ul class="listInline listInline--bullet">
                <li><a href="/admin.php?users/admin.1/edit" class="username " dir="auto" data-user-id="1"><span class="username--staff username--moderator username--admin">Admin</span></a></li>
                <li><time>...</time></li>
            </ul>
        </div>
    </a>
</td>

If you pass an empty href to <xf:username>, it will use a <span> tag instead:

<div class="block">
    <div class="block-container">
        <div class="block-body">
            <xf:datalist>                             
                <xf:foreach loop="$events" value="$event">
                    <xf:datarow rowclass="dataList-row--noHover">                       
                        <xf:main href="{{ link('foo/bar/view', $event) }}" label="{$event.title}">                           
                            <xf:explain>
                                <ul class="listInline listInline--bullet">
                                    <li><xf:username user="$event.Owner" href="" /></li>
                                    <li><xf:date time="$event.sys_created_on" /></li>
                                </ul>                               
                            </xf:explain>
                        </xf:main>                                                                     
                    </xf:datarow>
                </xf:foreach>
            </xf:datalist>           
        </div>
    </div>
</div>

 

[asprin]

You're a lifesaver! Never would have guessed the xf:username was the culprit. Using the defaultname attribute instead solved the problem.