Please lose the divs in the lists

Because of my experimenting with plugin outlets. I found two cases of div tags having a list as a parent.

The “breadcrumb” and the “menu links”

<ol class="ember-view category-breadcrumb" id="ember4770">
  <li class="ember-view no-category has-drop bullet" id="ember4772">
    <a aria-expanded="false" aria-label="Display category list" style="background-color: #eee; color: #333" data-ember-action="4774" class="badge-category home" href="">all categories</a>
  <a style="background-color: #eee; color: #333" class="badge-category category-dropdown-button home" data-ember-action="4776" href=""><i class="fa fa-caret-right"></i></a>
  <section class="hidden category-dropdown-menu chooser">
      <div class="cat"><a href="/" class="badge-category home" data-drop-close="true">all categories</a></div>
    </section>
  </li>

  <div class="ember-view bread-crumbs-right-outlet tag-selector" id="ember4773">

    <li class="ember-view tag-drop no-category bullet tag_all" id="ember4778"><!----></li>

  </div>

<div class="clear"></div>

</ol>

.

<ul class="menu-links columned">
  <li><a href="/" class="ember-view d-link latest-topics-link" id="ember4830">Latest</a></li>
  <li><a href="/new" class="ember-view d-link new-topics-link" id="ember4837">New</a></li>
  <li><a href="/unread" class="ember-view d-link unread-topics-link" id="ember4845">Unread (2)</a></li>
  <li><a href="/top" class="ember-view d-link top-topics-link" id="ember4831">Top</a></li>
  <li><a href="/badges" class="ember-view d-link badge-link" id="ember4860">Badges</a></li>
  <li><a href="/users" class="ember-view d-link user-directory-link" id="ember4876">Users</a></li>

  <div class="ember-view site-map-links-outlet tag-cloud-link" id="ember4836">

    <li><a href="/tags" class="ember-view" id="ember4885">Tags</a></li>

  </div>

  <div class="clearfix"></div>

</ul>

I guess it doesn’t break anything, perhaps because browsers do well at “guessing” what the mark-up should be.

Unlike misplaced tags inside of tables, they don’t show up “outside”

    <ol>
      <li>ol list item</li>
      <li>ol list item</li>
    <div>div in an ol</div>
      <li>ol list item</li>
    <div><div>div in a div in an ol</div></div>
      <li>ol list item</li>
    <div><li>list item in a div in an ol</li></div>
      <li>ol list item</li>
    </ol>
    <ul>
      <li>ul list item</li>
      <li>ul list item</li>
    <div>div in a ul</div>
      <li>ul list item</li>
    <div><div>div in a div in a ul</div></div>
      <li>ul list item</li>
    <div><li>list item in a div in a ul</li></div>
      <li>ul list item</li>
    </ul>

I don’t know what would be better, having the divs outside of the lists, or changing the divs to list items, (other?).

But I think even if it hasn’t bitten anyone yet there’s a chance it will eventually.

1 Like

Isn’t this essentially this bug?

1 Like

Looking into it a bit more, I think so.

I was thinking it might be simply moving the outlets to a different place in the hbs file.

But both of those are “components” used in other hbs files.

Not an easy one.

Well I guess as long as it isn’t breaking anything and the issue is known (in case something does have a problem with it) it’s a back-burner concern. Much more pressing things to attend to,