Layout builder off-canvas positioning problem when resizing browser

added a gif for fun

I have attached patch for same. please review

The last submitted patch, 8: 3359465-8.patch, failed testing. View results →

Tested patch #8 in Drupal 10.1.0 and it works great. Thanks @Gauravvvv

I don't know why the tests failed

@bwaindwain I think the whole reason the original change was made was because of random test failures, so I think it makes sense that the test fails again with the patch reverting that change: https://www.drupal.org/project/drupal/issues/3350972 🐛 [random test failure] Drupal\Tests\layout_builder\FunctionalJavascript\LayoutBuilderUiTest::testReloadWithNoSections() Fixed .

Looking through that original issue, it seems like either state causes problems. In all likelihood this means that the JS needs to be revamped to fix this in a way that won't cause periodic failures (like in the test) or the behavior described in this issue.

I opened a separate issue to address the broader issues here in a way that won't just reintroduce a random test failures: https://www.drupal.org/project/drupal/issues/3411496 🐛 Re-work off-canvas javascript to fix the UI and prevent random failures Active

Gauravvvv, thanks for the patch, it works well.
I did some testing and found that if add some more timeout, then resize looks slightly.

Updated patch, increased timeout.

Updated the last patch to make it smoother during resizing and fixed width changes during resizing.

When resizing quickly, the solution in #16 results in an unwanted width increase of the off canvas dialog.

#15 seems to work but it does so at the expense of removing debounce functionality which had been working fine until the fix-the-tests changes in 🐛 [random test failure] Drupal\Tests\layout_builder\FunctionalJavascript\LayoutBuilderUiTest::testReloadWithNoSections() Fixed . It is probably worth exploring options that maintain debounce and allow tests to work. It's possible the ideal solution is with changes that only impact test runs in a test-only module, allowing the debounce calls to be switched back to the way they were when they worked reliably.

I reverted the change made in #3350972: [random test failure] Drupal\Tests\layout_builder\FunctionalJavascript\LayoutBuilderUiTest::testReloadWithNoSections() 🐛 [random test failure] Drupal\Tests\layout_builder\FunctionalJavascript\LayoutBuilderUiTest::testReloadWithNoSections() Fixed so that we are back to the original use of debounce functionality as discussed in #17 🐛 Layout builder off-canvas positioning problem when resizing browser Needs work and the test are also passing.

By just reverting the change, it will likely reintroduce the intermittent failure. You can determine if this is happening by customizing drupalci.yml → to run the test multiple times while skipping other tests, such as how it was done in issue #3350972. See this patch → for how the test in question was run repeatedly to check for the intermittent failure.

• If the test is no longer intermittently failing, it's probably worth checking with contributors that worked on #3350972 and see if they are confident that this reversion is fine
• If the test is still intermittently failing, then the fix from #3350972 or something equivalent should be added in a test-only module so it addresses the intermittent failures without impacting real-user UI interaction.