Scrolling problems when adding a block via layout builder

Hi everyone! Apologies for the multiple MRs – I am still trying to figure out this new process vs. old skool patching =).

We have a client where the auto-scrolling behavior is causing massive usability problems in Layout Builder when combined with Layout Builder iFrame Modal. MR 3357 removes this in 9.5.x (tested) and MR 3355 removes this in 10.1.x (untested, probably should just let this one be but I will circle back once I get 10.x running). I know there are plans to replace this with something else at some point and I doubt this type of removal will be accepted, but honestly I believe the experience is much better without the auto scrolling.

jds1 → closed merge request !3356

Adding tag for https://www.w3.org/WAI/WCAG21/Understanding/consistent-navigation

In case anyone need a reroll for 10.2.x

hiding patch to make sure folks look at the MR

Unless I'm looking at the wrong place, the patches in #5 & #10 both take different approaches. I think we need some clarity here about which approach is the correct one and sync them up.

nod_ → changed the visibility of the branch 3209129-9.5.x to hidden.

nod_ → closed merge request !3357

closing 9.5.x MR since that version is outdated

re: #22 - It looks like the patch from #5 was made against Drupal 9 (which shipped with *.es6.js files transpiled to es5). #20 seems to be for Drupal ^10.

MR !3355 just straight-up removes the javascript, which isn't a valid approach IMO.

I feel this should be addressed and have test coverage added in a follow-up. Javascript based testing like this is very hard relative to the simplicity of the fix.

Luke.Leber → changed the visibility of the branch 10.1.x to hidden.

andre.bonon → made their first commit to this issue’s fork.

Hi,

Agreed with comment 16.

I have not dug why there is an eventListener on a CSS event but a side effect of JS listening to transitionend event is as soon as any CSS transition happens, like on Olivero put mouse hover shortcut icon or the main menu folding/unfolding when going on top of the page, it scrolls again.

I have tried to put the scroll logic into:

window.addEventListener('dialog:afterclose', (e) => {
    const $element = $(e.target);
    if (Drupal.offCanvas.isOffCanvas($element)) {

But at this moment const $target = $('.is-layout-builder-highlighted'); finds no results while there is still the highlighted block.

I will create a branch which removes the scroll.

Patch for Composer usage for 10.5.x.