Bmansurov has uploaded a new change for review.
https://gerrit.wikimedia.org/r/257820
Change subject: Allow measuring impact of section collapsing in
Schema:MobileWebSectionUsage
......................................................................
Allow measuring impact of section collapsing in Schema:MobileWebSectionUsage
* Update schema revision to 15038458;
* Trigger "scrolled-into-view" event when the first heading is
scrolled into the user's viewport or is already in it;
* 50% of the sampled users will be bucketed as group A;
* Users in the A group will see sections expanded by default in stable
and while on a small screen;
* Make isUserInBucket method of the Schema public.
Bug: T120292
Change-Id: I91f82ed3c1bc7dcd70305a7e0baebd5e8b77068c
---
M includes/MobileFrontend.hooks.php
M includes/Resources.php
M resources/mobile.startup/Schema.js
M resources/mobile.toggle/toggle.js
4 files changed, 88 insertions(+), 12 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/20/257820/1
diff --git a/includes/MobileFrontend.hooks.php
b/includes/MobileFrontend.hooks.php
index 1f3183a..0dd4e8a 100644
--- a/includes/MobileFrontend.hooks.php
+++ b/includes/MobileFrontend.hooks.php
@@ -985,7 +985,7 @@
'MobileWebDiffClickTracking' => 10720373,
'MobileWebMainMenuClickTracking' => 11568715,
'MobileWebSearch' => 12054448,
- 'MobileWebSectionUsage' => 14321266,
+ 'MobileWebSectionUsage' => 15038458,
'MobileWebUIClickTracking' => 10742159,
'MobileWebWatching' => 11761466,
'MobileWebWatchlistClickTracking' => 10720361,
diff --git a/includes/Resources.php b/includes/Resources.php
index 10f8e4d..5121d82 100644
--- a/includes/Resources.php
+++ b/includes/Resources.php
@@ -923,8 +923,8 @@
'mobile.toggle' => $wgMFResourceFileModuleBoilerplate + array(
'dependencies' => array(
'mobile.settings',
- // uses util.js
- 'mobile.startup',
+ // uses util.js and jquery.throttle-debounce
+ 'mobile.startup'
),
'styles' => array(
'resources/mobile.toggle/toggle.less',
diff --git a/resources/mobile.startup/Schema.js
b/resources/mobile.startup/Schema.js
index fe72c39..bcddb0d 100644
--- a/resources/mobile.startup/Schema.js
+++ b/resources/mobile.startup/Schema.js
@@ -82,9 +82,8 @@
/**
* Whether the user is bucketed.
* @returns {Boolean}
- * @private
*/
- _isUserInBucket: function () {
+ isUserInBucket: function () {
if ( mw.config.get( 'wgMFIgnoreEventLoggingBucketing' )
) {
return true;
} else if ( this._isInBucket === undefined ) {
@@ -127,7 +126,7 @@
var deferred = $.Deferred();
// Log event if logging schema is not sampled or if
user is in the bucket
- if ( !this.isSampled || this._isUserInBucket() ) {
+ if ( !this.isSampled || this.isUserInBucket() ) {
mw.track( 'event.' + this.name, $.extend( {},
this.defaults, data ) );
return deferred.resolve();
diff --git a/resources/mobile.toggle/toggle.js
b/resources/mobile.toggle/toggle.js
index 3ef04af..2253971 100644
--- a/resources/mobile.toggle/toggle.js
+++ b/resources/mobile.toggle/toggle.js
@@ -11,7 +11,8 @@
name: 'arrow-down',
additionalClassNames: 'indicator'
},
- Icon = M.require( 'mobile.startup/Icon' );
+ Icon = M.require( 'mobile.startup/Icon' ),
+ $window = $( window );
/**
* A class for enabling toggling
@@ -24,10 +25,11 @@
* @extends OO.EventEmitter
*/
function Toggler( $container, prefix, page, schema ) {
+ this.schema = schema;
+
OO.EventEmitter.call( this );
this._enable( $container, prefix, page );
- if ( schema ) {
- this.schema = schema;
+ if ( this.schema ) {
this.connect( this, {
toggled: 'onToggle'
} );
@@ -239,10 +241,11 @@
* @private
*/
Toggler.prototype._enable = function ( $container, prefix, page ) {
- var tagName, expandSections, indicator,
+ var tagName, expandSections, indicator, inSample, experiment,
$firstHeading,
self = this,
- collapseSectionsByDefault = mw.config.get(
'wgMFCollapseSectionsByDefault' );
+ collapseSectionsByDefault = mw.config.get(
'wgMFCollapseSectionsByDefault' ),
+ token = settings.get(
'MobileWebSectionUsage-test-token' );
// Also allow .section-heading if some extensions like Wikibase
// want to toggle other headlines than direct descendants of
$container.
@@ -255,6 +258,31 @@
}
expandSections = !collapseSectionsByDefault ||
( context.isBetaGroupMember() && settings.get(
'expandSections', true ) === 'true' );
+
+ // A/B test to measure the impact of section collapsing
+ if ( self.schema && self.schema.isUserInBucket() ) {
+ if ( !token ) {
+ token = mw.user.generateRandomSessionId();
+ settings.save(
'MobileWebSectionUsage-test-token', token );
+ }
+ experiment = {
+ enabled: true,
+ buckets: {
+ control: 0.5,
+ A: 0.5
+ }
+ };
+ inSample = mw.experiments.getBucket( experiment, token
) === 'A';
+
+ // Bucketed users who are in stable and using a small
screen device
+ // will see expanded sections by default
+ // @see T120292
+ if ( inSample && context.getMode() === 'stable' &&
!browser.isWideScreen() ) {
+ expandSections = true;
+
+ logWhenHeadingIsScrolledIntoView( $firstHeading
);
+ }
+ }
$container.find( tagName ).each( function ( i ) {
var $heading = $( this ),
@@ -298,7 +326,6 @@
// Expand sections by default on wide
screen devices or if the expand sections setting is set
self.toggle.call( self, $heading );
}
-
}
} );
@@ -332,6 +359,56 @@
}
}
+ /**
+ * Check if at least half of the element's height and half of
its width are in viewport
+ *
+ * @method
+ * @param {jQuery.Object} $el - element that's being tested
+ * @return {boolean}
+ */
+ function isElementInViewport( $el ) {
+ var windowHeight = $window.height(),
+ windowWidth = $window.width(),
+ windowScrollLeft = $window.scrollLeft(),
+ windowScrollTop = $window.scrollTop(),
+ elHeight = $el.height(),
+ elWidth = $el.width(),
+ elOffset = $el.offset();
+
+ return (
+ ( windowScrollTop + windowHeight >=
elOffset.top + elHeight / 2 ) &&
+ ( windowScrollLeft + windowWidth >=
elOffset.left + elWidth / 2 ) &&
+ ( windowScrollTop <= elOffset.top + elHeight /
2 )
+ );
+ }
+
+ /**
+ * Log when the first heading is scrolled into the view
+ *
+ * @param {jQuery.Object} $heading
+ */
+ function logWhenHeadingIsScrolledIntoView( $heading ) {
+ /**
+ * Log when a heading is seen by the user
+ * @ignore
+ */
+ function log() {
+ if ( isElementInViewport( $heading ) ) {
+ $window.off( 'scroll', log );
+ self.schema.log( {
+ eventName: 'scrolled-into-view',
+ isTestA: true
+ } );
+ }
+ }
+
+ $window.on(
+ 'scroll',
+ $.debounce( 250, log )
+ );
+ log();
+ }
+
checkInternalRedirectAndHash();
checkHash( this );
// Restricted to links created by editors and thus outside our
control
--
To view, visit https://gerrit.wikimedia.org/r/257820
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I91f82ed3c1bc7dcd70305a7e0baebd5e8b77068c
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Bmansurov <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
