Bring reference type detection in sync with RESTbased endpoint

The RESTbased references endpoint accepts multiple <cite> tags, as long
as they do not have conflicting types.

As specified at
https://www.mediawiki.org/wiki/Page_Content_Service/References#Decisions

Bug: T215281
Change-Id: I8a7d2d6da8a8d9746b971417833b954d1f1d6041

src/gateway/reference.js

@@ -22,6 +22,13 @@ export default function createReferenceGateway() {
 	}
 
 	/**
+	 * This extracts the type (e.g. "web") from one or more <cite> elements class name lists, as
+	 * long as these don't conflict. A "citation" class is always ignored. <cite> elements without
+	 * another class (other than "citation") are ignored as well.
+	 *
+	 * Note this might return multiple types, e.g. <cite class="web citation paywalled"> will be
+	 * returned as "web paywalled". Validation must be done in the code consuming this.
+	 *
 	 * This duplicates the strict type detection from
 	 * @see https://phabricator.wikimedia.org/diffusion/GMOA/browse/master/lib/transformations/references/structureReferenceListContent.js$93
 	 *
@@ -29,12 +36,20 @@ export default function createReferenceGateway() {
 	 * @returns {string|null}
 	 */
 	function scrapeReferenceType( $referenceText ) {
-		const $cite = $referenceText.find( 'cite[class]' );
+		let type = null;
-		if ( $cite.length === 1 ) {
-			return $cite.attr( 'class' ).replace( /\bcitation\b/g, '' ).trim();
-		}
 
-		return null;
+		$referenceText.find( 'cite[class]' ).each( function ( index, el ) {
+			const nextType = el.className.replace( /\bcitation\b\s*/g, '' ).trim();
+
+			if ( !type ) {
+				type = nextType;
+			} else if ( nextType && nextType !== type ) {
+				type = null;
+				return false;
+			}
+		} );
+
+		return type;
 	}
 
 	/**

tests/node-qunit/gateway/reference.test.js

@@ -17,6 +17,19 @@ QUnit.module( 'ext.popups/gateway/reference', {
 				$( '<span>' ).addClass( 'reference-text' ).append(
 					$( '<cite>' ).addClass( 'citation web unknown' ).text( 'Footnote 2' )
 				)
+			),
+			$( '<li>' ).attr( 'id', 'cite_note--3' ).append(
+				$( '<span>' ).addClass( 'reference-text' ).append(
+					$( '<cite>' ).addClass( 'news' ).text( 'Footnote 3' ),
+					$( '<cite>' ).addClass( 'news citation' ),
+					$( '<cite>' ).addClass( 'citation' )
+				)
+			),
+			$( '<li>' ).attr( 'id', 'cite_note--4' ).append(
+				$( '<span>' ).addClass( 'reference-text' ).append(
+					$( '<cite>' ).addClass( 'news' ).text( 'Footnote 4' ),
+					$( '<cite>' ).addClass( 'web' )
+				)
 			)
 		).appendTo( document.body );
 	},
@@ -63,6 +76,42 @@ QUnit.test( 'Reference preview gateway accepts alternative text node class name'
 	} );
 } );
 
+QUnit.test( 'Reference preview gateway accepts duplicated types', function ( assert ) {
+	const gateway = createReferenceGateway(),
+		title = createStubTitle( 1, 'Foo', 'cite note--3' );
+
+	return gateway.fetchPreviewForTitle( title ).then( ( result ) => {
+		assert.propEqual(
+			result,
+			{
+				url: '#cite_note--3',
+				extract: '<cite class="news">Footnote 3</cite><cite class="news citation"></cite><cite class="citation"></cite>',
+				type: 'reference',
+				referenceType: 'news',
+				sourceElementId: undefined
+			}
+		);
+	} );
+} );
+
+QUnit.test( 'Reference preview gateway rejects conflicting types', function ( assert ) {
+	const gateway = createReferenceGateway(),
+		title = createStubTitle( 1, 'Foo', 'cite note--4' );
+
+	return gateway.fetchPreviewForTitle( title ).then( ( result ) => {
+		assert.propEqual(
+			result,
+			{
+				url: '#cite_note--4',
+				extract: '<cite class="news">Footnote 4</cite><cite class="web"></cite>',
+				type: 'reference',
+				referenceType: null,
+				sourceElementId: undefined
+			}
+		);
+	} );
+} );
+
 QUnit.test( 'Reference preview gateway returns source element id', function ( assert ) {
 	const gateway = createReferenceGateway(),
 		title = createStubTitle( 1, 'Foo', 'cite note--1' );