Quite a few issues, some of which are concrete bugs. I will lump them all here as they will be fixed with the same patch.

Repro steps

• Go to https://meta.wikimedia.beta.wmcloud.org/wiki/Community_Wishlist/Wishes/W1
• Using your browser's developer tools, throttle your internet speed to something really slow
• Click on "Support wish" to open the voting dialog
• Hit the "Support" button over and over spanning at least one second

A laundry list of issues

You can resubmit multiple times

Multiple edits are visible in the revision history due to the continual POST requests and the timestamp changing. It's possible the content of the vote is changed too, if you managed to change the "Optional comment" and resubmit before the first API response comes back.

You should not be able to resubmit, and only one edit should be made to the /Votes page.

There is no pending state

Just like anytime we're waiting on a response from an API, we should give some visual feedback that something is happening behind the scenes.

The textarea and buttons should be disabled while the vote is being saved.

The page title is shown in the dialog instead of the entity title

Title of my wish is what should be shown instead of Community Wishlist/Wishes/W123.

Vote is not reflected after submission

The success message is shown, but the list and the vote count is not updated.

We should either live reload the /Votes page into the DOM, or ensure the parser cache is updated before or while refreshing.

URL is updated to a nonexistent section

The JS redirect goes to #voting when there is no element with that ID on the page.

After submission, the URL should be i.e. Community Wishlist/Wishes/W123#Voting (capitalized "Voting"), and this should work even for translation subpages.

No message is shown to users with JavaScript disabled

It's fine to not make it fully functional for no-JS, but we could at least clarify as currently it says "show your support using the button below."

No error handling

If the edit to the /Votes page for whatever reason fails, the user is not notified. They're not notified of success either, so there is at least that.

We should handle errors properly and set the messages in the field component with whatever the API gives us.

---

Derived Requirements

1. Prevent multiple vote submissions by ensuring the "Support" action is disabled after the first click until the API responds.
2. Provide a pending state while saving a vote by disabling the textarea and buttons and showing visual feedback.
3. Display the wish title in the voting dialog header instead of the generic page title.
4. After a successful vote, update the list and vote count in the DOM (or refresh parser cache) so the new vote is reflected immediately.
5. Ensure the redirect URL points to the correct #Voting section (capitalized), including for translation subpages.
6. For users with JavaScript disabled, show a clarifying message instead of leaving the "Support" button unusable.
7. Implement error handling so users are notified when saving a vote fails, and display API-provided error messages in the field component.

Test Steps

Test Case 1: Prevent Multiple Submissions of a Vote

1. Open Community Wishlist wish page.
2. Use browser dev tools to throttle network speed to slow.
3. Click "Support wish" → "Support" repeatedly in quick succession.
4. ✅❓❌⬜ AC1: Confirm that only one request is submitted and only one edit is recorded in revision history.

Test Case 2: Ensure Pending State During Vote Save

1. Open the same wish page.
2. Click "Support wish" → "Support."
3. ✅❓❌⬜ AC2: Confirm that the textarea and buttons are disabled while the request is processing.
4. ✅❓❌⬜ AC3: Confirm that a pending visual indicator is shown until the API responds.

Test Case 3: Ensure Correct Wish Title Displays in Dialog

1. Open the wish page.
2. Click "Support wish."
3. ✅❓❌⬜ AC4: Confirm that the dialog header shows the wish title (e.g., "W11 wish title") instead of Community Wishlist/Wishes/W11.

Test Case 4: Ensure Vote is Reflected After Submission

1. Submit a support vote for a wish.
2. ✅❓❌⬜ AC5: Confirm that the vote count and list update immediately in the DOM, without requiring manual refresh.

Test Case 5: Ensure Correct Redirect URL After Voting

1. Submit a vote.
2. ✅❓❌⬜ AC6: Confirm that the redirect URL includes #Voting (capitalized) and navigates correctly even on translation subpages.

Test Case 6: Ensure No-JS Users See a Clarifying Message

1. Disable JavaScript in the browser.
2. Open a wish page with voting enabled.
3. ✅❓❌⬜ AC7: Confirm that users see a clarifying message instead of a broken "Support" button.

Test Case 7: Ensure Proper Error Handling on Vote Failure

1. Simulate a failed API request (e.g., block network or submit invalid payload).
2. ✅❓❌⬜ AC8: Confirm that an error message is displayed to the user in the voting dialog.

QA Results - Meta Beta