USWDS Grid: Cannot destructure property 'parent' of 'selection.getFirstPosition(...)' as it is null

Created on 26 June 2024, 5 months ago
Updated 19 September 2024, 2 months ago

Problem/Motivation

TypeError: Cannot destructure property 'parent' of 't.getFirstPosition(...)' as it is null.
    at i (uswds_grid.js?sfp2mx:1:1169)
    at Object.getRelatedElement (uswds_grid.js?sfp2mx:1:9599)
    at q._updateToolbarsVisibility (ckeditor5-dll.js?v=41.3.1:5:718206)
    at r.<anonymous> (ckeditor5-dll.js?v=41.3.1:5:717231)
    at r.fire (ckeditor5-dll.js?v=41.3.1:5:663135)
    at r.update (ckeditor5-dll.js?v=41.3.1:5:602960)
    at Object.fire (ckeditor5-dll.js?v=41.3.1:5:663135)
    at de (ckeditor5-dll.js?v=41.3.1:5:201940)
    at pe.fire (ckeditor5-dll.js?v=41.3.1:5:201331)
    at St.<anonymous> (ckeditor5-dll.js?v=41.3.1:5:255790)
  • Drupal: v10.3.0
  • CKEditor: v41.3.1
  • USWDS CKEditor Integration: v3.0.0

When creating/editing a node the above error occurs and the editor loads with all toolbar buttons disabled except "Source" and no content is visible within the editor.

Making the following change to getClosestSelectedUswdsGridWidget() in the file /uswds_ckeditor_integration/js/ckeditor5_plugins/uswds_grid/src/utils.js resolves the console error and allows the editor to load normally.

changing

let { parent } = selection.getFirstPosition();

to

let { parent } = selection.getFirstPosition() ?? '';

However, saving a node with a working grid and then re-editing it, or loading an existing node with a working gird in the editor, results in the removal of key classes: uswds_grid, grid-row, grid-gap causing the grid styling to fail to be applied, effectively breaking the grid.

I've tested this with both "USWDS Ck5" and "Full HTML" text formats. USWDS grid is enabled for both and "Full HTML" does not have "Limit allowed HTML tags" enabled. Additionally, manually editing the grid markup created by the plugin within the "Source" view to change these class names (for example: uswds_grid-, grid-row-, grid-gap-) prevents them from being removed suggesting it isn't a filtering issue.

In an attempt to debug this I've installed the node packages and edited the utils.js directly running the build.

I don't think the change above is a fix, because it seems like the classes being removed may be a result of the selection failing (which is why the getFirstPosition is null to begin with). Sorry I can't provide further details, I don't have a lot of hands-on experience with CKEditor or it's plugins.

Possibly related, Google directed me to what sounds like a similar issue on another module: https://www.drupal.org/project/ckeditor_iframe/issues/3457032 πŸ› CKEditorError: selection.getFirstPosition() is null after 10.3 update Active

Steps to reproduce

- Install Drupal 10.3.0
- Install USWDS CKEditor Integration v3.0.0
- Enable USWDS Grid plugin for any text format
- Edit an existing node, or create a new node, using a text format with uswds grid enabled

This is an alternate version of the error output when running the webpack build.

TypeError: Cannot destructure property 'parent' of 'selection.getFirstPosition(...)' as it is null.
    at getClosestSelectedUswdsGridWidget (utils.js:138:9)
    at Object.getRelatedElement (toolbar.js:97:114)
    at q._updateToolbarsVisibility (ckeditor5-dll.js?v=41.3.1:5:718206)
    at r.<anonymous> (ckeditor5-dll.js?v=41.3.1:5:717231)
    at r.fire (ckeditor5-dll.js?v=41.3.1:5:663135)
    at r.update (ckeditor5-dll.js?v=41.3.1:5:602960)
    at Object.fire (ckeditor5-dll.js?v=41.3.1:5:663135)
    at de (ckeditor5-dll.js?v=41.3.1:5:201940)
    at pe.fire (ckeditor5-dll.js?v=41.3.1:5:201331)
    at St.<anonymous> (ckeditor5-dll.js?v=41.3.1:5:255790)
πŸ› Bug report
Status

Fixed

Version

3.0

Component

Code

Created by

πŸ‡ΊπŸ‡ΈUnited States chrislarrycarl

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

Merge Requests

Comments & Activities

Production build 0.71.5 2024