Merge "Support watchlist expiry"

build/screenshots-client/utils.js

@@ -3,9 +3,9 @@ module.exports = function () {
 
 	window.seleniumUtils = {
 		getBoundingRect: function ( elements ) {
-			var i, l, rect, boundingRect;
-			for ( i = 0, l = elements.length; i < l; i++ ) {
-				rect = elements[ i ].getBoundingClientRect();
+			var boundingRect;
+			for ( var i = 0, l = elements.length; i < l; i++ ) {
+				var rect = elements[ i ].getBoundingClientRect();
 				if ( !boundingRect ) {
 					boundingRect = {
 						left: rect.left,

modules/ve-mw/init/targets/ve.init.mw.ArticleTarget.js

@@ -414,7 +414,10 @@ ve.init.mw.ArticleTarget.prototype.parseMetadata = function ( response ) {
 		this.retriedRevIdConflict = false;
 	}
 
-	checkboxes = mw.libs.ve.targetLoader.createCheckboxFields( this.checkboxesDef );
+	// Save dialog doesn't exist yet, so create an overlay for the widgets, and
+	// append it to the save dialog later.
+	this.$saveDialogOverlay = $( '<div>' ).addClass( 'oo-ui-window-overlay' );
+	checkboxes = mw.libs.ve.targetLoader.createCheckboxFields( this.checkboxesDef, { $overlay: this.$saveDialogOverlay } );
 	this.checkboxFields = checkboxes.checkboxFields;
 	this.checkboxesByName = checkboxes.checkboxesByName;
 
@@ -1320,7 +1323,8 @@ ve.init.mw.ArticleTarget.prototype.getSaveFields = function () {
 	}
 
 	for ( name in this.checkboxesByName ) {
-		if ( this.checkboxesByName[ name ].isSelected() ) {
+		// DropdownInputWidget or CheckboxInputWidget
+		if ( !this.checkboxesByName[ name ].isSelected || this.checkboxesByName[ name ].isSelected() ) {
 			fields[ name ] = this.checkboxesByName[ name ].getValue();
 		}
 	}
@@ -1822,6 +1826,9 @@ ve.init.mw.ArticleTarget.prototype.showSaveDialog = function ( action, checkboxN
 				retry: 'onSaveDialogRetry',
 				close: 'onSaveDialogClose'
 			} );
+
+			// Attach custom overlay
+			target.saveDialog.$element.append( target.$saveDialogOverlay );
 		}
 
 		data = target.getSaveDialogOpeningData();

modules/ve-mw/preinit/ve.init.mw.ArticleTargetLoader.js

@@ -114,10 +114,11 @@
 		 * Creates an OOUI checkbox inside an inline field layout
 		 *
 		 * @param {Object[]} checkboxesDef Checkbox definitions from the API
+		 * @param {Object} [widgetConfig] Additional widget config
 		 * @return {Object} Result object with checkboxFields (OO.ui.FieldLayout[]) and
 		 *  checkboxesByName (keyed object of OO.ui.CheckboxInputWidget).
 		 */
-		createCheckboxFields: function ( checkboxesDef ) {
+		createCheckboxFields: function ( checkboxesDef, widgetConfig ) {
 			var checkboxFields = [],
 				checkboxesByName = {};
 
@@ -127,13 +128,6 @@
 						accesskey = null,
 						title = null;
 
-					// Non-checkbox fields are permitted in the 'checkboxes' definitions (since MW
-					// core 4fa7d4d7), but VE doesn't yet support them.
-					// @TODO Remove this and properly support watchlist expiry and other widgets.
-					if ( options.class !== undefined && options.class !== 'OOUI\\CheckboxInputWidget' ) {
-						return;
-					}
-
 					// The messages documented below are just the ones defined in core.
 					// Extensions may add other checkboxes.
 					if ( options.tooltip ) {
@@ -156,20 +150,41 @@
 					// * watchthis
 					var $label = $( '<span>' ).append( mw.message( options[ 'label-message' ] ).parseDom() );
 
-					var checkbox = new OO.ui.CheckboxInputWidget( {
+					var config = $.extend( {
 						accessKey: accesskey,
-						selected: options.default,
 						// The following classes are used here:
 						// * ve-ui-mwSaveDialog-checkbox-wpMinoredit
 						// * ve-ui-mwSaveDialog-checkbox-wpWatchthis
+						// * ve-ui-mwSaveDialog-checkbox-wpWatchlistExpiry
 						classes: [ 've-ui-mwSaveDialog-checkbox-' + name ]
-					} );
+					}, widgetConfig );
+
+					var checkbox;
+					switch ( options.class ) {
+						case 'OOUI\\DropdownInputWidget':
+							checkbox = new OO.ui.DropdownInputWidget( $.extend( config, {
+								value: options.default,
+								options: options.options
+							} ) );
+							break;
+
+						default:
+							checkbox = new OO.ui.CheckboxInputWidget( $.extend( config, {
+								selected: options.default
+							} ) );
+							break;
+					}
 
 					checkboxFields.push(
 						new OO.ui.FieldLayout( checkbox, {
 							align: 'inline',
 							label: $label.contents(),
-							title: title
+							title: title,
+							invisibleLabel: !!options.invisibleLabel,
+							// * ve-ui-mwSaveDialog-field-wpMinoredit
+							// * ve-ui-mwSaveDialog-field-wpWatchthis
+							// * ve-ui-mwSaveDialog-field-wpWatchlistExpiry
+							classes: [ 've-ui-mwSaveDialog-field-' + name ]
 						} )
 					);
 					checkboxesByName[ name ] = checkbox;

modules/ve-mw/ui/dialogs/ve.ui.MWSaveDialog.js

@@ -857,6 +857,9 @@ ve.ui.MWSaveDialog.prototype.getSetupProcess = function ( data ) {
 			this.canPreview = !!data.canPreview;
 			this.setupCheckboxes( data.checkboxFields || [] );
 			this.checkboxesByName = data.checkboxesByName || {};
+			// HACK: Change layout when wpWatchlistExpiry is present to force wpWatchthis
+			// onto a new line, hopefully with the expiry dropdown
+			this.$saveCheckboxes.toggleClass( 've-ui-mwSaveDialog-checkboxes-withExpiry', !!this.checkboxesByName.wpWatchlistExpiry );
 
 			function trackCheckbox( n ) {
 				ve.track( 'activity.mwSave', { action: 'checkbox-' + n } );

modules/ve-mw/ui/styles/dialogs/ve.ui.MWSaveDialog.css

@@ -46,12 +46,21 @@
 .ve-ui-mwSaveDialog-checkboxes > .oo-ui-fieldLayout {
 	display: inline-block;
 	margin: 0 1.5em 0 0;
+	vertical-align: middle;
 }
 
 .ve-ui-mwSaveDialog-checkboxes > .oo-ui-fieldLayout:last-child {
 	margin-right: 0;
 }
 
+.ve-ui-mwSaveDialog-checkboxes-withExpiry > .ve-ui-mwSaveDialog-field-wpMinoredit {
+	display: block;
+}
+
+.ve-ui-mwSaveDialog-checkboxes-withExpiry > .ve-ui-mwSaveDialog-field-wpWatchlistExpiry {
+	margin: 0.5em 0;
+}
+
 .ve-ui-mwSaveDialog-editSummary-count {
 	position: absolute;
 	right: 0;