WYSIWYG breaks when all js is at bottom of page [#2271247]

One guideline for front-end performance is to put all javascript files at the bottom of the page. However, when doing so the WSYIWYG module breaks.

The settings array is always the last script tag in a scope, and WYSIWYG gets around this by assuming settings are in the header, and putting it's own script in the footer. Put every script in the footer, and now we're trying to call Drupal.wysiwygInit() with no settings.

This function call need to be deferred until settings are loaded, or changed to not need settings. I'm not sure which would be preferable.

Comments

Comment #1

TwoD

Swedish

Sweden

CreditAttribution: TwoD commented 23 May 2014 at 14:02

It would be pretty much impossible to change it to not use settings, since we need all the profile configurations from the server to do anything useful.

Does the patch here solve your issue? #2072681: Assign weight to wysiwyg.js

Comment #2

MPetrovic CreditAttribution: MPetrovic commented 27 May 2014 at 14:14

No, it doesn't. The problem is that settings are always the last script tag in a scope. Group and weight on them are completely ignored. And because it uses jQuery.extend(), I can't just leave them in the header. The only way to fix this is to do some messy string manipulation.

I can see 3 options currently.
1.) String manipulation so settings are after jQuery but before everything else.
2.) Implement just jQuery.extend as an inline script, putting it and settings in the header.
3.) Defer wysiwygInit until settings have been loaded, either by polling the variable or using some kind of mutation listener.

Comment #3

TwoD

Swedish

Sweden

CreditAttribution: TwoD commented 27 May 2014 at 23:22

It seems whichever method you're using to relocate the scripts to the footer scope does not preserve their relative order

1) Pretty much impossible to guarantee that works every time.
2) Can be done, but you likely have another problem preventing just this from working: differently scoped scripts to be kept in order.
3) Wysiwyg must be able perform some tasks even before the editor scripts are added to the page because they read global variables (Some of them are currently set via generated "init" scripts always being inserted before the editor libs), and it must be able to perform some tasks just after the scripts have been added to the page, but before any editor has attached (Currently what wysiwygInit() does). I don't know yet if we can reliably do this if we wait for the document/window load event. But you're likely to stumble upon other scripts which do other things before the page is loaded though (some things out there even use document.write())!

I found a StackExchange question about this and posted my version of a script reordering implementation there: http://drupal.stackexchange.com/questions/46202/move-aggregated-js-file-...
It works without any modifications to Wysiwyg module.

Comment #4

MPetrovic CreditAttribution: MPetrovic commented 28 May 2014 at 18:30

That works. I did need to add a hook_module_implements_alter though. For some reason, one of the contrib modules we're using adds a setting in a js_alter hook.