Make WordPress Core

Opened 5 years ago

Closed 5 years ago

#49519 closed defect (bug) (reported-upstream)

Regression: IE11 block editor error when deleting a block using the keyboard

Reported by: afercia's profile afercia Owned by:
Milestone: 5.4 Priority: normal
Severity: normal Version: 5.4
Component: Editor Keywords: needs-patch has-screenshots
Focuses: Cc:

Description

Noticed while testing #49516

Steps to reproduce:

  • create a new post
  • write something in the first paragraph
  • press Enter
  • a new paragraph is created
  • write something in the newly created paragraph
  • delete the paragraph content by using the Backspace key
  • press Backspace once more to delete the paragraph
  • see the error: "This block has encountered an error and cannot be previewed."

See screenshots below.

This appears to be a regression in trunk as I wasn't able to reproduce on WordPress 5.3.2.

Attachments (2)

deleting block IE11.png (124.5 KB) - added by afercia 5 years ago.
deleting block IE11 console output.png (160.3 KB) - added by afercia 5 years ago.

Download all attachments as: .zip

Change History (10)

#1 @aduth
5 years ago

I haven't been able to pinpoint the exact cause yet, and especially why it would only impact Internet Explorer, but I suspect the issue occurs here in code:

https://github.com/WordPress/gutenberg/blob/d026d5b/packages/rich-text/src/component/index.js#L1145

React "Refs" are a common source of these sorts of errors, considering how they are assigned only after the component's first render, and unassigned when the component unmounts:

https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-dom-element

Typically it is a good practice to verify that the ref is assigned before referencing any of its properties, since otherwise errors like the one in the original report can occur.

However, it is yet unclear to me:

  • Was there some expected guarantee that the ref would always be assigned if this event handler is reached?
  • Why does it only happen in Internet Explorer?
  • Would including a guarded condition on the assigned ref break expected behavior of this focus handler?

Related pull request (cc @iseulde @jorgefilipecosta):

https://github.com/WordPress/gutenberg/pull/19536

This ticket was mentioned in Slack in #core by david.baumwald. View the logs.


5 years ago

#3 @jorgefilipecosta
5 years ago

  • Resolution set to reported-upstream
  • Status changed from new to closed

Commented on the wrong ticket.

Last edited 5 years ago by jorgefilipecosta (previous) (diff)

#4 @jorgefilipecosta
5 years ago

  • Resolution reported-upstream deleted
  • Status changed from closed to reopened

This ticket was mentioned in Slack in #core by david.baumwald. View the logs.


5 years ago

#6 @aduth
5 years ago

Work-in-progress fix at: https://github.com/WordPress/gutenberg/pull/20594

My debugging at comment:1 wasn't quite correct. The error is happening elsewhere (in how the Rich Text component is applying selections).

#7 @jorgefilipecosta
5 years ago

Closing this issue as https://github.com/WordPress/gutenberg/pull/20594 was already merged and the error should be fixed on trunk :)

#8 @jorgefilipecosta
5 years ago

  • Resolution set to reported-upstream
  • Status changed from reopened to closed
Note: See TracTickets for help on using tickets.