tabindex issue on new topic form

[jaredatch]

Thought there was a ticket open for this already, but I can't find it.

When on the new topic form, tabbing will jump from the title to the tags, skipping over the body. It's not a show stopper but definitely annoying.

I've done some investigating but haven't figured out why this is happening. Everything works fine in the admin and tinymce on the front end is loading the same TinyMCE plugins (including the one for tabindex support) as the backend - so it *should* be working. But it isn't.

Oddly enough, this works if the HTML tab is selected, but not Visual. More than likely it's due to the iframe, but WordPress core pulls it off in wp-admin, presumably with some additional JS somewhere.

Possibly related: ​#WP20834

I think this is the ticket your referring to:

​http://bbpress.trac.wordpress.org/ticket/1407 'Tabindex attribute causing issues'

This seems to be the wp core fix for it

​http://core.trac.wordpress.org/attachment/ticket/20834/20834.patch

(In [4513]) TinyMCE:

• Fix tabbing from topic title.
• Hat-tip MZAWeb.
• Fixes #1917.

We need to make sure jQuery is enqueued where this script is included.

The other part of the conversation was talking about loading order, which possibly could be an issue (jQuery in the footer and the script output in the header).

When the full TinyMCE editor is used, wp_editor() enables the ​tab focus plugin. The same is not done for the teeny editor, which bbPress uses by default.

​1917.patch turns on the tab focus plugin when bbp_get_the_content() calls wp_editor().

bbp_get_the_content() will also accept TinyMCE's tabfocus_elements argument now, passing it to the editor instance so one can be explicit about the tab order if needed.

Nice!

Removes extra theme compat helper JS

Replying to ethitter:

Oddly enough, it still doesn't work without the additional theme-compat JS. Attached patch even tries to use explicit class names for the previous and next items, with no success. Thoughts?

After last dev chat, I'm doing a little patch to move the in-line JS to a .js file and enqueuing with jQuery as a dep.

Still needed, right?

Replying to MZAWeb:

After last dev chat, I'm doing a little patch to move the in-line JS to a .js file and enqueuing with jQuery as a dep.

Still needed, right?

Should not be, if I understand the purpose of tabfocus correctly. It's just that it's still not working. :)

(In [4576]) Iterate on #1917.

• Remove fullscreen editor from teeny editor buttons.
• Introduce tabfocus plugin, with some approximate values.
• Props ethitter.
• Note: theme-side tinymce tabfocus still not working as intended.

Does it not work when you get jQuery enqueued _before_ the inline script? Works for me...

(In [4577]) Do not use hashes in tabfocus_elements array values. See #1917.

Replying to MZAWeb:

Does it not work when you get jQuery enqueued _before_ the inline script? Works for me...

The above tabfocus_elements fixes tabbing out-of TinyMCE, but not tabbing into it. If you wanted to write up the JS to enqueue a small JS file if we're using the fancy editor, that includes part of what was reverted in r4576, plus the same for reverse tabbing from the topic-tags input area, should fix this completely.

Replying to johnjamesjacoby:

Replying to ethitter:

Oddly enough, it still doesn't work without the additional theme-compat JS. Attached patch even tries to use explicit class names for the previous and next items, with no success. Thoughts?

Interesting. I honestly didn't try it without the additional JS.

I can take another look this weekend if MZAWeb doesn't beat me to it.

Replying to ethitter:

I can take another look this weekend if MZAWeb doesn't beat me to it.

MZAWeb is out until after holiday, so it's all yours.

(In [4632]) Allow tabbing into and out of TinyMCE. Fixes #1917.

Handling tabbing out of the Visual Editor

​1917.3.patch uses TinyMCE's method for catching keypresses to handle tabbing out of the editor. Even with the changes from r4632, tabbing wasn't consistently working for me.

Trying to shift+tab from the Topic Tags back to the editor still doesn't work properly though. Rather than return to the editor, I end up back in the Topic Title field. But we're getting closer.

Replying to ethitter:

Trying to shift+tab from the Topic Tags back to the editor still doesn't work properly though. Rather than return to the editor, I end up back in the Topic Title field. But we're getting closer.

Ignore me. I was testing with a checkout from the plugin repo, not the bbPress repo.