"Quick Edit" button at "Comments" page doesn't work in slow connection

[yongbae]

I found that "Quick Edit" button at "Comments" page does not correctly work when necessary JavaScript files are not yet fully loaded. I observe this problem in WordPress version 3.5.1.

I guess this problem happens when a user makes a clicks on “Quick Edit” button too soon before some external JavaScript for the feature get loaded. For this reason, It seems this bug would be more problematic when network connection is slow.

Here's the use case scenario by which you can reproduce the error:

1. get log in WordPress site.

2. click “Comments” button in left side menu in “Dashboard” page.

3. click “Quick Edit” button. The error may occur at this moment -- even though you clicked, the input form may not show up, and my Firefox browser shows an uncaught exception:

[yongbae]

For your better understanding of the buggy scenario,
I just added a video that shows an actual error execution.

​http://core.trac.wordpress.org/attachment/ticket/24741/WordPress.wmv

Loading of "Comments" page starts at 00:15. At 00:17, I clicked "Quick Edit" button and the error message "ReferenceError: commentReply is not defined" appears in Firefox console.

Let me know if you have a probelm of reproducing the error. Thank you.

[aubreypwd]

Tests for commentReply before using onclick since commentReply isn't defined until the footer

[aubreypwd]

edit-comments.js indeed is not loaded until the footer, so onclick="commentReply.open" would not work beforehand because commentReply is not yet defined. I've attached a patch that tests that commentsReply is an object before it's accessed. Successfully keeps the error from posting, which could cause problems maybe in some situations.

[nacin]

The proper thing to do here is to make this be unobtrusive JavaScript. Committing this will make me die a little inside.

[nacin]

In 27747:

Avoid JS errors before the commentReply script loads. Let's make this unobtrusive soon.

props aubreypwd.
fixes #24741.

[aubreypwd]

@nacin So, do we want to ad id='s to these and apply via JQuery? Would that be the best route? And where would to JS go in core to make this unobtrusive?

[azaozz]

Replying to aubreypwd:

You don't need HTML IDs there. So many different ways to make this particular code better :)

The least changes one would be to add data-wp-* attributes and have one $( document ).on( 'click.comment-row-actions', function()... to catch all clicks on these links.

[peterwilsoncc]

Saving mechanism for comment-reply

[peterwilsoncc]

As a temporary measure is it worth adding a saving mechanism to the HTML header if comment-reply is enqueued but hasn't loaded?

It's hacky, yes, but it saves JavaScript explosions.

[peterwilsoncc]

Ignore me, looks like I misread this ticket. I'll hunt down/create one relating to the potential for JS breaking on the front end.