Background
We started work on building out the new banner in T383630 however were unable to finish the work due to problems integrating Minerva’s donation banner messages (skin-minerva-donate-banner-*) are not displaying correctly and show placeholders (⧼skin-minerva-donate-banner-message⧽). This issue prevents the donation call-to-action from appearing as intended and therefore code review and QA.
User Story
As a Wikipedia mobile user, I want to see a properly formatted donation banner.
Requirements
- The donation button is visible only in the beta cluster when the feature flag is enabled.
- Button text and URLs adapt dynamically based on the selected language, supporting RTL and LTR layouts.
- The implementation passes design review and testing
- The feature can be safely disabled or removed via the feature flag without impacting production.
- By default, the new donation banner is not enabled in production.
BDD
Feature: Verify messages working correctly
Scenario: Messages are displayed correctly on Special:AllMessages
Given I visit Special:AllMessages
When I search for "skin-minerva-donate-banner-message"
Then I see "Donate Now" instead of a placeholder
Scenario: API returns the correct message
Given I call the API with "api.php?action=query&meta=allmessages&ammessages=skin-minerva-donate-banner-message"
When I check the response
Then it returns "Donate Now"
Feature: Verify feature flag control is disabled by default
Scenario: Donate banner is not visible when the feature flag is disabled
Given I visit the beta cluster or patchdemo
When I open the main menu
Then I do not see the "Donate Now" banner
Scenario: Donation banner displays correctly for anonymous users
Given I visit a Minerva-skinned page as an anonymous user with the donation banner enabled
When I open the sidebar so the donation banner loads
Then the donation banner displays the correct text, subtitle, image, and link
Scenario: Donation banner is not visible for logged-in users
Given I visit a Minerva-skinned page as a logged-in user with the donation banner enabled
When I open the sidebar
Then I do not see the donation banner
Feature: Verify dynamic text
Scenario: RTL/LTR layouts are supported without design issues
Given I visit a Minerva-skinned page as a logged-in user with the donation banner enabled in a RTL language
When I open the sidebar
Then RTL/LTR layouts (e.g., Arabic) are supported without design issues
And when the headline is longer than the available space, it extends above the animation, pushing it down
Feature: Verify URL requirements
Scenario: Donate banner link includes required URL parameters
Given I visit a Minerva-skinned page with the donate banner
When I open the sidebar and click donate
Then the URL includes "uselang" and "wmf_campaign" parameters based on the selected language
And the URL format follows "https://donate.wikimedia.org/?wmf_source=donate&wmf_medium=sidebar&wmf_campaign=<lang>.wikipedia.org&uselang=<lang>"
Feature: Verify instrumentation requirements
Scenario: Web UI event is fired upon clicking the donate banner
Given I visit a Minerva-skinned page with the donate banner
When I open the sidebar and click the donate banner
Then a web UI actions click event with name "menu.donateBanner" is firedTest Steps
Test Case 1: Messages are displayed correctly on Special:AllMessages
- Visit Special:AllMessages.
- Search for skin-minerva-donate-banner-message.
- AC1: “Donate Now” is displayed instead of a placeholder.
Test Case 2: API returns the correct message
- Call the API with api.php?action=query&meta=allmessages&ammessages=skin-minerva-donate-banner-message.
- Check the response.
- AC2: The response contains “Donate Now”.
Test Case 3: Donate banner is not visible when feature flag is disabled
- Visit the beta cluster or Patchdemo.
- Open the main menu.
- AC3: The “Donate Now” banner is not visible.
Test Case 4: Donation banner displays correctly for anonymous users
- Visit a Minerva-skinned page as an anonymous user with the donation banner enabled.
- Open the sidebar so the donation banner loads.
- AC4: The donation banner displays the correct text, subtitle, image, and link.
Test Case 5: Donation banner is not visible for logged-in users
- Visit a Minerva-skinned page as a logged-in user with the donation banner enabled.
- Open the sidebar.
- AC5: The donation banner is not visible.
Test Case 6: RTL/LTR layouts are supported without design issues
- Visit a Minerva-skinned page as a logged-in user with the donation banner enabled in a RTL language.
- Open the sidebar.
- AC6: RTL/LTR layouts (e.g., Arabic) are supported without design issues.
- AC7: When the headline is longer than the available space, it extends above the animation, pushing it down. See this example.
Test Case 7: Donate banner link includes required URL parameters
- Visit a Minerva-skinned page with the donate banner.
- Open the sidebar and click donate.
- AC8: The URL includes uselang and wmf_campaign parameters based on the selected language.
- AC9: The URL follows the format https://donate.wikimedia.org/?wmf_source=donate&wmf_medium=sidebar&wmf_campaign=<lang>.wikipedia.org&uselang=<lang>.
Test Case 8: Web UI event is fired upon clicking the donate banner
- Visit a Minerva-skinned page with the donate banner.
- Open the sidebar and click the donate banner.
- AC10: A web UI actions click event with name menu.donateBanner is fired. ---
QA Results - Beta
| AC | Status | Details |
|---|---|---|
| 1 | ✅ | T386767#10603837 |
| 2 | ✅ | T386767#10603837 |
| 3 | ✅ | T386767#10603837 |
| 4 | ✅ | T386767#10603837 |
| 5 | ❌ | T386767#10603837 |
| 6 | ✅ | T386767#10603837 |
| 7 | ❌ | T386767#10603837 |
| 8 | ✅ | T386767#10603837 |
| 9 | ✅ | T386767#10603837 |
| 10 | ✅ | T386767#10607053 |
QA Results - Prod
| AC | Status | Details |
|---|---|---|
| 1 | ✅ | T386767#10650334 |
| 2 | ✅ | T386767#10650334 |
| 3 | ✅ | T386767#10650334 |
| 4 | ✅ | T386767#10650334 |
| 5 | ✅ | T386767#10650334 |
| 6 | ✅ | T386767#10650334 |
| 7 | ❓ | T386767#10650334 |
| 8 | ✅ | T386767#10650334 |
| 9 | ✅ | T386767#10650334 |
| 10 | ✅ | T386767#10650334 |
Design
No UI changes—fix ensures the correct message is displayed.
Acceptance Criteria
- Messages in wikimediaoverrides/en.json load correctly.
- Special:AllMessages and API return the expected values.
- Minerva displays the correct banner content.
- It is possible to locally test https://gerrit.wikimedia.org/r/c/mediawiki/skins/MinervaNeue/+/1119574
- The patch https://gerrit.wikimedia.org/r/c/mediawiki/skins/MinervaNeue/+/1119574 is merged.
- The work can be tested on a patchdemo or beta cluster.
- @JScherer-WMF has signed of the design. In particular, testing text accommodates varying lengths without truncation. If issues, follow up tickets are created.
Implementation notes
- Ensure skin-minerva-donate-banner-* messages are properly overridden in WikimediaMessages. _
- Confirm wikimediaoverrides/en.json loads correctly.
- Verify includes/Hooks.php registers these messages in $keysToOverride.
- Check Special:AllMessages and API return correct values.
- Ensure Minerva displays the banner correctly.
Communication
Notify the team once the feature is deployed to the testing environment (beta cluster).
Collaborate with QA to validate the feature in the testing environment.
Share any observed issues or adjustments needed during testing with the team.
Rollback Plan
Revert changes
Created using the Web team task template via phabulous
