Submit Wish (or Focus Area) appears briefly after Refresh when already voted
Closed, ResolvedPublicBUG REPORT
Actions

Assigned To

Authored By

	GMikesell-WMF
	Aug 12 2025, 5:40 PM

Description

Steps to replicate the issue (include links if applicable):

Go to a wish that already has a vote, https://commtech.toolforge.org/Community_Wishlist/Wishes/W1
If there is no vote, just complete to vote
Refresh page

What happens?:

Support Wish appears briefly before it changes back to Already Supported

What should have happened instead?:

Support Wish should not appear briefly

Other information (browser name/version, screenshots, etc.):
OS: macOS Sequoia 15.6
Browser: Chrome 138

Derived Requirements

On wish or focus area pages, if the user has already voted, the correct state (Already Supported) must be displayed immediately on page load.
The "Support Wish" (or "Submit Focus Area") button must not briefly appear after a page refresh before switching to the correct voted state.
Voting state persistence must be handled in a way that avoids UI flicker, ensuring seamless user experience across reloads.
This behavior must be consistent across all supported browsers and devices.

Test Steps

Test Case 1: Prevent flicker after voting on a wish

Navigate to a wish page without an existing vote.
Click Support Wish to cast a vote.
Refresh the page.
✅❓❌⬜ AC1: Confirm that Already Supported displays immediately with no flicker of "Support Wish".

Test Case 2: Refresh when already voted

Navigate to a wish page where you have already voted (e.g., W1).
Refresh the page.
✅❓❌⬜ AC2: Confirm that Already Supported displays immediately without showing "Support Wish" first.

Test Case 3: Verify consistency across focus areas

Navigate to a focus area where you have already voted.
Refresh the page.
✅❓❌⬜ AC3: Confirm that Already Supported (or equivalent) appears instantly without flicker.

Test Case 4: Verify unaffected behavior for non-voters

Navigate to a wish/focus area where you have not voted.
Refresh the page.
✅❓❌⬜ AC4: Confirm that the "Support Wish" button remains available and does not incorrectly display Already Supported.

QA Results - Meta Beta

AC	Status	Details
1	✅	pass per T401726#11160990
2	✅	T401726#11149532
3	✅	pass per T401726#11160990
4	✅	T401726#11149532

Details

Related Changes in Gerrit:

	Subject	Repo	Branch	Lines +/-
	Set min-height for voting button HTML to avoid layout shift	mediawiki/extensions/CommunityRequests	master	+1 -0
	Only show voting button after fetching vote status	mediawiki/extensions/CommunityRequests	master	+5 -6

Customize query in gerrit

Related Objects

Mentioned In: rECOR3124bf260ae6: Set min-height for voting button HTML to avoid layout shift
rECORaae8a3ccccf0: Only show voting button after fetching vote status
T388219: Load the voting Vue app on wishes and focus areas

Event Timeline

GMikesell-WMF created this task.Aug 12 2025, 5:40 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptAug 12 2025, 5:40 PM

GMikesell-WMF mentioned this in T388219: Load the voting Vue app on wishes and focus areas.Aug 12 2025, 5:43 PM

MusikAnimal moved this task from Backlog to Entities on the MediaWiki-extensions-CommunityRequests board.Aug 12 2025, 8:42 PM

MusikAnimal renamed this task from Submit Wish appears briefly after Refresh when already voted to Submit Wish (or Focus Area) appears briefly after Refresh when already voted .Aug 27 2025, 6:41 AM

MusikAnimal moved this task from Entities to Entity index pages on the MediaWiki-extensions-CommunityRequests board.

If we don't show the button until we've retrieved the vote status, there would be a vertical jump in the content. So perhaps an initially disabled button should be shown, with text "Fetching vote details…" or something? Or even an icon-only button, showing the check mark and then changing to having the text when the state is known?

Oh no I wasn't thinking right: the jump is from just loading the button's Vue app, so will happen regardless. So it seems like it's find to delay showing the button until we've fetched the vote status. A disabled button could perhaps be output in the HTML as the .ext-communityrequests-voting-btn element, but that's a separate issue.

Change #1183282 had a related patch set uploaded (by Samwilson; author: Samwilson):

[mediawiki/extensions/CommunityRequests@master] Only show voting button after fetching vote status

https://gerrit.wikimedia.org/r/1183282

gerritbot added a project: Patch-For-Review.Sep 1 2025, 3:35 AM

Samwilson moved this task from In Development to Feedback and Review on the Community-Tech (Sea Lion Squad) board.Sep 1 2025, 3:57 AM

Change #1183282 merged by jenkins-bot:

[mediawiki/extensions/CommunityRequests@master] Only show voting button after fetching vote status

https://gerrit.wikimedia.org/r/1183282

jenkins-bot mentioned this in rECORaae8a3ccccf0: Only show voting button after fetching vote status.Sep 1 2025, 6:56 PM

ReleaseTaggerBot added a project: MW-1.45-notes (1.45.0-wmf.17; 2025-09-02).Sep 1 2025, 7:00 PM

Maintenance_bot removed a project: Patch-For-Review.Sep 1 2025, 7:30 PM

Thanks @GMikesell-WMF! The flash of the wrong button text should be fixed now.

@Samwilson Can you please review AC1 and AC3 to see if those flickers are fine? Thanks!

Test Result - Meta Beta

Status: ✅ PASS / ❓Need More Info
Environment: Meta Beta
OS: macOS Sequoia 15.6.1
Browser: Chrome 139
Device: MBA
Emulated Device: NA

