jenkins-bot has submitted this change and it was merged. Change subject: List creation and editing validation ......................................................................
List creation and editing validation Add validation to CollectionContentOverlay: * Checking title is less or equal to 90 characters ** Will need improvement for other languages * Duplicate collection title handling already done ** Page is added to existing collection vs added to duplicate *** Exception same title with case difference Add validation to CollectionEditOverlay: * Validates title is less or equal to 90 characters * Validates description is less or equal to 280 characters ** Again this needs to consider other languages * Shows edit failed toast ** Probably could have a different message but used existing for now * Added QUnit tests bug: T92779 Change-Id: I1a755ffa5d459ed552ed2c102795f76cce5ddcc3 --- M includes/Gather.hooks.php M resources/Resources.php M resources/ext.gather.collection.editor/CollectionEditOverlay.js M resources/ext.gather.watchstar/CollectionsContentOverlay.js A tests/qunit/ext.gather.collection.editor/test_CollectionEditOverlay.js 5 files changed, 125 insertions(+), 28 deletions(-) Approvals: Jdlrobson: Looks good to me, approved jenkins-bot: Verified diff --git a/includes/Gather.hooks.php b/includes/Gather.hooks.php index cb05071..84a69e7 100644 --- a/includes/Gather.hooks.php +++ b/includes/Gather.hooks.php @@ -121,6 +121,12 @@ ), 'dependencies' => array( 'ext.gather.watchstar' ), ); + $modules['qunit']['ext.gather.collection.editor.tests'] = $boilerplate + array( + 'scripts' => array( + 'ext.gather.collection.editor/test_CollectionEditOverlay.js', + ), + 'dependencies' => array( 'ext.gather.collection.editor' ), + ); return true; } diff --git a/resources/Resources.php b/resources/Resources.php index f0f15e4..a63810f 100644 --- a/resources/Resources.php +++ b/resources/Resources.php @@ -133,6 +133,7 @@ 'gather-add-to-existing', 'gather-watchlist-title', 'gather-add-toast', + 'gather-add-failed-toast', 'gather-remove-toast', 'gather-anon-cta', 'gather-collection-member', diff --git a/resources/ext.gather.collection.editor/CollectionEditOverlay.js b/resources/ext.gather.collection.editor/CollectionEditOverlay.js index f617995..5213b63 100644 --- a/resources/ext.gather.collection.editor/CollectionEditOverlay.js +++ b/resources/ext.gather.collection.editor/CollectionEditOverlay.js @@ -16,6 +16,8 @@ CollectionEditOverlay = Overlay.extend( { /** @inheritdoc */ className: 'collection-editor-overlay overlay position-fixed', + titleMaxLength: 90, + descriptionMaxLength: 180, /** @inheritdoc */ defaults: $.extend( {}, Overlay.prototype.defaults, { editFailedError: mw.msg( 'gather-edit-collection-failed-error' ), @@ -55,30 +57,53 @@ * Event handler when the save button is clicked. */ onSaveClick: function () { - var self = this; - // disable button and inputs - this.showSpinner(); - this.$( '.mw-ui-input, .save' ).prop( 'disabled', true ); - this.api.editCollection( - this.id, this.$( '.title' ).val(), this.$( '.description' ).val() - ).done( function () { - // Go back to the page we were and reload to avoid having to update the - // JavaScript state. - schema.log( { - eventName: 'edit-collection' - } ).done( function () { - router.navigate( '/' ); - window.location.reload(); + var title = this.$( '.title' ).val(), + description = this.$( '.description' ).val(); + + if ( this.isTitlevalid( title ) && this.isDescriptionValid( description ) ) { + // disable button and inputs + this.showSpinner(); + this.$( '.mw-ui-input, .save' ).prop( 'disabled', true ); + this.api.editCollection( this.id, title, description ).done( function () { + // Go back to the page we were and reload to avoid having to update the + // JavaScript state. + schema.log( { + eventName: 'edit-collection' + } ).done( function () { + router.navigate( '/' ); + window.location.reload(); + } ); + } ).fail( function ( errMsg ) { + toast.show( this.options.editFailedError, 'toast error' ); + // Make it possible to try again. + this.$( '.mw-ui-input, .save' ).prop( 'disabled', false ); + schema.log( { + eventName: 'edit-collection-error', + errorMessage: errMsg + } ); } ); - } ).fail( function ( errMsg ) { - toast.show( self.options.editFailedError, 'toast error' ); - // Make it possible to try again. - self.$( '.mw-ui-input, .save' ).prop( 'disabled', false ); - schema.log( { - eventName: 'edit-collection-error', - errorMessage: errMsg - } ); - } ); + } else { + toast.show( this.options.editFailedError, 'toast error' ); + } + + }, + /** + * Tests if title is valid + * @param {[type]} title Proposed collection title + * @returns {Boolean} + */ + isTitleValid: function ( title ) { + // FIXME: Need to consider other languages + return title.length <= this.titleMaxLength; + }, + /** + * Tests if description is valid + * @param {[type]} description Proposed collection description + * @returns {Boolean} + */ + isDescriptionValid: function ( description ) { + // FIXME: Need to consider other languages + return description.length <= this.descriptionMaxLength; } } ); diff --git a/resources/ext.gather.watchstar/CollectionsContentOverlay.js b/resources/ext.gather.watchstar/CollectionsContentOverlay.js index f578a5e..2f08bc6 100644 --- a/resources/ext.gather.watchstar/CollectionsContentOverlay.js +++ b/resources/ext.gather.watchstar/CollectionsContentOverlay.js @@ -86,6 +86,15 @@ this.hideSpinner(); }, /** + * Tests if title is valid + * FIXME: This is duplicating code from CollectionEditOverlay.js + * @param {String} title Proposed collection title + * @returns {Boolean} + */ + isTitleValid: function ( title ) { + return title.length <= 90; + }, + /** * Event handler for focusing input * @param {jQuery.Event} ev */ @@ -121,11 +130,17 @@ title = $( ev.target ).find( 'input' ).val(); ev.preventDefault(); - this.showSpinner(); - this.addCollection( title, page ); - schema.log( { - eventName: 'new-collection' - } ); + if ( this.isTitleValid( title ) ) { + this.showSpinner(); + this.addCollection( title, page ); + schema.log( { + eventName: 'new-collection' + } ); + + this.addCollection( title, page ); + } else { + toast.show( mw.msg( 'gather-add-failed-toast', title ), 'toast' ); + } }, /** * Event handler for all clicks inside overlay. @@ -239,6 +254,7 @@ var self = this, api = this.api; + this.showSpinner(); return api.addCollection( title ).done( function ( collection ) { api.addPageToCollection( collection.id, page ).done( $.proxy( self, '_collectionStateChange', collection, true ) diff --git a/tests/qunit/ext.gather.collection.editor/test_CollectionEditOverlay.js b/tests/qunit/ext.gather.collection.editor/test_CollectionEditOverlay.js new file mode 100644 index 0000000..9c8f03e --- /dev/null +++ b/tests/qunit/ext.gather.collection.editor/test_CollectionEditOverlay.js @@ -0,0 +1,49 @@ +( function ( M ) { + var CollectionEditOverlay = M.require( 'ext.gather.edit/CollectionEditOverlay' ), + collection, + overlay; + + QUnit.module( 'Gather', { + setup: function () { + collection = { + id: 1, + title: 'Cool title', + description: 'Hey, I\'m a collection description.' + }; + overlay = new CollectionEditOverlay( { + collection: collection + } ); + this.validTitle = randomString( overlay.titleMaxLength ); + this.invalidTitle = randomString( overlay.titleMaxLength + 1 ); + this.validDescription = randomString( overlay.descriptionMaxLength ); + this.invalidDescription = randomString( overlay.descriptionMaxLength + 1 ); + + } + } ); + + /** + * Use base 36 method to generate a random string with specified length + * @param {Number} length length of desired string + * @returns {String} randomly generated string + */ + function randomString( length ) { + return Math.round( + ( Math.pow( 36, length + 1 ) - Math.random() * Math.pow( 36, length ) ) + ).toString( 36 ).slice( 1 ); + } + + QUnit.test( 'Collection title validation', 2, function ( assert ) { + assert.strictEqual( overlay.isTitleValid( this.validTitle ), true, + 'Check that a valid title is correctly evaluated' ); + assert.strictEqual( overlay.isTitleValid( this.invalidTitle ), false, + 'Check that an invalid title is correctly evaluated' ); + } ); + + QUnit.test( 'Collection description validation', 2, function ( assert ) { + assert.strictEqual( overlay.isDescriptionValid( this.validDescription ), true, + 'Check that a valid description is correctly evaluated' ); + assert.strictEqual( overlay.isDescriptionValid( this.invalidDescription ), false, + 'Check that an invalid description is correctly evaluated' ); + } ); + +}( mw.mobileFrontend ) ); -- To view, visit https://gerrit.wikimedia.org/r/198430 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: merged Gerrit-Change-Id: I1a755ffa5d459ed552ed2c102795f76cce5ddcc3 Gerrit-PatchSet: 10 Gerrit-Project: mediawiki/extensions/Gather Gerrit-Branch: master Gerrit-Owner: Robmoen <rm...@wikimedia.org> Gerrit-Reviewer: Jdlrobson <jrob...@wikimedia.org> Gerrit-Reviewer: Robmoen <rm...@wikimedia.org> Gerrit-Reviewer: jenkins-bot <> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits