Visual editor bug from turning to floating to simple TinyMCE in 4.0

[hardeepasrani]

Looks like this is my 5th or 6th issue with the floating editor, so you can guess that I'm not in good terms with this editor.

Well, it's a working progress :)

Here's another bug (3rd this hour) that I found in the new floating TinyMCE editor.

When in the floating editor mode, try to type or paste anything to the visual editor without any spaces or line breaks, such as:

asasdalksjdhalsdhaksdasjd..... big enough that a scroll bar appear on the bottom of your visual editor.

Now turn off the floating editor and the simple editor will look something like the attached image.

The bottom scroll bar always appears on the very bottom of the floating editor, which is the same issue with the simple editor. It should also be fixed to the bottom of the editor.

[johnbillion]

Thanks for your reports hardeepasrani.

I can see that you're on Windows 7 - which browser are you using please? And which theme are you using? I'm unable to reproduce the issue, both with and without my active theme's editor styles enabled.

[hardeepasrani]

I was using Firefox and it's worth noting that I was on a small screen notepad. It'll try on some other computers later tonight and will send you a video of it.

[hardeepasrani]

Here's a video of what I'm talking about: ​https://dl.dropboxusercontent.com/u/101184013/Video.wmv

Please reply if you got it :)

[hardeepasrani]

I just removed the reporter-feedback tag and you can also take a look at the issue in this video: ​https://dl.dropboxusercontent.com/u/101184013/Video.wmv

Hope you are able to view this video :)

[programmin]

The screenshot seems to be showing that the min-height is not high enough in the default WP configuration? I remember there was a really annoying bug in earlier MCE3 that prevented making the editor smaller than some specific height. If this is changed back to the old behavior globally this could break other uses of TinyMCE.

[hardeepasrani]

Watch the video that I shared to know it to produce this error. Yes, I tired it on a fresh WordPress install with all the default settings.

Plus, the video that I made wasn't from a small screen laptop.

[knutsp]

Firefox and IE9:
With "Expand the editor ..." on, type a very long word until the horizontal scrollbar appears. Turn off "Expand the editor ...". The visible scrollbar is still there but the usable textarea is now just just a portion of the width of full area.

Chrome:
The word gets wrapped (!) long before I manage to write a word that is long enough to toggle the scrollbar, with or without "Expand the editor ..."

[hardeepasrani]

Replying to knutsp:

Chrome:
The word gets wrapped (!) long before I manage to write a word that is long enough to toggle the scrollbar, with or without "Expand the editor ..."

Yup, Chrome is working fine with the new editor.

[azaozz]

We probably can set word-wrap: break-word on the editor body so FF and newer IE behave like Chrome, however thinking this is an "error condition" the user should be able to see and correct.

The position of the horizontal scrollbar depends on the iframe body height which is different in different browsers when there are only 1-2 lines of text in the editor.

[knutsp]

Replying to azaozz:

We probably can set word-wrap: break-word on the editor body so FF and newer IE behave like Chrome, however thinking this is an "error condition" the user should be able to see and correct.

All browsers wraps lines in the middle of the edit area ij the visual editor. I would like to use the whole width for my text. However, this is the same behaviour as in 3.9.2.

[azaozz]

Replying to knutsp:

This is actually a feature. The editor iframe body is set to the theme's width, so text is wrapped at the same length as on the front-end. This is usually set in editor-style.css in the theme.

[knutsp]

Replying to azaozz:

This is actually a feature.

Ahh! Should have guessed. Very ok. I usually go with the text editor, anyway.

Would like to add: Keep up the very, very good work, azaozz.

[azaozz]

Thanks @knutsp :)

Closing this as wontfix, as this is expected behavior. A horizontal scrollbar is very bad UX, but we shouldn't prevent it in the editor as it would probably appear on the front-end too. It's better if the users are aware and fix the text that causes it.