Readers Web will be A/B testing the existing treatment of the language switcher and a new treatment being worked on as part of Desktop Improvements (Vector 2022). Those users in the control group will be sent the existing treatment.
Per T268504, we'd like to know how many users are clicking on links in the Languages list in the sidebar. In https://phabricator.wikimedia.org/T268504#6796216, we explored measuring this and landed on adding this functionality to the UniversalLanguageSwitcher instrument.
AC
- When I click on a link in the Languages list in the sidebar, then I see a UniversalLanguageSwitcher event being logged
- The event's context property is set to languages-list; and
- The event's language property is set to the language code of the wiki being linked to, i.e. the hreflang attribute of the link
QA Steps
Prod
- Navigate to https://en.wikipedia.org/wiki/Barack_Obama?useskinversion=2&languageinheader=0
- Click on any link in the Languages list
- Observe that an UniversalLanguageSwitcher event is logged with the properties described above
Local
- Install EventLogging, WikimediaEvents, + the secondary schema (README on @nray's quickstart guide has good instructions)
- Because of constraints with local dev environments around proper language listing, to fake having the correct markup (i.e. hreflang attribute has value) in the legacy languages list, include the following js snippet on your local MediaWiki:Common.js :
const languages = document.querySelectorAll(".interlanguage-link-target"); var linkTitleArray; for (var i = 0; i < languages.length; i++) { linkTitleArray = languages[i].getAttribute('title').split(':'); languages[i].setAttribute('hreflang', linkTitleArray[1].toLowerCase()); }
This comment on the patch explains a bit more with screenshots
- Once you have the eventgate devserver running locally in your terminal (required some finagling with npm errors - basically include:
"dependencies": { "phantomjs-prebuilt": "^2.1.14" }
in the package.json file of your local EventLogging repo before running npm -i)
- Click on one of the legacy languages in the list of a test page (assuming you have content provider enabled and the js injected markup working), and watch the event logging record the event in the terminal (screenshots in associated Gerrit patch).
- Change preferences to use Legacy Vector, save changes, click on sidebar language links, note that eventgate-devserver does NOT record clicks.
Developer Notes
function interfaceLanguageChange( language, source ) { log( { /* ... */ language: language, context: source || 'interface' } ); } /* ... */ document.body.addEventListener( 'click', ( event ) => { var el = event.target; if ( !el.classList.contains( 'interlanguage-link-target' ) ) { return; } mw.hook( 'mw.uls.interface.language.change' ).fire( el.attributes.getNamedItem( 'hreflang' ), 'languages-list' ); } );