TypeError: Cannot read properties of undefined (reading 'querySelector')

Created on 13 August 2024, 3 months ago
Updated 27 August 2024, 3 months ago

Problem/Motivation

Console error on node edit form:
TypeError: Cannot read properties of undefined (reading 'querySelector')

Steps to reproduce

  1. Create a node that has a paragraph entity reference field, referring to the layout_paragraphs paragraph
  2. Insert content for a single row
  3. Try to move the content via drag/drop
  4. Observe the error in the console
  5. Also notice that you cannot "drop" the selected element

Please note that this also occurs once saved and then trying to edit the layout paragraph again.

Proposed resolution

Add extra conditions to updateMoveButtons() in builder.js

Before

(_components$0$querySe = components[0].querySelector('.lpb-up')) === null || _components$0$querySe === void 0 || _components$0$querySe.setAttribute('tabindex', '-1');
      (_components$querySele = components[components.length - 1].querySelector('.lpb-down')) === null || _components$querySele === void 0 || _components$querySele.setAttribute('tabindex', '-1');

After

(_components$0$querySe = components[0] && components[0].querySelector('.lpb-up')) === null || _components$0$querySe === void 0 || _components$0$querySe.setAttribute('tabindex', '-1');
      (_components$querySele = components[components.length - 1] && components[components.length - 1].querySelector('.lpb-down')) === null || _components$querySele === void 0 || _components$querySele.setAttribute('tabindex', '-1');

Alternatively, look into updating move buttons, only if there are multiple elements?

πŸ› Bug report
Status

Postponed: needs info

Version

2.0

Component

Code

Created by

πŸ‡¬πŸ‡§United Kingdom mistrytheory

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