Test Artifact(s):
https://meta.wikimedia.beta.wmcloud.org/wiki/Community_Wishlist/Wishes/W1
https://meta.wikimedia.beta.wmcloud.org/wiki/Community_Wishlist/Wishes/W2
https://meta.wikimedia.beta.wmcloud.org/wiki/Community_Wishlist/Focus_areas/FA1
https://meta.wikimedia.beta.wmcloud.org/wiki/Community_Wishlist/Focus_areas/FA6

Test Steps

Test Case 1: Prevent flicker after voting on a wish

Navigate to a wish page without an existing vote.
Click Support Wish to cast a vote.
Refresh the page.
❓ AC1: Confirm that Already Supported displays immediately with no flicker of "Support Wish".

It's not a "Support Wish" flicker, but it does flicker as seen in the video. Only saying this because in AC2, with one that's already voted, has no flicker.

Test Case 2: Refresh when already voted

Navigate to a wish page where you have already voted (e.g., W1).
Refresh the page.
✅ AC2: Confirm that Already Supported displays immediately without showing "Support Wish" first.

Test Case 3: Verify consistency across focus areas

Navigate to a focus area where you have already voted.
Refresh the page.
❓ AC3: Confirm that Already Supported (or equivalent) appears instantly without flicker.

Same as AC1 if this flicker is fine or not

Test Case 4: Verify unaffected behavior for non-voters

Navigate to a wish/focus area where you have not voted.
Refresh the page.
✅ AC4: Confirm that the "Support Wish" button remains available and does not incorrectly display Already Supported.

GMikesell-WMF updated the task description. (Show Details)Sep 4 2025, 6:33 PM

GMikesell-WMF updated Other Assignee, added: GMikesell-WMF.

GMikesell-WMF moved this task from QA to In Development on the Community-Tech (Sea Lion Squad) board.Sep 4 2025, 6:54 PM

Change #1184964 had a related patch set uploaded (by Samwilson; author: Samwilson):

[mediawiki/extensions/CommunityRequests@master] Set min-height for voting button HTML to avoid layout shift

https://gerrit.wikimedia.org/r/1184964

gerritbot added a project: Patch-For-Review.Sep 5 2025, 6:04 AM

I'd thought perhaps this wasn't worth fixing, but really it is fairly annoying to have the votes list jump downwards like that, and the fix appears to be pretty simple.

Maybe at some point we'll be able to hydrate the rendered HTML, but for now we can cheat I think.

Change #1184964 merged by jenkins-bot:

[mediawiki/extensions/CommunityRequests@master] Set min-height for voting button HTML to avoid layout shift

https://gerrit.wikimedia.org/r/1184964

jenkins-bot mentioned this in rECOR3124bf260ae6: Set min-height for voting button HTML to avoid layout shift.Sep 5 2025, 7:36 PM

ReleaseTaggerBot edited projects, added MW-1.45-notes (1.45.0-wmf.18; 2025-09-09); removed MW-1.45-notes (1.45.0-wmf.17; 2025-09-02).Sep 5 2025, 8:00 PM

Maintenance_bot removed a project: Patch-For-Review.Sep 5 2025, 8:31 PM

Thanks @GMikesell-WMF, can you check again? The vertical space should stay blank and large enough for the button, until the button loads. The text lower down the page shouldn't move now when the button loads.

@Samwilson It still flickers and with slight page scroll moves when it pops back. If the videos below are fine, I'm ok with passing it through. Just let me know, thanks!

Test Steps

Test Case 1: Prevent flicker after voting on a wish

Navigate to a wish page without an existing vote.
Click Support Wish to cast a vote.
Refresh the page.
❓ AC1: Confirm that Already Supported displays immediately with no flicker of "Support Wish".

It flickers but it is faster. I would fine if you say this is ok.

Test Case 3: Verify consistency across focus areas

Navigate to a focus area where you have already voted.
Refresh the page.
❓ AC3: Confirm that Already Supported (or equivalent) appears instantly without flicker.

Same as AC1 if this flicker is fine or not

GMikesell-WMF updated the task description. (Show Details)Sep 8 2025, 5:54 PM

GMikesell-WMF moved this task from QA to In Development on the Community-Tech (Sea Lion Squad) board.

MusikAnimal moved this task from Entity index pages to Entities on the MediaWiki-extensions-CommunityRequests board.Sep 8 2025, 9:25 PM

MusikAnimal moved this task from Entities to Voting on the MediaWiki-extensions-CommunityRequests board.

The support text at the bottom shifts down a couple of pixels in your video, but the biggest shift down is I think because of the central notice banner at the top loading. So yep I think it's all fine!

(I wonder if there's a quick way to make slo-mo screencasts…)

Great, I will mark this as Resolved. Thanks for all your work!

GMikesell-WMF closed this task as Resolved.Sep 9 2025, 3:35 PM

GMikesell-WMF updated the task description. (Show Details)

GMikesell-WMF updated Other Assignee, removed: GMikesell-WMF.

Submit Wish (or Focus Area) appears briefly after Refresh when already voted Closed, ResolvedPublicBUG REPORTActions

Description

Test Steps

QA Results - Meta Beta

Details

Related Objects

Event Timeline

Test Steps

Test Steps

Submit Wish (or Focus Area) appears briefly after Refresh when already voted
Closed, ResolvedPublicBUG REPORT
Actions