Support » Fixing WordPress » Visual Editor broken after upgrade to WordPress 4.7

  • Resolved frikafrax

    (@frikafrax)


    Hello, everyone.

    Upgrading to WordPress 4.7 has broken the visual editor.

    The visual editor will load properly at first in Text mode and I can enter text normally, and there are editbuttons in the toolbar. But upon switching to WYSIWYG mode, the text entry area goes blank, I can’t enter any text and the toolbar buttons disappear. Trying to switch back to Text mode again causes the editor text area to go blank entirely. Then trying to switch back to WYSIWYG mode yet again causes the text entry area and toolbars to disappear entirely.

    I’ve Googled for solutions, read the related threads posted here and tried the various solutions with no luck.

    I’m on shared hosting (Inmotion Hosting) using PHP v7.0.12, reverse proxying through Cloudflare.

    Things I’ve tried with no success (in no particular order):

    • First de-activated, then eventually deleted TinyMCE Advanced plugin
    • Disabled W3 Total Cache (Community Fix version)
    • Turned off Cloudflare’s minification feature first, then put Cloudflare into Development Mode entirely.
    • Confirmed the path and existence of plugin.min.js and tinymce.min.js
    • Re-uploaded plugin.min.js and tinymce.min.js.
    • Checked directory and file permissions.
    • Checked .htaccess for any restrictions/rules that could affect the visual editor.
    • Used different browsers (Chrome, Firefox, Internet Explorer, Safari etc…)
    • Disabled all plugins and reverted to default theme.
    • Added define('CONCATENATE_SCRIPTS', false ); to wp-config.php
    • WP_HOME and WP_SITEURL were explicitly defined in wp-config.php
    • Turned on Debug mode in wp-config.php. (Some people reported that this temporarily restored visual editor functionality but didn’t work for me.)
    • Re-installed WordPress (full deletion of wp-admin, wp-includes, deleting any cache directories.)
    • Changed PHP versions to 5.6.27, then to 7.1.0 RC

    During the troubleshooting process, I regularly purged or turned off whatever caching was going on— browser, Cloudflare, W3 Total Cache etc… etc…

    When switching the visual editor from Text mode to WYSIWYG mode, Chrome debug console reports that plugin.min.js is called multiple times with no problem (GET 200 status) but then it generates a single 404 error amidst all the successful GETs. From what I’ve been able to glean from the debug console, the error is in tinymce.min.js and that the error is generated from around line 3957. This code is what is on line 3957:

    (document.getElementsByTagName("head")[0] || document.body).appendChild(s)

    Here’s a pastebin with my installed plugin list and debug console output.

    I’m not knowledgable in PHP and Javascript so I’m really at my limit.

    Any help would be greatly appreciated!

