Removing wrapper div from the categories block

[kjellr]

Fixes #9411

Previously, the categories block was rendered inside a div, while other list-based blocks (archives, latest posts, list, etc.) were not. This update removes the div wrapper for consistency.

Previously, this block would render like this:

<!-- Categories Block -->
<div class="wp-block-categories wp-block-categories-list aligncenter">
  <ul>
    <li class="cat-item cat-item-1"><a href="#">Category</a></li>
    <li class="cat-item cat-item-2"><a href="#">Category</a></li>
    <li class="cat-item cat-item-3"><a href="#">Category</a></li>
  </ul>
</div>

But this change updates that to:

<!-- Categories Block -->
<ul class="wp-block-categories wp-block-categories-list aligncenter">
  <li class="cat-item cat-item-1"><a href="#">Category</a></li>
  <li class="cat-item cat-item-2"><a href="#">Category</a></li>
  <li class="cat-item cat-item-3"><a href="#">Category</a></li>
</ul>

We still need the wrapper div if this is shown as a dropdown, so this doesn't effect that. Seems like a simple change, and doesn't seem to require any css updates.

[tofumatt]

Works for me. Technically it's a breaking change for anyone styling things if they happened to rely on it being a div, but that seems silly anyway 😄 . Dunno how we tend to handle that with markup, but the change itself looks good.

[ZebulanStanphill]

While we're updating the Categories block markup, shouldn't it also use an <ol> instead of a <ul>? The categories are listed in an order, so an <ol> is more appropriate, is it not?

[kjellr]

Technically it's a breaking change for anyone styling things if they happened to rely on it being a div, but that seems silly anyway 😄 . Dunno how we tend to handle that with markup, but the change itself looks good.

Thanks, @tofumatt — I agree that this seems like it'd be a very small fraction of themes. If anything, I've mostly heard from theme authors who dislike that these are inconsistent. 😄 So I think we're good to go.

While we're updating the Categories block markup, shouldn't it also use an <ol> instead of a <ul>? The categories are listed in an order, so an <ol> is more appropriate, is it not?

@ZebulanStanphill: <ol> would render a numbered list, but I can't think of a reason for categories to be associated with a number. <ul> seems more appropriate to me in this case.

[ZebulanStanphill]

@kjellr <ol> is not just for numbered lists. It is for any kind of ordered list. The Latest Comments block uses an <ol>, for example. You just have to style the <ol> to not show the numbers.

[chrisvanpatten]

@ZebulanStanphill I think the difference here is that if the order of the categories were to change, there would be no change in meaning. However, changing the order of comments would change the way they're interpreted, since comments may reply to each other or provide context as a discussion continues.

Per the spec:

The ol element represents a list of items, where the items have been intentionally ordered, such that changing the order would change the meaning of the document.

(Emphasis is mine)