AJAX views pager not working when rendered through layout builder

Created on 16 July 2024, 9 months ago

Problem/Motivation

When rendering a view with an AJAX pager through layout builder, either directly or through other means (e.g. Views Reference Field β†’ on a content block), the pager does not receive the AJAX behavior, and instead reloads the page with the non-AJAX page query parameter appended.

At first glance it doesn't appear to be an issue with what's being #attached to the view. I've inspected both renderings through a post-render hook in a custom module, see below, and the only differences are the ones you'd expect such as their respective view_dom_ids.

function hook_views_post_render(ViewExecutable $view, &$output, CachePluginBase $cache) {
  dpm($view->element['#attached'], $view->id());
}

The rendering within Layout Builder has no trace of data-once="ajax-pager". Inspecting drupalSettings.views shows the view is found, though it doesn't receive the behavior.

If I render the view on the same page through a region, it receives the intended ajax-pager behavior.

At this point I have exhausted my knowledge on both the Layout Builder and Views APIs. Further debugging would from someone with more intimate knowledge of the aforementioned APIs would be much appreciated.

I have been able to reliably reproduce this issue using a standard DDEV install on Drupal 10.3.1 and PHP 8.3.

Steps to reproduce

  1. Enable the Layout Builder module
  2. Add multiple Articles nodes to test the pager with
  3. Create a content view with an AJAX pager, either full or mini, and set a per-page count smaller than the amount of nodes you created so paging can be tested
  4. Create a new vocabulary that uses Layout Builder for the default display mode
  5. Manage the layout for the new vocabulary and add a new section with the AJAX view inside
  6. Add a term to the new vocabulary and view it on the front end
  7. Interact with the AJAX view's pager and observe a page reload with the non-AJAX page query parameter appended

Proposed resolution

TBD

Remaining tasks

  • Find the cause of the issue
  • Implement a fix
πŸ› Bug report
Status

Active

Version

10.3 ✨

Component
Layout builder  β†’

Last updated 1 day ago

Created by

πŸ‡ΊπŸ‡ΈUnited States FrankieD3

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @FrankieD3
  • πŸ‡³πŸ‡ΏNew Zealand danielveza Brisbane, AU

    Confirming that I can replicate this on D11, so updating the version.

    It's a strange one. 2x pagers render specfically when embedding a views block in LB, but only on taxonomy term pages. An additional mini pager is rendered along with the one that comes from the view.

    If you embed a block through the block management on a term without Layout Builder, it works as expected. I changed theme and the issue still happened, so it doesn't appear to be a theme issue.

    Spent a bit of time trying to track this down but couldn't manage it. Leaving these notes here to pick up later.

  • πŸ‡¬πŸ‡§United Kingdom catch

    Is this reproducible on 10.2.x? Might need a git bisect potentially.

  • πŸ‡³πŸ‡ΏNew Zealand quietone
  • πŸ‡ΊπŸ‡ΈUnited States FrankieD3
  • πŸ‡ΊπŸ‡ΈUnited States FrankieD3

    I can confirm that this is reproducible in 10.2.x, as well as the additional pager render mentioned in #2.

  • πŸ‡³πŸ‡ΏNew Zealand danielveza Brisbane, AU

    Ah ok - I tracked this down.

    This issue stems from the fact that /taxonomy/term/X is already a view page, that also embeds terms in the view header. The workaround is to disable the taxonomy term view, since it's not needed if you're using LB with a term page.

    This feels like a pretty painful spider web to untangle, I wonder if we should add a warning when you enable LB on a vocab display to make sure that either the view is disabled or a filter has been added to the view so exclude this particular vocab

  • πŸ‡¬πŸ‡§United Kingdom catch

    This issue stems from the fact that /taxonomy/term/X is already a view page, that also embeds terms in the view header. The workaround is to disable the taxonomy term view, since it's not needed if you're using LB with a term page.

    Wait so was the taxonomy/term/x view executing but not rendering? Or both views were rendered on the page?

  • πŸ‡ΊπŸ‡¦Ukraine rollins

    This issue is not only for taxonomy terms.
    I am rendering commerce orders and have the same bug.
    The pager does not appear on the layout builder page.
    Drupal core 10.3.1

  • πŸ‡³πŸ‡±Netherlands johnv

    This seems to be a problem with ajax pager on any view.

  • πŸ‡³πŸ‡±Netherlands mrcdrx

    I can confirm this issue. In Views I've set the amount of items to show to 9. In the placement of the block in Layout Builder I've set the amount to 3. The pager works, but after going back to the first page, the setting of the Layout Builder placement is ignored and the inital setting of the View is being used.

Production build 0.71.5 2024