WordPress.org
Get WordPress

Make WordPress Core

Opened 14 years ago

Closed 9 years ago

#18820 closed enhancement (fixed)

Formatting bar loading experience is subpar

Reported by: markjaquith's profile markjaquith Owned by: azaozz's profile azaozz
Milestone: 4.4 Priority: normal
Severity: normal Version: 3.2.1
Component: Editor Keywords: needs-patch dev-feedback
Focuses: ui Cc:

Description

When you save a post, the way the formatting bar loads in (Visual and HTML both) is subpar. It pops in really late, and shoves your post content down.

Screencast: ​http://s3.amazonaws.com/txfx/screencasts/Formatting-Toolbar.mov

Let's make this better.

Change History (12)

#1 @jane
14 years ago

Agreed. This drives me crazy. We brought it up in 3.2 cycle, too.

#2 @jane
14 years ago

  • Keywords ux-feedback removed

#3 @azaozz
13 years ago

In [18829]:

Attempt to keep the textarea still while loading the editor, see #18820

#4 follow-up: @trepmal
13 years ago

Similar thing happening with the width - ​http://screencast.com/t/RypBW4M50

My personal fix is to copy the width style to the <head>

add_action('admin_head', 'editor_css_fix');
function editor_css_fix() { ?>
	<style type="text/css">
	.wp-editor-container textarea.wp-editor-area {
		width: 99.9%;
	}
	</style>
<?php }

#5 @nacin
13 years ago

  • Component changed from General to Editor
  • Milestone changed from Awaiting Review to 3.3
  • Severity changed from normal to major

​http://screencast.com/t/RypBW4M50 is a regression.

#6 in reply to: ↑ 4 ; follow-up: @azaozz
13 years ago

Replying to trepmal:

From the screencast it seems editor-buttons.css loads late because your connection is (very) slow. We can add that css to wp-admin.css, also outputting editor-buttons.css earlier should help.

#7 @azaozz
13 years ago

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

In [19126]:

Output editor-buttons.css earlier so the browser renders the editor in time, fixes #18820

#8 in reply to: ↑ 6 ; follow-ups: @nacin
13 years ago

  • Severity changed from major to normal

Replying to azaozz:

Replying to trepmal:

From the screencast it seems editor-buttons.css loads late because your connection is (very) slow. We can add that css to wp-admin.css, also outputting editor-buttons.css earlier should help.

Nice fix. FWIW though, I was able to see this on localhost consistently.

I'm re-opening as ​http://s3.amazonaws.com/txfx/screencasts/Formatting-Toolbar.mov (the original report) is still a problem.

#9 in reply to: ↑ 8 @SergeyBiryukov
13 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

Replying to nacin:

I'm re-opening as ​http://s3.amazonaws.com/txfx/screencasts/Formatting-Toolbar.mov (the original report) is still a problem.

#10 in reply to: ↑ 8 @azaozz
13 years ago

  • Milestone changed from 3.3 to Future Release

Replying to nacin:

Not sure we can do anything else to minimize the jumpiness there. TinyMCE is big, doesn't load fast, and places an iframe exactly on top of the textarea so there will always be some visual changes.

Next step can probably be to place a blocking div on top of it with a spinner in the middle until it loads completely. Beta3 is a bit too late for that though, moving to 3.4.

#11 @chriscct7
10 years ago

  • Focuses ui added
  • Keywords needs-patch dev-feedback added

This isn't as pronounced in 4.0 after the latest round of TinyMCE updates, but I agree with azaozz, the best solution might just be a placeholder that hides when TinyMCE loads

#12 @azaozz
9 years ago

  • Milestone changed from Future Release to 4.4
  • Resolution set to fixed
  • Status changed from reopened to closed

Most of the Text editor "jumpiness" was removed in 4.3 by outputting the buttons container "inline" (before initializing quicktags.js). Also, browsers have become better and TinyMCE loads faster :)

Considering this fixed.

Note: See TracTickets for help on using tickets.