Viewing 9 replies - 1 through 9 (of 9 total)
  • I have this problem and my media files wont load in the admin page.

    frikafrax

    (@frikafrax)

    Just reporting back that I fixed the issue. The problem was in my .htaccess file and it was all due to a single question mark in a regular expression used with a RewriteCond line that broke the editor in my case.

    I was using this rule in my root directory .htaccess file to deal with hack bots probing for locations of “wp-admin” in commonly used WordPress installation paths like “/wp/”, “/wordpress/” or “/blog/”.

    RewriteCond %{REQUEST_URI} /(wp|wordpress|blog)/(wp-admin)? [NC,OR]

    The problem is that the question mark made the “wp-admin” part of the expression an optional part of the match so the scope of the match was too broad. I.e. Any URI request with “/wp/” or “/wordpress/” or “/blog/”, regardless of whether it had “wp-admin” in it, would match that expression.

    The browser calls /wp-includes/js/tinymce/plugins/wordpress/plugin.min.js when setting up the visual editor and the regular expression above would match that path.

    It’s so damn obvious now, but what threw me off looking at .htaccess was that when looking at the browser debug console when switching to the visual editor, it showed that /wp-includes/js/tinymce/plugins/wordpress/plugin.min.js was called 19 times without error (returned 200 status) except for a single instance where it generates a 404 error.

    Seeing 19 out of 20 successful requests for plugin.min.js each time I switched to the visual editor, and that the above RewriteCond oddly didn’t seem to break anything else besides the visual editor, put me into the mindset that .htaccess wasn’t the problem.

    I realize this solution is something specific to my WordPress set-up. Sorry if this doesn’t help anyone else.

    Same symptoms as many recent posts. I’m perfectly happy with the old visual editor although I don’t really need it to write HTML. Main problem is inability to upload images from Admin post/page edit window. Here’s what I wrote to my host support team:

    [Quote]
    “Stuck on this [problem] but maybe there’s a simple answer. For some reason I can’t upload an image file (or other filetype) from my local disk to [mysite.com] from a post or page HTML window of my new WP 4.7.1 upgrade. When I (as Admin) click the “Add Media” button immediately above the text edit window, the controls to browse the local disk should become exposed below the window. But they don’t. The “Screen Options” and “Help” buttons are similarly disabled. I do believe it’s a WP issue that I’ve somehow run into or overlooked, not a theme issue. I’ve checked:

    . Admin user I’m logged in as valid Admin
    . Text upload of post/page text works ok
    . Uploads folder permissions All 775 as they should be, including subs”
    [End Quote]

    Who generated the .htaccess file you cite: Your host? You? Can’t be WordPress: too host server-dependent.

    Great detective work, frikafrax, but can we say that this is the universal cause of the widely reported broken native visual editor…? I’ve listed the contents of mysite/web/content/ “root” directory at my host from a Unix box and can find no .htaccess files. I’m also not sure that the WP native visual editor is tinyMCE (probably not…?). Seems like there must be a more general underlying reason for this disaster. And for a problem that afflicts so many v4.x upgrades, I would think that WP would issue some kind of helpful fix/workaround and put it in a newsletter or–better yet–post it right on the Admin Dashboard page, no…?

    Thanks for sharing,
    Cliffworkz

    POSTSCRIPT TO MY MISSING VE FOLLOWING V4.7.1 UPGRADE POST

    Resolved by reading first line of Marius post VE Broken After Upgrading to 4.7here…!

    Support Forum: “Fixing WordPress“.

    In my case all but one plugin (Akismet) were out of compatibility with v4.7.1 and either no compatible version was available or the author/source went #404! Deactivating these solved my problem with no further tweaking. Wouldn’t hurt to delete them, as well. Maybe the same goes for incompatible non-WP themes. Dunno.

    —Cliff
    Hendersonville, NC

    In my new Plesk 12.5 setup I also saw the missing WYSIWYG editor after a new installation of 4.7.x. Also the PHP version made no difference. Only inserting define(‘CONCATENATE_SCRIPTS’, false ); in wp-config.php solved this, so no changes in .htaccess or any other file(s).

    I don’t know what the influence of CloudFlare could be in this case. Migrating existing sites form Plesk 9.x to 12.x did not give any problems with the WYSIWYG editor.

    I don’t see any performance issues with define(‘CONCATENATE_SCRIPTS’, false );
    Although this line ‘solves’ the issue, I still don’t know what did this?

    Any further ideas?

    @peterluit you said right. I checked there were errors in load-script.php. I used disabled concatenate scripts and it is working fine. Thanks for your guideline. Much Appreciated

    I have similar problem. The Visual editor seem to load at first when page is load then suddenly it switch to Text mode!! I try to switch back to Visual mode again and do my writing then when I add image it go to Text mode again and I can’t control where the image will appear. Even though I click at the place where I want insert it but it not work when it switch to Text mode.

    What happened?

    tony5d

    (@tony5d)

    For me, the only thing that worked is to delete the folders wp-admin and wp-includes, then replace them by new ones I downloaded from wordpress website.

    Emilybkk

    (@emilybkk)

    I found out that mine has conflict with Visual Composer and ACF when this both activate together it will conflict on page or post that turn on VC. It is weird that I try use all theme and plugin move to other site but it didn’t conflict at all. WordPress always has some mystery problem lol. I don’t know how to look at those js error etc. Live with it.

Viewing 9 replies - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.