Re-work off-canvas javascript to fix the UI and prevent random failures

Problem/Motivation

The problem outlined in https://www.drupal.org/project/drupal/issues/3359465 🐛 Layout builder off-canvas positioning problem when resizing browser Needs work was likely created by changing a boolean from false to true in a Drupal.debounce call. After it was set to true, it caused problems with the UI where resizing triggers seem to be out of step with one another, resulting in the off-canvas tray not being in alignment with the position of the main canvas. However, that change was made to resolve random test failures that had been a problem before: https://www.drupal.org/project/drupal/issues/3350972 🐛 [random test failure] Drupal\Tests\layout_builder\FunctionalJavascript\LayoutBuilderUiTest::testReloadWithNoSections() Fixed . It was speculated in that issue that the random test failures were probably and indication of real world random intermittent failures that probably don't happen often enough that they get reported.

However, the sum of the two issues above is that neither approach fully "works". Either we have random intermittent failures or a broken UI. Because the change was flipping the value of a boolean, we have exhausted the options presented by adjusting that one variable. This would seem to indicate that the off-canvas javascript needs to be reworked to fix both issues.

Steps to reproduce

Follow the steps to reproduce in https://www.drupal.org/project/drupal/issues/3359465 🐛 Layout builder off-canvas positioning problem when resizing browser Needs work .
Apply the patch from that issue or manually change code as indicated by the patch.
Observe that the patch seems to fix the funky UI behavior.
Note also that the patch seems to reintroduce some test failures.

Proposed resolution

TBD

Remaining tasks

TBD

User interface changes

TBD

API changes

TBD

Data model changes

TBD

Release notes snippet

TBD