Jump to content

Topic on Talk:Third-party MediaWiki users discussion/Flow

WikiEditor toolbars, JavaScript dependencies, and asynchronous behavior

4
Maiden taiwan (talkcontribs)

Our biggest difficulty with MediaWiki, particularly in MediaWiki 1.20, is extending the WikiEditor using JavaScript. We have added several menus alongside Special Characters and Help, each with its own icons and dropdowns. They worked fine in MediaWiki 1.17. When 1.18 came, our custom icons started vanishing at random times. Now in 1.20, the icon problems are more frequent and the entire toolbar sometimes vanishes. It's possible that this is a coding error on our part, but we seem to be following the docs. Sometimes clearing the browser file cache helps, sometimes not.

Overall, we are suffering from timing problems with JavaScript modules that have dependencies. The dependencies are specified in ResourceLoader, but somehow, once the JS gets to the browser, the modules seem to interleave as they run. For example, if module A depends on B, we can specify that, but this doesn't seem to guarantee that every line of module B will have run before every line of module A. I'll ask my lead developer to follow up to this comment with more details.

Mitevam (talkcontribs)

User:Maiden_taiwan please do follow up with more details and I will try to find the right person/team who could maybe help you with the JavaScript issues.

I would suggest to write about problems like that to the wikitech-l mailing list and if you don't find a solution there you could probably file a bug report.

DanielRenfro (talkcontribs)

As Maiden taiwan stated above, we've been having some problems with asynchronous behavior in JavaScript files.

Let me first say that the ResourceLoader is a wonderful part of the software. Thanks goes out to everyone who contributed to this project it's made my life much better. That being said, I don't think that I and my team have figure out how to properly take advantage of it's benefits.

General

We are currently using the ResourceLoader to load modules, some of which contain JavaScript. The dependencies are made explicit in the registering of the ResourceLoader, and they execute in the proper order on the client side. In many of these JavaScript files we wrap our code in a jQuery .ready() callback. Since these JavaScript files have dependencies on one-another (as laid out in the RL,) they need to be executed in the correct order to work properly. We're finding that when using jQuery's .ready() (or similar) function, the callbacks seem to execute in different (unexepected, browser-dependent) order. This causes errors.

WikiEditor extension as a specific example

Customizing the WikiEditor-toolbar is one of the specific cases where we've encountered problems. First, the WikiEditor provides no good events to bind to once the toolbar is loaded. This is not a problem because there is a documented work-around. However, our JavaScript code needs to execute in the proper order, which it is not. We have about four JavaScript files that add custom toolbars, sections, and groups.

My questions
  • It recently dawned on me that executing our code within a $(document).ready(); callback might not be necessary as the JavaScript for each ResourceLoader module is executed in its own callback on the client-side. This should provide the necessary scope to avoid clobbering global variables along with getting executed at the proper time. Is this a correct assumption to make?
  • Is it a good idea to avoid binding our code to jQuery's ready event?

I'm going to test this theory and post to mediawiki-l/wikitech-l with questions.

Mitevam (talkcontribs)

As this is a very specific technical questions I was about to copy it to wikitech-l but I see you are planning to do the same. I would suggest asking on the #mediawiki channel on Freenode IRC as well. Let me know if I can somehow help and please continue sharing issues you are having.

Reply to "WikiEditor toolbars, JavaScript dependencies, and asynchronous behavior"