Issue #3369118: Implement inline CSS to prevent toolbar menu flicker

Added anti-flicker CSS to be executed early, preventing full-screen menu flash before the first paint.

Closes #3369118

admin_toolbar.module

@@ -6,6 +6,7 @@
  */
 
 use Drupal\admin_toolbar\Render\Element\AdminToolbar;
+use Drupal\Core\Render\Markup;
 use Drupal\Component\Utility\Html;
 use Drupal\Core\Routing\RouteMatchInterface;
 use Drupal\Core\Url;
@@ -73,3 +74,33 @@ function toolbar_tools_menu_navigation_links(array $tree) {
   }
   return $tree;
 }
+
+/**
+ * Implements hook_page_attachments().
+ */
+function admin_toolbar_page_attachments(array &$page) {
+  // This inline CSS prevents the full-screen menu flash from occurring ahead
+  // of the first paint, it needs replacing with a more permanent solution
+  // see https://www.drupal.org/project/admin_toolbar/issues/3369118
+  $anti_flicker_css = "
+    .toolbar-menu-administration .toolbar-menu .menu-item:not(.hover-intent) .toolbar-menu>li.menu-item {
+      display: none;
+    }
+  ";
+
+  // The anti-flicker CSS is added as an inline tag so it is executed
+  // as early as possible.
+  // This enables it to affect classes that prevent flickering before the first
+  // paint.
+  $page['#attached']['html_head'][] = [
+    [
+      '#tag' => 'style',
+      '#attributes' => [
+        'data-admin-toolbar-anti-flicker-loading' => TRUE,
+      ],
+      // Process through Markup to prevent character escaping.
+      '#value' => Markup::create($anti_flicker_css),
+    ],
+    'anti_flicker_css',
+  ];
+}