Preview Regions and Preview Content checkboxes are missing

Created on 12 March 2024, 8 months ago
Updated 29 April 2024, 7 months ago

Problem/Motivation

Preview Regions and Preview Content checkboxes are missing in the layout builder. I am using Gin, Gin LB, and Layout Builder Admin Theme.

This issue was created from this comment 🐛 The new sidebar makes UI unusable when using Layout Builder Admin Theme Active .

Steps to reproduce

Here are some screenshots, before and after updating Gin Layout Builder to the latest version. The issue existed even in rc5, though I hadn't realized it until now.

Before (rc5):

After (rc6):

There are also some JavaScript errors in the browser console.

Uncaught TypeError: Cannot read properties of null (reading 'setAttribute')
    at Object.showSidebar (sidebar.js?sa91ma:26:22)
    at sidebar.js?sa91ma:11:94
    at Array.forEach (<anonymous>)
    at Object.init (sidebar.js?sa91ma:9:55)
    at Object.attach (sidebar.js?sa91ma:5:25)
    at drupal.js?v=10.2.4:166:24
    at Array.forEach (<anonymous>)
    at Drupal.attachBehaviors (drupal.js?v=10.2.4:162:34)
    at big_pipe.js?v=10.2.4:153:10
    at big_pipe.js?v=10.2.4:184:3

Uncaught TypeError: Cannot set properties of null (setting 'checked')
    at gin_lb_preview_regions.js?v=10.2.4:21:39
    at Array.forEach (<anonymous>)
    at Object.attach (gin_lb_preview_regions.js?v=10.2.4:7:42)
    at drupal.js?v=10.2.4:166:24
    at Array.forEach (<anonymous>)
    at Drupal.attachBehaviors (drupal.js?v=10.2.4:162:34)
    at big_pipe.js?v=10.2.4:153:10
    at big_pipe.js?v=10.2.4:184:3

Debugging

Uncaught TypeError: Cannot set properties of null (setting 'checked')

In gin_lb_preview_regions.js, these two constants are null:

        const toolbarPreviewRegion = document.getElementById(
          'glb-toolbar-preview-regions',
        );
        const toolbarPreviewContent = document.getElementById(
          'glb-toolbar-preview-content',
        );

This appears to happen because the hook gin_lb_preprocess_toolbar__gin_lb is never called. The preprocessToolbarGinLb would be called in that hook, and that's the function that adds the Preview Regions and Preview Content checkboxes that are missing.

Also, I just realized that even after reverting to Gin LB rc5, I still have this JS error, and those two checkboxes still don't show. You can see from the "before" screenshot that they aren't there. I will post a separate issue for this.

Proposed resolution

Remaining tasks

User interface changes

API changes

Data model changes

🐛 Bug report
Status

Active

Version

1.0

Component

Code

Created by

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

Comments & Activities

Production build 0.71.5 2024