Ctrl + Enter with focus on "Edit your profile" within the comment form tries to submit form

[greentreefrog]

This also happens on the "Log out?" link in the comment form.

To reproduce:

1. Log into a WordPress site (so you will be able to see the link in question).
2. Open a post that allows comments.
3. Tab to the "Edit your profile" link. Technically, this link is inside the comment form. (A user should not be expected to know this.)
4. Hold down the Ctrl key and click the Enter key.

As a user, I would expect the profile page to open in a new tab. That is not what happens. Instead, WordPress tries to submit the form and does not open a new tab. If there is no text in the Comment field, WordPress shows this error page:

Error: Please type your comment text.

« Back

If there is already text in the comment field, WordPress simply submits the comment. I do not get taken to the profile page.

I have tried this with the Jace, Twenty Twenty-Four and Twenty Twenty-three themes. I have tried it on 4 different sites. On one site I disabled all plugins and tried again. I always had this same result.

This probably relates to the following issue, where a key handler was added to trap Ctrl + Enter in the Comment form: [45790]

One solution might be to move these links outside the form.

Alternatively, ChatGPT suggests I could use the following JavaScript code; I include it in case it helps someone fix it quicker. Of course, modify it to fit the context:

document.addEventListener('keydown', function(event) {
    if (event.ctrlKey && event.key === 'Enter') {
        event.preventDefault();
        let activeElement = document.activeElement;
        if (activeElement.tagName.toLowerCase() === 'a') {
            window.open(activeElement.href, '_blank');
        }
    }
});

Thanks for looking into this!

Margaret

[sabernhardt]

Hi and thanks for the report!

I can confirm that the issue occurs with WordPress 5.3 but not 5.2, which makes [45790] the likely cause.

With a quick test, I was able to adjust the conditional statement to skip the submit feature if the active element is a link:

			if (
				( e.metaKey || e.ctrlKey ) &&
				e.keyCode === 13 &&
				document.activeElement.tagName.toLowerCase() !== 'a'
			) {

Someone else may know a better way to write that, too.

Trac ticket: https://core.trac.wordpress.org/ticket/61919

[joedolson]

Tested:

Before patch: Ctrl/Cmd + Enter on links within form simultaneously open the link in a new tab and submit the form. (In my testing, this did not override the behavior, but actually did both.)

After patch: Ctrl/Cmd + Enter on links within the form opens the link in a new tab without submitting the form.

In both cases, Ctrl/Cmd + Enter submits the form as expected when on an input field.

Marking for commit.

[joedolson]

In 58981:

Comments: Limit comments shortcut to not execute on links.

Exclude links from activating the comment submission shortcut.

[45790] introduced a shortcut to submit comment forms using Ctrl/Cmd + Enter. This keyboard combination is also the combination for opening a link in a new tab, which resulted in submitting the form when using the Log Out or Edit Profile links.

Props greentreefrog, sabernhardt, narenin.
Fixes #61919.

In r58981.