WordPress.org

Make WordPress Core

Opened 21 months ago

Closed 20 months ago

Last modified 20 months ago

#43012 closed defect (bug) (fixed)

Cannot Update Post in Firefox Due to Editor and TinyMCE JavaScript TypeErrors

Reported by: johnschulz Owned by: azaozz
Milestone: 4.9.2 Priority: normal
Severity: normal Version: 4.9.1
Component: Editor Keywords: reporter-feedback
Focuses: Cc:

Description

I'm using Firefox 58, on OSX 10.12.6 (Sierra). On a WP 4.9.1 site, I'm experiencing issues making changes and saving a post due to an apparent WP Editor/TinyMCE/Firefox bug. When I make changes to a post and then attempt to Update the post, I get the following error in the console: TypeError: a is null from wp-admin/js/editor.min.js.

The code seems to revolve around this piece of code: var b=a.getWin(),c=b.getSelection();if(!(c.rangeCount<=0)){var d="SELRES_"+Math.random(). If I add a null check for the c variable before trying to check the rangeCount like this if(!(!c||c.rangeCount<=0)) I don't get errors from editor.min.js. However, I then get a similar error from wp-includes/js/tinymce/tinymce.min.js.

The following code, similarly, seems to be the issue: d=c.rangeCount>0. And similarly a null check clears that TypeError as well: d=(!c||c.rangeCount>0).

With both of those changes, the changes to the post can be Updated successfully.

Change History (14)

#1 @azaozz
21 months ago

  • Keywords reporter-feedback added

Hi @johnschulz, thanks for the bug report.

This seems to be the actual (non-minified) code you're referencing: https://core.trac.wordpress.org/browser/tags/4.9.1/src/wp-admin/js/editor.js#L697.

I don't yet have Firefox 58, 57.0.3 seems to be the latest stable and all seems to be working properly there. In the var b=a.getWin(), a is the editor instance and there is a check if it exists before running that code. Also the function findBookmarkedPosition() (that contains this code) runs only when switching the editor from Visual to Text. It doesn't run on saving/updating the post.

It is possible that there is a change (or even a bug) in the way window.getSelection() works in Firefox 58, although my guess is that there is something else at play here. Do you have any WordPress plugins or Firefox add-ons installed?

You can also try to debug this further by adding define( 'SCRIPT_DEBUG', true ); to wp-config.php. That will load the non-minified scripts, see: https://codex.wordpress.org/Debugging_in_WordPress#SCRIPT_DEBUG for more info.

#2 @johnschulz
21 months ago

Thanks @azaozz, that looks like the right code to me. I do have a few addons on FF but nothing new, been using them for years with no WYSIWYG issues in WP. I had another dev replicate the issue on his machine. Also, looks like tinyMCE knows about the bug as well: https://github.com/tinymce/tinymce/issues/4015 FWIW.

#3 @azaozz
21 months ago

  • Milestone changed from Awaiting Review to 4.9.2

Now we are getting somewhere, I can reproduce the TinyMCE issue. Happens when the editor is initialized on a hidden textarea. That affects WordPress 4.9 as it includes TinyMCE 4.6.7 (this was fixed in TinyMCE 4.7.4).

However I still can't reproduce it in the main editor on the Add/Edit Post screen. The inconsistencies:

  • The main editor is not initialized on a hidden textarea.
  • The function findBookmarkedPosition() where this error is triggered runs only when switching from Visual to Text, not when saving the post.
  • Posts are saved by submitting the form/reloading the page, so this must be triggered on unloading.

Seems we are still missing something here. Nevertheless thinking this should probably be patched as it will fix the edge cases where window.getSelection() is run and the selection is in a hidden element in the DOM.

Moving to 4.9.2 for further debugging and consideration.

#4 @johnschulz
21 months ago

Thanks @azaozz, now that you mention it, it seems like the editor TypeError only happens when making an edit in a WP Bakery (formerly Visual Composer) GUI element. Not to bring yet another component into the mix ;)

#5 @azaozz
21 months ago

Seems we will have to update TinyMCE in a dot release. See #42722 which is even more severe/affects more people.

#6 @azaozz
21 months ago

  • Owner set to azaozz
  • Resolution set to fixed
  • Status changed from new to closed

In 42430:

Editor: ensure there is a selection before getting the caret position. Fixes a bug in Firefox when there is no selection for a hidden element.

Props johnschulz, azaozz.

Fixes #43012 for trunk.

#7 follow-up: @azaozz
21 months ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

Reopen for 4.9.2 consideration.

#8 in reply to: ↑ 7 @johnschulz
21 months ago

Replying to azaozz:

Reopen for 4.9.2 consideration.

👍🏻

#9 follow-up: @azaozz
20 months ago

  • Resolution set to fixed
  • Status changed from reopened to closed

In 42442:

Merged revision 42430 from trunk:
Editor: ensure there is a selection before getting the caret position. Fixes a bug in Firefox when there is no selection for a hidden element.

Props johnschulz, azaozz.

Fixes #43012 for 4.9.2.

#10 in reply to: ↑ 9 @johnschulz
20 months ago

Right on @azaozz, any idea if 4.9.2 is currently targeted for release soon?

#11 follow-up: @developercanada
20 months ago

This bug still persists in 4.9.2 as described by @johnshulz in reply #4 above https://core.trac.wordpress.org/ticket/43012#comment:4 where edits to page/post content cannot be saved when using WPBakery (formerly VisualComposer) with Firefox.

#12 in reply to: ↑ 11 @devnst1976
20 months ago

Replying to developercanada:
Right, still there in 4.9.2.
The problem is present even with any other browser than FF (Chrome, Edge). I do not have WP Bakery on my website.

#13 @azaozz
20 months ago

In 42576:

TinyMCE: backport bug fixes to NotificationManager and WindowManager from https://github.com/tinymce/tinymce/commit/d1877933fa1e98430e5e9e1f78884be60766d2f0#diff-2e5c98d81ce2481aa1042b2320728b65 and to MultiRange from https://github.com/tinymce/tinymce/commit/250675bb7bae2e6ef5cef715ef57cdf5ab6bff8a.

Props peterwilsoncc, azaozz.
Fixes #42722 for trunk, see #43012.

#14 @azaozz
20 months ago

In 42577:

Merged revision(s) 42576 from trunk:
TinyMCE: backport bug fixes to NotificationManager and WindowManager from https://github.com/tinymce/tinymce/commit/d1877933fa1e98430e5e9e1f78884be60766d2f0#diff-2e5c98d81ce2481aa1042b2320728b65 and to MultiRange from https://github.com/tinymce/tinymce/commit/250675bb7bae2e6ef5cef715ef57cdf5ab6bff8a.

Props peterwilsoncc, azaozz.
Fixes #42722 for 4.9.3, see #43012.

Note: See TracTickets for help on using tickets.