When I embed a view, I’m seeing the following wrapping divs (Note: I’m using just the core views module templates):
<div class="views-element-container"> <div class="js-view-dom-id-ETC"> // Content I care about here </div> </div>
I’ve seen the same kind of component on a number of projects: A paragraph (or block, or whatever) where a user can manually choose a number of blog posts, via entity_reference, or they can enter a tag and have the component populate with the most recent blog posts of that tag. Typically, I embed a view with contextual filter for the most recent by tag option, and just display the field if they’re manually chosen.
The annoying issue I run in to is that the markup is different, largely because of these two divs. For example:
// Manually Selected: <div class="my-element"> <article /> <article /> <article /> </div> // Tag selected: <div class="my-element"> <div class="views-element-container"> <div class="js-view-dom-id-ETC"> <article /> <article /> <article /> </div> </div> </div>
I see that the
js-view-dom-id-ETC div is added in
views-view.html.twig and can be easily removed – my assumption here is that if my view is not interactive (no paging, no filters, it’d never be refreshed in any way – it’s really just used as a query builder) then it’s totally fine to remove this div.
views-element-container div is a little more complicated to get rid of, but again, I’m assuming it’s fine to do so if my view is not interactive.
Doing a string search of the views module for
views-element-container, I can see that it’s only referenced in tests.
From a functional standpoint, are my assumptions correct here? Are these divs only necessary with interactive views that use AJAX?