From 1fec9e640cc6b9fd14d7eb004ca98939aa374c6e Mon Sep 17 00:00:00 2001
From: Luqgreg <luqgreg@gmail.com>
Date: Sun, 23 Dec 2018 01:04:00 +0100
Subject: [PATCH 1/5] Add infobox type attribute

---
 .../PortableInfoboxParserTagController.php    | 10 +-
 .../Helpers/InfoboxParamsValidator.php        |  1 +
 .../services/PortableInfoboxRenderService.php |  6 +-
 templates/PortableInfoboxWrapper.hbs          |  2 +-
 .../PortableInfoboxRenderServiceTest.php      | 98 ++++++++++++-------
 5 files changed, 80 insertions(+), 37 deletions(-)

diff --git a/includes/controllers/PortableInfoboxParserTagController.php b/includes/controllers/PortableInfoboxParserTagController.php
index 67a2916..309df08 100644
--- a/includes/controllers/PortableInfoboxParserTagController.php
+++ b/includes/controllers/PortableInfoboxParserTagController.php
@@ -13,6 +13,7 @@ class PortableInfoboxParserTagController {
 	const DEFAULT_LAYOUT_NAME = 'default';
 	const INFOBOX_THEME_PREFIX = 'pi-theme-';
 	const INFOBOX_LAYOUT_PREFIX = 'pi-layout-';
+	const INFOBOX_TYPE_PREFIX = 'pi-type-';
 	const ACCENT_COLOR = 'accent-color';
 	const ACCENT_COLOR_TEXT = 'accent-color-text';
 	const ERR_UNIMPLEMENTEDNODE = 'portable-infobox-unimplemented-infobox-tag';
@@ -64,10 +65,11 @@ class PortableInfoboxParserTagController {
 		$layout = $this->getLayout( $params );
 		$accentColor = $this->getColor( self::ACCENT_COLOR, $params, $frame );
 		$accentColorText = $this->getColor( self::ACCENT_COLOR_TEXT, $params, $frame );
+		$type = $this->getType( $params );
 
 		$renderService = new PortableInfoboxRenderService();
 		return $renderService->renderInfobox(
-			$data, implode( ' ', $themeList ), $layout, $accentColor, $accentColorText
+			$data, implode( ' ', $themeList ), $layout, $accentColor, $accentColorText, $type
 		);
 	}
 
@@ -235,6 +237,12 @@ class PortableInfoboxParserTagController {
 		return $color;
 	}
 
+	private function getType( $params ) {
+		return !empty( $params['type'] ) ? Sanitizer::escapeClass(
+				self::INFOBOX_TYPE_PREFIX . preg_replace( '|\s+|s', '-', $params['type'] )
+			) : '';
+	}
+
 	private function sanitizeColor( $color ) {
 		return $this->getParamsValidator()->validateColorValue( $color );
 	}
diff --git a/includes/services/Helpers/InfoboxParamsValidator.php b/includes/services/Helpers/InfoboxParamsValidator.php
index 6163887..4c1e34f 100644
--- a/includes/services/Helpers/InfoboxParamsValidator.php
+++ b/includes/services/Helpers/InfoboxParamsValidator.php
@@ -10,6 +10,7 @@ class InfoboxParamsValidator {
 		'layout',
 		'theme',
 		'theme-source',
+		'type'
 	];
 
 	private static $supportedLayouts = [
diff --git a/includes/services/PortableInfoboxRenderService.php b/includes/services/PortableInfoboxRenderService.php
index 754eca2..19422e8 100644
--- a/includes/services/PortableInfoboxRenderService.php
+++ b/includes/services/PortableInfoboxRenderService.php
@@ -23,10 +23,11 @@ class PortableInfoboxRenderService {
 	 * @param string $layout
 	 * @param string $accentColor
 	 * @param string $accentColorText
+	 * @param string $type
 	 * @return string - infobox HTML
 	 */
 	public function renderInfobox(
-		array $infoboxdata, $theme, $layout, $accentColor, $accentColorText
+		array $infoboxdata, $theme, $layout, $accentColor, $accentColorText, $type
 	) {
 		$this->inlineStyles = $this->getInlineStyles( $accentColor, $accentColorText );
 
@@ -36,7 +37,8 @@ class PortableInfoboxRenderService {
 			$output = $this->renderItem( 'wrapper', [
 				'content' => $infoboxHtmlContent,
 				'theme' => $theme,
-				'layout' => $layout
+				'layout' => $layout,
+				'type' => $type
 			] );
 		} else {
 			$output = '';
diff --git a/templates/PortableInfoboxWrapper.hbs b/templates/PortableInfoboxWrapper.hbs
index 51d01ab..b872804 100644
--- a/templates/PortableInfoboxWrapper.hbs
+++ b/templates/PortableInfoboxWrapper.hbs
@@ -1 +1 @@
-<aside class="portable-infobox pi-background{{#if theme}} {{theme}}{{/if}}{{#if layout}} {{layout}}{{/if}}">{{{content}}}</aside>
\ No newline at end of file
+<aside class="portable-infobox pi-background{{#if theme}} {{theme}}{{/if}}{{#if layout}} {{layout}}{{/if}}{{#if type}} {{type}}{{/if}}">{{{content}}}</aside>
\ No newline at end of file
diff --git a/tests/phpunit/PortableInfoboxRenderServiceTest.php b/tests/phpunit/PortableInfoboxRenderServiceTest.php
index 82b7e21..6c2d96b 100644
--- a/tests/phpunit/PortableInfoboxRenderServiceTest.php
+++ b/tests/phpunit/PortableInfoboxRenderServiceTest.php
@@ -38,7 +38,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 		$infoboxRenderService = new PortableInfoboxRenderService();
 
 		$actualOutput = $infoboxRenderService->renderInfobox(
-			$input, '', '', $accentColor, $accentColorText
+			$input, '', '', $accentColor, $accentColorText, ''
 		);
 		$expectedHtml = $this->normalizeHTML( $expectedOutput );
 		$actualHtml = $this->normalizeHTML( $actualOutput );
@@ -70,7 +70,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Only title',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -86,7 +87,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Only title with custom colors',
 				'accentColor' => '#FFF',
-				'accentColorText' => '#000'
+				'accentColorText' => '#000',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -117,7 +119,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Only image',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -144,7 +147,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Only video',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -160,7 +164,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'navigation only',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -180,7 +185,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Only pair',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -227,7 +233,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Simple infobox with title, image and key-value pair',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -258,7 +265,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Simple infobox with title, INVALID image and key-value pair',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -285,7 +293,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Simple infobox with title, empty image and key-value pair',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -342,7 +351,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with title, group with header and two key-value pairs',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -400,7 +410,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 				'description' => 'Infobox with title, group with header and two key-value pairs, custom' .
 					'accent color and accent text color',
 				'accentColor' => '#FFF',
-				'accentColorText' => '#000'
+				'accentColorText' => '#000',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -456,7 +467,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with horizontal group',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -499,7 +511,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with horizontal group without header and labels',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -517,7 +530,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with navigation',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			// horizontal group tests
 			[
@@ -567,7 +581,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Horizontal group data without header',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -623,7 +638,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Horizontal group data with empty label',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -666,7 +682,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Horizontal group data with empty label',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -754,7 +771,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 5 elements with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -831,7 +849,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 4 elements with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -869,7 +888,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of a single element with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -918,7 +938,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 2 + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -967,7 +988,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 2 + 1 with row size 7',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -1039,7 +1061,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 2 + 2 + 2 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -1140,7 +1163,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 1 + 1 + default + 1 + 1 + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -1241,7 +1265,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 1 + 1 + 1 + 1 + 1 + default with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -1307,7 +1332,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 40 + 1 + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -1379,7 +1405,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 1 + 40 + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -1452,7 +1479,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 1 + 1 + title + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -1532,7 +1560,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 1 (no label) + 1 (no label) + title + 1 (no label) + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -1598,7 +1627,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Simple infobox with title and image collection',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -1655,7 +1685,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with title, collapsible group with header and two key-value pairs',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			],
 			[
 				'input' => [
@@ -1712,7 +1743,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with title, collapsed group with header and two key-value pairs',
 				'accentColor' => '',
-				'accentColorText' => ''
+				'accentColorText' => '',
+				'type' => ''
 			]
 		];
 	}

From ad504e4c07e9cfc88df478c161f2bf0b9e87b698 Mon Sep 17 00:00:00 2001
From: Luqgreg <luqgreg@gmail.com>
Date: Thu, 27 Dec 2018 02:01:19 +0100
Subject: [PATCH 2/5] Add data-source attributes to html output

---
 includes/services/Parser/Nodes/Node.php       |   5 +-
 includes/services/Parser/Nodes/NodeData.php   |   3 +-
 includes/services/Parser/Nodes/NodeMedia.php  |   3 +-
 includes/services/Parser/Nodes/NodeTitle.php  |   5 +-
 .../services/PortableInfoboxRenderService.php |  22 +--
 .../PortableInfoboxHorizontalGroupContent.hbs |  14 +-
 templates/PortableInfoboxItemData.hbs         |   2 +-
 templates/PortableInfoboxItemMedia.hbs        |   2 +-
 .../PortableInfoboxItemMediaCollection.hbs    |   4 +-
 templates/PortableInfoboxItemSmartGroup.hbs   |   8 +-
 templates/PortableInfoboxItemTitle.hbs        |   2 +-
 .../PortableInfoboxDataServiceTest.php        |   3 +-
 tests/phpunit/nodes/NodeDataTest.php          |  89 ++++++++----
 tests/phpunit/nodes/NodeGroupTest.php         | 128 +++++++++++++++---
 tests/phpunit/nodes/NodeMediaTest.php         |  18 ++-
 tests/phpunit/nodes/NodeTitleTest.php         |  22 +--
 16 files changed, 243 insertions(+), 87 deletions(-)

diff --git a/includes/services/Parser/Nodes/Node.php b/includes/services/Parser/Nodes/Node.php
index c399e98..65f13f3 100644
--- a/includes/services/Parser/Nodes/Node.php
+++ b/includes/services/Parser/Nodes/Node.php
@@ -110,7 +110,10 @@ class Node {
 
 	public function getData() {
 		if ( !isset( $this->data ) ) {
-			$this->data = [ 'value' => (string)$this->xmlNode ];
+			$this->data = [
+				'value' => (string)$this->xmlNode,
+				'source' => $this->getXmlAttribute( $this->xmlNode, self::DATA_SRC_ATTR_NAME )
+			];
 		}
 
 		return $this->data;
diff --git a/includes/services/Parser/Nodes/NodeData.php b/includes/services/Parser/Nodes/NodeData.php
index 3c527d1..989462e 100644
--- a/includes/services/Parser/Nodes/NodeData.php
+++ b/includes/services/Parser/Nodes/NodeData.php
@@ -14,7 +14,8 @@ class NodeData extends Node {
 				'label' => $this->getInnerValue( $this->xmlNode->{self::LABEL_TAG_NAME} ),
 				'value' => $this->getValueWithDefault( $this->xmlNode ),
 				'span' => $this->getSpan(),
-				'layout' => $this->getLayout()
+				'layout' => $this->getLayout(),
+				'source' => $this->getXmlAttribute( $this->xmlNode, self::DATA_SRC_ATTR_NAME )
 			];
 		}
 
diff --git a/includes/services/Parser/Nodes/NodeMedia.php b/includes/services/Parser/Nodes/NodeMedia.php
index daa3e2b..0c67812 100644
--- a/includes/services/Parser/Nodes/NodeMedia.php
+++ b/includes/services/Parser/Nodes/NodeMedia.php
@@ -154,7 +154,8 @@ class NodeMedia extends Node {
 			'caption' => $caption ?: null,
 			'isImage' => in_array( $mediatype, [ MEDIATYPE_BITMAP, MEDIATYPE_DRAWING ] ),
 			'isVideo' => $mediatype === MEDIATYPE_VIDEO,
-			'isAudio' => $mediatype === MEDIATYPE_AUDIO
+			'isAudio' => $mediatype === MEDIATYPE_AUDIO,
+			'source' => $this->getXmlAttribute( $this->xmlNode, self::DATA_SRC_ATTR_NAME )
 		];
 
 		if ( $image['isImage'] ) {
diff --git a/includes/services/Parser/Nodes/NodeTitle.php b/includes/services/Parser/Nodes/NodeTitle.php
index edac344..8ad8633 100644
--- a/includes/services/Parser/Nodes/NodeTitle.php
+++ b/includes/services/Parser/Nodes/NodeTitle.php
@@ -5,7 +5,10 @@ class NodeTitle extends Node {
 	public function getData() {
 		if ( !isset( $this->data ) ) {
 			$title = $this->getValueWithDefault( $this->xmlNode );
-			$this->data = [ 'value' => $title ];
+			$this->data = [
+				'value' => $title,
+				'source' => $this->getXmlAttribute( $this->xmlNode, self::DATA_SRC_ATTR_NAME )
+			];
 		}
 
 		return $this->data;
diff --git a/includes/services/PortableInfoboxRenderService.php b/includes/services/PortableInfoboxRenderService.php
index 19422e8..175be40 100644
--- a/includes/services/PortableInfoboxRenderService.php
+++ b/includes/services/PortableInfoboxRenderService.php
@@ -142,7 +142,7 @@ class PortableInfoboxRenderService {
 			$templateName = 'media';
 		} else {
 			// More than one image means image collection
-			$data = [ 'images' => $data ];
+			$data = [ 'images' => $data, 'source' => $data[0]['source'] ?? "" ];
 			$templateName = 'media-collection';
 		}
 
@@ -182,8 +182,7 @@ class PortableInfoboxRenderService {
 
 	private function createHorizontalGroupData( array $groupData ) {
 		$horizontalGroupData = [
-			'labels' => [],
-			'values' => [],
+			'data' => [],
 			'renderLabels' => false
 		];
 
@@ -191,8 +190,11 @@ class PortableInfoboxRenderService {
 			$data = $item['data'];
 
 			if ( $item['type'] === 'data' ) {
-				array_push( $horizontalGroupData['labels'], $data['label'] );
-				array_push( $horizontalGroupData['values'], $data['value'] );
+				$horizontalGroupData['data'][] = [
+					'label' => $data['label'],
+					'value' => $data['value'],
+					'source' => $item['data']['source'] ?? ""
+				];
 
 				if ( !empty( $data['label'] ) ) {
 					$horizontalGroupData['renderLabels'] = true;
@@ -256,10 +258,14 @@ class PortableInfoboxRenderService {
 			if ( !empty( $label ) ) {
 				$result['renderLabels'] = true;
 			}
-			$result['labels'][] = [ 'value' => $label, 'inlineStyles' => $styles ];
-			$result['values'][] = [ 'value' => $item['data']['value'], 'inlineStyles' => $styles ];
+			$result['data'][] = [
+				'label' => $label,
+				'value' => $item['data']['value'],
+				'inlineStyles' => $styles,
+				'source' => $item['data']['source'] ?? ""
+			];
 
 			return $result;
-		}, [ 'labels' => [], 'values' => [], 'renderLabels' => false ] );
+		}, [ 'data' => [], 'renderLabels' => false ] );
 	}
 }
diff --git a/templates/PortableInfoboxHorizontalGroupContent.hbs b/templates/PortableInfoboxHorizontalGroupContent.hbs
index c9516d5..55bb355 100644
--- a/templates/PortableInfoboxHorizontalGroupContent.hbs
+++ b/templates/PortableInfoboxHorizontalGroupContent.hbs
@@ -3,17 +3,17 @@
 	{{#if renderLabels}}
 	<thead>
 		<tr>
-		{{#each labels}}
-			<th class="pi-horizontal-group-item pi-data-label pi-secondary-font pi-border-color pi-item-spacing">{{{.}}}</th>
+		{{#each data}}
+			<th class="pi-horizontal-group-item pi-data-label pi-secondary-font pi-border-color pi-item-spacing"{{#if source}} data-source="{{source}}"{{/if}}>{{{label}}}</th>
 		{{/each}}
 		</tr>
 	</thead>
 	{{/if}}
 	<tbody>
-	<tr>
-	{{#each values}}
-		<td class="pi-horizontal-group-item pi-data-value pi-font pi-border-color pi-item-spacing">{{{.}}}</td>
-	{{/each}}
-	</tr>
+		<tr>
+		{{#each data}}
+			<td class="pi-horizontal-group-item pi-data-value pi-font pi-border-color pi-item-spacing"{{#if source}} data-source="{{source}}"{{/if}}>{{{value}}}</td>
+		{{/each}}
+		</tr>
 	</tbody>
 </table>
\ No newline at end of file
diff --git a/templates/PortableInfoboxItemData.hbs b/templates/PortableInfoboxItemData.hbs
index 0e8ca05..5deabb7 100644
--- a/templates/PortableInfoboxItemData.hbs
+++ b/templates/PortableInfoboxItemData.hbs
@@ -1,4 +1,4 @@
-<div class="pi-item pi-data pi-item-spacing pi-border-color{{#if cssClasses}} {{{cssClasses}}}{{/if}}"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}>
+<div class="pi-item pi-data pi-item-spacing pi-border-color{{#if cssClasses}} {{{cssClasses}}}{{/if}}"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}{{#if source}} data-source="{{source}}"{{/if}}>
 	{{#if label}}
 		<{{#if useHeadings}}h3{{else}}div{{/if}} class="pi-data-label pi-secondary-font">{{{label}}}</{{#if useHeadings}}h3{{else}}div{{/if}}>
 	{{/if}}
diff --git a/templates/PortableInfoboxItemMedia.hbs b/templates/PortableInfoboxItemMedia.hbs
index b1b7474..9168687 100644
--- a/templates/PortableInfoboxItemMedia.hbs
+++ b/templates/PortableInfoboxItemMedia.hbs
@@ -1,4 +1,4 @@
-<figure class="pi-item pi-media{{#if isImage}} pi-image{{/if}}{{#if isVideo}} pi-video{{/if}}{{#if isAudio}} pi-audio{{/if}}">
+<figure class="pi-item pi-media{{#if isImage}} pi-image{{/if}}{{#if isVideo}} pi-video{{/if}}{{#if isAudio}} pi-audio{{/if}}"{{#if source}} data-source="{{source}}"{{/if}}>
 	<a href="{{url}}" class="{{#if isImage}}image image-thumbnail{{/if}}{{#if isVideo}}video{{/if}}{{#if isAudio}}audio{{/if}}" title="{{alt}}">
 		{{#if isImage}}<img src="{{thumbnail}}" srcset="{{thumbnail}} 1x, {{thumbnail2x}} 2x" class="pi-image-thumbnail" alt="{{alt}}" width="{{{width}}}" height="{{{height}}}"/>
 		{{else}}{{#if isVideo}}<video src="{{url}}" class="pi-video-player" controls="true" controlsList="nodownload" preload="metadata">{{alt}}</video>
diff --git a/templates/PortableInfoboxItemMediaCollection.hbs b/templates/PortableInfoboxItemMediaCollection.hbs
index f3192e3..61823e3 100644
--- a/templates/PortableInfoboxItemMediaCollection.hbs
+++ b/templates/PortableInfoboxItemMediaCollection.hbs
@@ -1,10 +1,10 @@
-<div class="pi-media-collection">
+<div class="pi-media-collection" {{#if source}} data-source="{{source}}"{{/if}}>
 	<ul class="pi-media-collection-tabs">
 		{{#each images}}<li class="pi-tab-link pi-item-spacing{{#if isFirst}} current{{/if}}" data-pi-tab="pi-tab-{{ref}}">{{{caption}}}</li>{{/each}}
 	</ul>
 	{{#each images}}
 		<div class="pi-media-collection-tab-content{{#if isFirst}} current{{/if}}" id="pi-tab-{{ref}}">
-			<figure class="pi-item pi-media{{#if isImage}} pi-image{{/if}}{{#if isVideo}} pi-video{{/if}}{{#if isAudio}} pi-audio{{/if}}">
+			<figure class="pi-item pi-media{{#if isImage}} pi-image{{/if}}{{#if isVideo}} pi-video{{/if}}{{#if isAudio}} pi-audio{{/if}}"{{#if source}} data-source="{{source}}"{{/if}}>
 				<a href="{{url}}" class="{{#if isImage}}image image-thumbnail{{/if}}{{#if isVideo}}video{{/if}}{{#if isAudio}}audio{{/if}}" title="{{alt}}">
 					{{#if isImage}}<img src="{{thumbnail}}" srcset="{{thumbnail}} 1x, {{thumbnail2x}} 2x" class="pi-image-thumbnail" alt="{{alt}}" width="{{{width}}}" height="{{{height}}}"/>
 					{{else}}{{#if isVideo}}<video src="{{url}}" class="pi-video-player" controls="true" controlsList="nodownload" preload="metadata">{{alt}}</video>
diff --git a/templates/PortableInfoboxItemSmartGroup.hbs b/templates/PortableInfoboxItemSmartGroup.hbs
index d28d39a..baeae72 100644
--- a/templates/PortableInfoboxItemSmartGroup.hbs
+++ b/templates/PortableInfoboxItemSmartGroup.hbs
@@ -1,14 +1,14 @@
 <section class="pi-item pi-smart-group pi-border-color">
     {{#if renderLabels}}
         <section class="pi-smart-group-head">
-            {{#each labels}}
-                <{{#if ../useHeadings}}h3{{else}}div{{/if}} class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="{{{inlineStyles}}}">{{{value}}}</{{#if ../useHeadings}}h3{{else}}div{{/if}}>
+            {{#each data}}
+                <{{#if ../useHeadings}}h3{{else}}div{{/if}} class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="{{{inlineStyles}}}"{{#if source}} data-source="{{source}}"{{/if}}>{{{label}}}</{{#if ../useHeadings}}h3{{else}}div{{/if}}>
             {{/each}}
         </section>
     {{/if}}
     <section class="pi-smart-group-body">
-        {{#each values}}
-            <div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="{{{inlineStyles}}}">{{{value}}}</div>
+        {{#each data}}
+            <div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="{{{inlineStyles}}}"{{#if source}} data-source="{{source}}"{{/if}}>{{{value}}}</div>
         {{/each}}
     </section>
 </section>
\ No newline at end of file
diff --git a/templates/PortableInfoboxItemTitle.hbs b/templates/PortableInfoboxItemTitle.hbs
index 8df25c8..1b8a38e 100644
--- a/templates/PortableInfoboxItemTitle.hbs
+++ b/templates/PortableInfoboxItemTitle.hbs
@@ -1 +1 @@
-<{{#if useHeadings}}h2{{else}}div{{/if}} class="pi-item pi-item-spacing pi-title"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}>{{{value}}}</{{#if useHeadings}}h2{{else}}div{{/if}}>
\ No newline at end of file
+<{{#if useHeadings}}h2{{else}}div{{/if}} class="pi-item pi-item-spacing pi-title"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}{{#if source}} data-source="{{source}}"{{/if}}>{{{value}}}</{{#if useHeadings}}h2{{else}}div{{/if}}>
\ No newline at end of file
diff --git a/tests/phpunit/PortableInfoboxDataServiceTest.php b/tests/phpunit/PortableInfoboxDataServiceTest.php
index bb32620..c8e94f8 100644
--- a/tests/phpunit/PortableInfoboxDataServiceTest.php
+++ b/tests/phpunit/PortableInfoboxDataServiceTest.php
@@ -65,7 +65,8 @@ class PortableInfoboxDataServiceTest extends MediaWikiTestCase {
 								'label' => null,
 								'value' => 1,
 								'layout' => null,
-								'span' => 1
+								'span' => 1,
+								'source' => 'test'
 							]
 						]
 					],
diff --git a/tests/phpunit/nodes/NodeDataTest.php b/tests/phpunit/nodes/NodeDataTest.php
index 11311c2..927cdb7 100644
--- a/tests/phpunit/nodes/NodeDataTest.php
+++ b/tests/phpunit/nodes/NodeDataTest.php
@@ -532,83 +532,90 @@ class NodeDataTest extends MediaWikiTestCase {
 			[
 				'<data source="test"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null ]
+				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
 			],
 			[
 				'<data source="test" span="2"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => '2', 'layout' => null ]
+				[ 'value' => 'test', 'label' => '', 'span' => '2', 'layout' => null, 'source' => 'test' ]
 			],
 			[
 				'<data source="test" span="2.2"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null ]
+				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
 			],
 			[
 				'<data source="test" span="non_numeric_span"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null ]
+				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
 			],
 			[
 				'<data source="test" layout="wrong layout"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null ]
+				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
 			],
 			[
 				'<data source="test" layout="default"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => 'default' ]
+				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => 'default', 'source' => 'test' ]
 			],
 			[
 				'<data source="test"><default>def</default></data>',
 				[],
-				[ 'value' => 'def', 'label' => '', 'span' => 1, 'layout' => null ]
+				[ 'value' => 'def', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
 			],
 			[
 				'<data source="test"><label>l</label><default>def</default></data>',
 				[],
-				[ 'value' => 'def', 'label' => 'l', 'span' => 1, 'layout' => null ] ],
+				[ 'value' => 'def', 'label' => 'l', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+			],
 			[
 				'<data source="test"><label source="l">jjj</label><default>def</default></data>',
 				[ 'l' => 1 ],
-				[ 'value' => 'def', 'label' => 'jjj', 'span' => 1, 'layout' => null ]
+				[ 'value' => 'def', 'label' => 'jjj', 'span' => 1, 'layout' => null, 'source' => 'test' ]
 			],
 			[
 				'<data source="test"><label source="l" /><default>def</default></data>',
 				[ 'l' => 1 ],
-				[ 'value' => 'def', 'label' => '', 'span' => 1, 'layout' => null ]
+				[ 'value' => 'def', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
 			],
 			[
 				'<data source="test"><label>l</label><default>def</default></data>',
 				[ 'test' => 1 ],
-				[ 'value' => 1, 'label' => 'l', 'span' => 1, 'layout' => null ]
+				[ 'value' => 1, 'label' => 'l', 'span' => 1, 'layout' => null , 'source' => 'test' ]
 			],
 			[
 				'<data></data>',
 				[],
-				[ 'label' => '', 'value' => null, 'span' => 1, 'layout' => null ]
+				[ 'label' => '', 'value' => null, 'span' => 1, 'layout' => null, 'source' => null ]
 			],
 			[
 				'<data source="test"><label>l</label><format>{{{test}}}%</format><default>def</default></data>',
-			 [ 'test' => 1 ],
-				[ 'value' => '{{{test}}}%', 'label' => 'l', 'span' => 1, 'layout' => null ]
+				[ 'test' => 1 ],
+				[ 'value' => '{{{test}}}%', 'label' => 'l', 'span' => 1, 'layout' => null, 'source' => 'test' ]
 			],
 			[
 				'<data source="test">' .
 				'<label>l</label><format>{{{not_defined_var}}}%</format><default>def</default>' .
 				'</data>',
 				[ 'test' => 1 ],
-				[ 'value' => '{{{not_defined_var}}}%', 'label' => 'l', 'span' => 1, 'layout' => null ]
+				[
+					'value' => '{{{not_defined_var}}}%',
+					'label' => 'l',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test'
+				]
 			],
 			[
 				'<data source="test"><label>l</label><format>{{{test}}}%</format><default>def</default></data>',
 				[],
-				[ 'value' => 'def', 'label' => 'l', 'span' => 1, 'layout' => null ]
+				[ 'value' => 'def', 'label' => 'l', 'span' => 1, 'layout' => null, 'source' => 'test' ]
 			],
 			[
 				'<data source="test"><format>{{{test}}}%</format></data>',
 				[ 'test' => 0 ],
-				[ 'value' => '{{{test}}}%', 'label' => '', 'span' => 1, 'layout' => null ]
+				[ 'value' => '{{{test}}}%', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
 			],
 		];
 	}
@@ -636,7 +643,13 @@ class NodeDataTest extends MediaWikiTestCase {
 				[ 'test' => 'test' ],
 				[
 					'type' => 'data',
-					'data' => [ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null ]
+					'data' => [
+						'value' => 'test',
+						'label' => '',
+						'span' => 1,
+						'layout' => null,
+						'source' => 'test'
+					]
 				]
 			],
 			[
@@ -644,7 +657,13 @@ class NodeDataTest extends MediaWikiTestCase {
 				[ 'test' => 'test' ],
 				[
 					'type' => 'data',
-					'data' => [ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => 'default' ]
+					'data' => [
+						'value' => 'test',
+						'label' => '',
+						'span' => 1,
+						'layout' => 'default',
+						'source' => 'test'
+					]
 				]
 			],
 			[
@@ -652,7 +671,13 @@ class NodeDataTest extends MediaWikiTestCase {
 				[ 'test' => 'test' ],
 				[
 					'type' => 'data',
-					'data' => [ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null ]
+					'data' => [
+						'value' => 'test',
+						'label' => '',
+						'span' => 1,
+						'layout' => null,
+						'source' => 'test'
+					]
 				]
 			],
 			[
@@ -660,7 +685,13 @@ class NodeDataTest extends MediaWikiTestCase {
 				[ 'test' => 'test' ],
 				[
 					'type' => 'data',
-					'data' => [ 'value' => 'test', 'label' => '', 'span' => '2', 'layout' => null ]
+					'data' => [
+						'value' => 'test',
+						'label' => '',
+						'span' => '2',
+						'layout' => null,
+						'source' => 'test'
+					]
 				]
 			],
 			[
@@ -668,7 +699,13 @@ class NodeDataTest extends MediaWikiTestCase {
 				[ 'test' => 'test' ],
 				[
 					'type' => 'data',
-					'data' => [ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null ]
+					'data' => [
+						'value' => 'test',
+						'label' => '',
+						'span' => 1,
+						'layout' => null,
+						'source' => 'test'
+					]
 				]
 			],
 			[
@@ -676,7 +713,13 @@ class NodeDataTest extends MediaWikiTestCase {
 				[ 'test' => 'test' ],
 				[
 					'type' => 'data',
-					'data' => [ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null ]
+					'data' => [
+						'value' => 'test',
+						'label' => '',
+						'span' => 1,
+						'layout' => null,
+						'source' => 'test'
+					]
 				]
 			],
 		];
diff --git a/tests/phpunit/nodes/NodeGroupTest.php b/tests/phpunit/nodes/NodeGroupTest.php
index 8a75721..808c039 100644
--- a/tests/phpunit/nodes/NodeGroupTest.php
+++ b/tests/phpunit/nodes/NodeGroupTest.php
@@ -78,19 +78,37 @@ class NodeGroupTest extends MediaWikiTestCase {
 						[
 							'type' => 'data',
 							'isEmpty' => false,
-							'data' => [ 'label' => 'l1', 'value' => 1, 'span' => 1, 'layout' => null ],
+							'data' => [
+								'label' => 'l1',
+								'value' => 1,
+								'span' => 1,
+								'layout' => null,
+								'source' => 'elem1'
+							],
 							'source' => [ 'elem1' ]
 						],
 						[
 							'type' => 'data',
 							'isEmpty' => false,
-							'data' => [ 'label' => 'l2', 'value' => 2, 'span' => 1, 'layout' => null ],
+							'data' => [
+								'label' => 'l2',
+								'value' => 2,
+								'span' => 1,
+								'layout' => null,
+								'source' => 'elem2'
+							],
 							'source' => [ 'elem2' ]
 						],
 						[
 							'type' => 'data',
 							'isEmpty' => true,
-							'data' => [ 'label' => 'l2', 'value' => null, 'span' => 1, 'layout' => null ],
+							'data' => [
+								'label' => 'l2',
+								'value' => null,
+								'span' => 1,
+								'layout' => null,
+								'source' => 'elem3'
+							],
 							'source' => [ 'elem3' ]
 						]
 					],
@@ -111,19 +129,37 @@ class NodeGroupTest extends MediaWikiTestCase {
 						[
 							'type' => 'data',
 							'isEmpty' => false,
-							'data' => [ 'label' => 'l1', 'value' => 1, 'span' => 1, 'layout' => null ],
+							'data' => [
+								'label' => 'l1',
+								'value' => 1,
+								'span' => 1,
+								'layout' => null,
+								'source' => 'elem1'
+							],
 							'source' => [ 'elem1' ]
 						],
 						[
 							'type' => 'data',
 							'isEmpty' => false,
-							'data' => [ 'label' => 'l2', 'value' => 2, 'span' => 1, 'layout' => null ],
+							'data' => [
+								'label' => 'l2',
+								'value' => 2,
+								'span' => 1,
+								'layout' => null,
+								'source' => 'elem2'
+							],
 							'source' => [ 'elem2' ]
 						],
 						[
 							'type' => 'data',
 							'isEmpty' => true,
-							'data' => [ 'label' => 'l2', 'value' => null, 'span' => 1, 'layout' => null ],
+							'data' => [
+								'label' => 'l2',
+								'value' => null,
+								'span' => 1,
+								'layout' => null,
+								'source' => 'elem3'
+							],
 							'source' => [ 'elem3' ]
 						],
 					],
@@ -144,19 +180,37 @@ class NodeGroupTest extends MediaWikiTestCase {
 						[
 							'type' => 'data',
 							'isEmpty' => false,
-							'data' => [ 'label' => 'l1', 'value' => 1, 'span' => 1, 'layout' => null ],
-							 'source' => [ 'elem1' ]
+							'data' => [
+								'label' => 'l1',
+								'value' => 1,
+								'span' => 1,
+								'layout' => null,
+								'source' => 'elem1'
+							],
+							'source' => [ 'elem1' ]
 						],
 						[
 							'type' => 'data',
 							'isEmpty' => false,
-							'data' => [ 'label' => 'l2', 'value' => 2, 'span' => 1, 'layout' => null ],
-							 'source' => [ 'elem2' ]
+							'data' => [
+								'label' => 'l2',
+								'value' => 2,
+								'span' => 1,
+								'layout' => null,
+								'source' => 'elem2'
+							],
+							'source' => [ 'elem2' ]
 						],
 						[
 							'type' => 'data',
 							'isEmpty' => true,
-							'data' => [ 'label' => 'l2', 'value' => null, 'span' => 1, 'layout' => null ],
+							'data' => [
+								'label' => 'l2',
+								'value' => null,
+								'span' => 1,
+								'layout' => null,
+								'source' => 'elem3'
+							],
 							'source' => [ 'elem3' ]
 						]
 					],
@@ -172,19 +226,33 @@ class NodeGroupTest extends MediaWikiTestCase {
 					'value' => [
 						[
 							'type' => 'header',
-							'data' => [ 'value' => 'h' ],
+							'data' => [
+								'value' => 'h'
+							],
 							'isEmpty' => false,
 							'source' => []
 						],
 						[
 							'type' => 'data',
-							'data' => [ 'value' => 'one', 'label' => '', 'span' => 1, 'layout' => null ],
+							'data' => [
+								'value' => 'one',
+								'label' => '',
+								'span' => 1,
+								'layout' => null,
+								'source' => '1'
+							],
 							'isEmpty' => false,
 							'source' => [ '1' ]
 						],
 						[
 							'type' => 'data',
-							'data' => [ 'value' => 'two', 'label' => '', 'span' => 1, 'layout' => null ],
+							'data' => [
+								'value' => 'two',
+								'label' => '',
+								'span' => 1,
+								'layout' => null,
+								'source' => '2'
+							],
 							'isEmpty' => false,
 							'source' => [ '2' ]
 						]
@@ -207,13 +275,25 @@ class NodeGroupTest extends MediaWikiTestCase {
 						],
 						[
 							'type' => 'data',
-							'data' => [ 'value' => 'one', 'label' => '', 'span' => 1, 'layout' => null ],
+							'data' => [
+								'value' => 'one',
+								'label' => '',
+								'span' => 1,
+								'layout' => null,
+								'source' => '1'
+							],
 							'isEmpty' => false,
 							'source' => [ '1' ]
 						],
 						[
 							'type' => 'data',
-							'data' => [ 'value' => null, 'label' => '', 'span' => 1, 'layout' => null ],
+							'data' => [
+								'value' => null,
+								'label' => '',
+								'span' => 1,
+								'layout' => null,
+								'source' => '2'
+							],
 							'isEmpty' => true,
 							'source' => [ '2' ]
 						]
@@ -236,13 +316,25 @@ class NodeGroupTest extends MediaWikiTestCase {
 						],
 						[
 							'type' => 'data',
-							'data' => [ 'value' => null, 'label' => '', 'span' => 1, 'layout' => null ],
+							'data' => [
+								'value' => null,
+								'label' => '',
+								'span' => 1,
+								'layout' => null,
+								'source' => '1'
+							],
 							'isEmpty' => true,
 							'source' => [ '1' ]
 						],
 						[
 							'type' => 'data',
-							'data' => [ 'value' => null, 'label' => '', 'span' => 1, 'layout' => null ],
+							'data' => [
+								'value' => null,
+								'label' => '',
+								'span' => 1,
+								'layout' => null,
+								'source' => '2'
+							],
 							'isEmpty' => true,
 							'source' => [ '2' ]
 						]
diff --git a/tests/phpunit/nodes/NodeMediaTest.php b/tests/phpunit/nodes/NodeMediaTest.php
index a94ed28..1569cd0 100644
--- a/tests/phpunit/nodes/NodeMediaTest.php
+++ b/tests/phpunit/nodes/NodeMediaTest.php
@@ -179,7 +179,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'caption' => null,
 					'isImage' => true,
 					'isVideo' => false,
-					'isAudio' => false
+					'isAudio' => false,
+					'source' => 'img'
 				] ]
 			],
 			[
@@ -193,7 +194,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'caption' => null,
 					'isImage' => true,
 					'isVideo' => false,
-					'isAudio' => false
+					'isAudio' => false,
+					'source' => 'img'
 				] ]
 			],
 			[
@@ -207,7 +209,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'caption' => null,
 					'isImage' => true,
 					'isVideo' => false,
-					'isAudio' => false
+					'isAudio' => false,
+					'source' => 'img'
 				] ]
 			],
 			[
@@ -221,7 +224,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'caption' => 'test.jpg',
 					'isImage' => true,
 					'isVideo' => false,
-					'isAudio' => false
+					'isAudio' => false,
+					'source' => 'img'
 				] ]
 			],
 			[
@@ -235,7 +239,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'caption' => null,
 					'isImage' => false,
 					'isVideo' => true,
-					'isAudio' => false
+					'isAudio' => false,
+					'source' => 'media'
 				] ]
 			],
 			[
@@ -255,7 +260,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'caption' => null,
 					'isImage' => false,
 					'isVideo' => false,
-					'isAudio' => true
+					'isAudio' => true,
+					'source' => 'media'
 				] ]
 			],
 			[
diff --git a/tests/phpunit/nodes/NodeTitleTest.php b/tests/phpunit/nodes/NodeTitleTest.php
index 89c15f9..9e32204 100644
--- a/tests/phpunit/nodes/NodeTitleTest.php
+++ b/tests/phpunit/nodes/NodeTitleTest.php
@@ -24,57 +24,57 @@ class NodeTitleTest extends MediaWikiTestCase {
 			[
 				'<title source="test"/>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test' ]
+				[ 'value' => 'test', 'source' => 'test' ]
 			],
 			[
 				'<title source="test"><default>def</default></title>',
 				[],
-				[ 'value' => 'def' ]
+				[ 'value' => 'def', 'source' => 'test' ]
 			],
 			[
 				'<title source="test"><default>def</default></title>',
 				[],
-				[ 'value' => 'def' ]
+				[ 'value' => 'def', 'source' => 'test' ]
 			],
 			[
 				'<title source="test"><default>def</default></title>',
 				[ 'l' => 1 ],
-				[ 'value' => 'def' ]
+				[ 'value' => 'def', 'source' => 'test' ]
 			],
 			[
 				'<title source="test"><default>def</default></title>',
 				[ 'l' => 1 ],
-				[ 'value' => 'def' ]
+				[ 'value' => 'def', 'source' => 'test' ]
 			],
 			[
 				'<title source="test"><default>def</default></title>',
 				[ 'test' => 1 ],
-				[ 'value' => 1 ]
+				[ 'value' => 1, 'source' => 'test' ]
 			],
 			[
 				'<title></title>',
 				[],
-				[ 'value' => null ]
+				[ 'value' => null, 'source' => null ]
 			],
 			[
 				'<title source="test"><format>{{{test}}}%</format><default>def</default></title>',
 				[ 'test' => 1 ],
-				[ 'value' => '{{{test}}}%' ]
+				[ 'value' => '{{{test}}}%', 'source' => 'test' ]
 			],
 			[
 				'<title source="test"><format>{{{not_defined_var}}}%</format><default>def</default></title>',
 				[ 'test' => 1 ],
-				[ 'value' => '{{{not_defined_var}}}%' ]
+				[ 'value' => '{{{not_defined_var}}}%', 'source' => 'test' ]
 			],
 			[
 				'<title source="test"><format>{{{test}}}%</format><default>def</default></title>',
 				[],
-				[ 'value' => 'def' ]
+				[ 'value' => 'def', 'source' => 'test' ]
 			],
 			[
 				'<title source="test"><format>{{{test}}}%</format></title>',
 				[ 'test' => 0 ],
-				[ 'value' => '{{{test}}}%' ]
+				[ 'value' => '{{{test}}}%', 'source' => 'test' ]
 			]
 		];
 	}

From e84e5c1e6cb74b66dc2770b85b97a8fba952a66f Mon Sep 17 00:00:00 2001
From: lkucharczyk <14111811+lkucharczyk@users.noreply.github.com>
Date: Sat, 2 Feb 2019 23:34:48 +0100
Subject: [PATCH 3/5] Add support for name attribute

---
 .../PortableInfoboxParserTagController.php    |   7 +-
 .../Helpers/InfoboxParamsValidator.php        |   3 +-
 includes/services/Parser/Nodes/Node.php       |  12 +-
 includes/services/Parser/Nodes/NodeData.php   |   3 +-
 includes/services/Parser/Nodes/NodeGroup.php  |   6 +-
 includes/services/Parser/Nodes/NodeHeader.php |   5 +-
 includes/services/Parser/Nodes/NodeMedia.php  |   3 +-
 .../services/Parser/Nodes/NodeNavigation.php  |   5 +-
 includes/services/Parser/Nodes/NodeTitle.php  |   3 +-
 .../services/PortableInfoboxRenderService.php |  15 +-
 .../PortableInfoboxHorizontalGroupContent.hbs |   6 +-
 templates/PortableInfoboxItemData.hbs         |   2 +-
 templates/PortableInfoboxItemGroup.hbs        |   2 +-
 templates/PortableInfoboxItemHeader.hbs       |   2 +-
 templates/PortableInfoboxItemMedia.hbs        |   2 +-
 .../PortableInfoboxItemMediaCollection.hbs    |   4 +-
 templates/PortableInfoboxItemNavigation.hbs   |   2 +-
 templates/PortableInfoboxItemSmartGroup.hbs   |   4 +-
 templates/PortableInfoboxItemTitle.hbs        |   2 +-
 templates/PortableInfoboxWrapper.hbs          |   2 +-
 .../PortableInfoboxDataServiceTest.php        |   3 +-
 .../PortableInfoboxRenderServiceTest.php      | 330 ++++++++++++------
 tests/phpunit/nodes/NodeDataTest.php          | 156 +++++++--
 tests/phpunit/nodes/NodeGroupTest.php         |  73 ++--
 tests/phpunit/nodes/NodeHeaderTest.php        |   6 +-
 tests/phpunit/nodes/NodeMediaTest.php         |  18 +-
 tests/phpunit/nodes/NodeNavigationTest.php    |   6 +-
 tests/phpunit/nodes/NodeTitleTest.php         |  22 +-
 28 files changed, 495 insertions(+), 209 deletions(-)

diff --git a/includes/controllers/PortableInfoboxParserTagController.php b/includes/controllers/PortableInfoboxParserTagController.php
index 309df08..48aba28 100644
--- a/includes/controllers/PortableInfoboxParserTagController.php
+++ b/includes/controllers/PortableInfoboxParserTagController.php
@@ -66,10 +66,11 @@ class PortableInfoboxParserTagController {
 		$accentColor = $this->getColor( self::ACCENT_COLOR, $params, $frame );
 		$accentColorText = $this->getColor( self::ACCENT_COLOR_TEXT, $params, $frame );
 		$type = $this->getType( $params );
+		$itemName = $this->getItemName( $params );
 
 		$renderService = new PortableInfoboxRenderService();
 		return $renderService->renderInfobox(
-			$data, implode( ' ', $themeList ), $layout, $accentColor, $accentColorText, $type
+			$data, implode( ' ', $themeList ), $layout, $accentColor, $accentColorText, $type, $itemName
 		);
 	}
 
@@ -243,6 +244,10 @@ class PortableInfoboxParserTagController {
 			) : '';
 	}
 
+	private function getItemName( $params ) {
+		return !empty( $params['name'] ) ? Sanitizer::encodeAttribute( $params['name'] ) : '';
+	}
+
 	private function sanitizeColor( $color ) {
 		return $this->getParamsValidator()->validateColorValue( $color );
 	}
diff --git a/includes/services/Helpers/InfoboxParamsValidator.php b/includes/services/Helpers/InfoboxParamsValidator.php
index 4c1e34f..345c418 100644
--- a/includes/services/Helpers/InfoboxParamsValidator.php
+++ b/includes/services/Helpers/InfoboxParamsValidator.php
@@ -10,7 +10,8 @@ class InfoboxParamsValidator {
 		'layout',
 		'theme',
 		'theme-source',
-		'type'
+		'type',
+		'name'
 	];
 
 	private static $supportedLayouts = [
diff --git a/includes/services/Parser/Nodes/Node.php b/includes/services/Parser/Nodes/Node.php
index 65f13f3..5869129 100644
--- a/includes/services/Parser/Nodes/Node.php
+++ b/includes/services/Parser/Nodes/Node.php
@@ -7,6 +7,7 @@ use PortableInfobox\Parser\SimpleParser;
 class Node {
 
 	const DATA_SRC_ATTR_NAME = 'source';
+	const NAME_ATTR_NAME = 'name';
 	const DEFAULT_TAG_NAME = 'default';
 	const FORMAT_TAG_NAME = 'format';
 	const LABEL_TAG_NAME = 'label';
@@ -112,7 +113,8 @@ class Node {
 		if ( !isset( $this->data ) ) {
 			$this->data = [
 				'value' => (string)$this->xmlNode,
-				'source' => $this->getXmlAttribute( $this->xmlNode, self::DATA_SRC_ATTR_NAME )
+				'source' => $this->getPrimarySource(),
+				'item-name' => $this->getItemName()
 			];
 		}
 
@@ -280,4 +282,12 @@ class Node {
 
 		return array_unique( array_merge( $source, $sources[1] ) );
 	}
+
+	protected function getPrimarySource() {
+		return $this->getXmlAttribute( $this->xmlNode, self::DATA_SRC_ATTR_NAME );
+	}
+
+	protected function getItemName() {
+		return $this->getXmlAttribute( $this->xmlNode, self::NAME_ATTR_NAME );
+	}
 }
diff --git a/includes/services/Parser/Nodes/NodeData.php b/includes/services/Parser/Nodes/NodeData.php
index 989462e..faae99e 100644
--- a/includes/services/Parser/Nodes/NodeData.php
+++ b/includes/services/Parser/Nodes/NodeData.php
@@ -15,7 +15,8 @@ class NodeData extends Node {
 				'value' => $this->getValueWithDefault( $this->xmlNode ),
 				'span' => $this->getSpan(),
 				'layout' => $this->getLayout(),
-				'source' => $this->getXmlAttribute( $this->xmlNode, self::DATA_SRC_ATTR_NAME )
+				'source' => $this->getPrimarySource(),
+				'item-name' => $this->getItemName()
 			];
 		}
 
diff --git a/includes/services/Parser/Nodes/NodeGroup.php b/includes/services/Parser/Nodes/NodeGroup.php
index 41545b5..0939526 100644
--- a/includes/services/Parser/Nodes/NodeGroup.php
+++ b/includes/services/Parser/Nodes/NodeGroup.php
@@ -34,7 +34,8 @@ class NodeGroup extends Node {
 				'value' => $this->getDataForChildren(),
 				'layout' => $this->getLayout(),
 				'collapse' => $this->getCollapse(),
-				'row-items' => $this->getRowItems()
+				'row-items' => $this->getRowItems(),
+				'item-name' => $this->getItemName()
 			];
 		}
 
@@ -57,7 +58,8 @@ class NodeGroup extends Node {
 				'value' => $value,
 				'layout' => $this->getLayout(),
 				'collapse' => $this->getCollapse(),
-				'row-items' => $this->getRowItems()
+				'row-items' => $this->getRowItems(),
+				'item-name' => $this->getItemName()
 			],
 		];
 	}
diff --git a/includes/services/Parser/Nodes/NodeHeader.php b/includes/services/Parser/Nodes/NodeHeader.php
index 3b284c8..8a50184 100644
--- a/includes/services/Parser/Nodes/NodeHeader.php
+++ b/includes/services/Parser/Nodes/NodeHeader.php
@@ -5,7 +5,10 @@ class NodeHeader extends Node {
 
 	public function getData() {
 		if ( !isset( $this->data ) ) {
-			$this->data = [ 'value' => $this->getInnerValue( $this->xmlNode ) ];
+			$this->data = [
+				'value' => $this->getInnerValue( $this->xmlNode ),
+				'item-name' => $this->getItemName()
+			];
 		}
 
 		return $this->data;
diff --git a/includes/services/Parser/Nodes/NodeMedia.php b/includes/services/Parser/Nodes/NodeMedia.php
index 0c67812..31d79c8 100644
--- a/includes/services/Parser/Nodes/NodeMedia.php
+++ b/includes/services/Parser/Nodes/NodeMedia.php
@@ -155,7 +155,8 @@ class NodeMedia extends Node {
 			'isImage' => in_array( $mediatype, [ MEDIATYPE_BITMAP, MEDIATYPE_DRAWING ] ),
 			'isVideo' => $mediatype === MEDIATYPE_VIDEO,
 			'isAudio' => $mediatype === MEDIATYPE_AUDIO,
-			'source' => $this->getXmlAttribute( $this->xmlNode, self::DATA_SRC_ATTR_NAME )
+			'source' => $this->getPrimarySource(),
+			'item-name' => $this->getItemName()
 		];
 
 		if ( $image['isImage'] ) {
diff --git a/includes/services/Parser/Nodes/NodeNavigation.php b/includes/services/Parser/Nodes/NodeNavigation.php
index 357c8e4..e155362 100644
--- a/includes/services/Parser/Nodes/NodeNavigation.php
+++ b/includes/services/Parser/Nodes/NodeNavigation.php
@@ -5,7 +5,10 @@ class NodeNavigation extends Node {
 
 	public function getData() {
 		if ( !isset( $this->data ) ) {
-			$this->data = [ 'value' => $this->getInnerValue( $this->xmlNode ) ];
+			$this->data = [
+				'value' => $this->getInnerValue( $this->xmlNode ),
+				'item-name' => $this->getItemName()
+			];
 		}
 
 		return $this->data;
diff --git a/includes/services/Parser/Nodes/NodeTitle.php b/includes/services/Parser/Nodes/NodeTitle.php
index 8ad8633..20ddb7f 100644
--- a/includes/services/Parser/Nodes/NodeTitle.php
+++ b/includes/services/Parser/Nodes/NodeTitle.php
@@ -7,7 +7,8 @@ class NodeTitle extends Node {
 			$title = $this->getValueWithDefault( $this->xmlNode );
 			$this->data = [
 				'value' => $title,
-				'source' => $this->getXmlAttribute( $this->xmlNode, self::DATA_SRC_ATTR_NAME )
+				'source' => $this->getXmlAttribute( $this->xmlNode, self::DATA_SRC_ATTR_NAME ),
+				'item-name' => $this->getItemName()
 			];
 		}
 
diff --git a/includes/services/PortableInfoboxRenderService.php b/includes/services/PortableInfoboxRenderService.php
index 175be40..8217afe 100644
--- a/includes/services/PortableInfoboxRenderService.php
+++ b/includes/services/PortableInfoboxRenderService.php
@@ -24,10 +24,11 @@ class PortableInfoboxRenderService {
 	 * @param string $accentColor
 	 * @param string $accentColorText
 	 * @param string $type
+	 * @param string $itemName
 	 * @return string - infobox HTML
 	 */
 	public function renderInfobox(
-		array $infoboxdata, $theme, $layout, $accentColor, $accentColorText, $type
+		array $infoboxdata, $theme, $layout, $accentColor, $accentColorText, $type, $itemName
 	) {
 		$this->inlineStyles = $this->getInlineStyles( $accentColor, $accentColorText );
 
@@ -38,7 +39,8 @@ class PortableInfoboxRenderService {
 				'content' => $infoboxHtmlContent,
 				'theme' => $theme,
 				'layout' => $layout,
-				'type' => $type
+				'type' => $type,
+				'item-name' => $itemName
 			] );
 		} else {
 			$output = '';
@@ -122,7 +124,8 @@ class PortableInfoboxRenderService {
 
 		return $this->render( 'group', [
 			'content' => $groupHTMLContent,
-			'cssClasses' => implode( ' ', $cssClasses )
+			'cssClasses' => implode( ' ', $cssClasses ),
+			'item-name' => $groupData['item-name']
 		] );
 	}
 
@@ -193,7 +196,8 @@ class PortableInfoboxRenderService {
 				$horizontalGroupData['data'][] = [
 					'label' => $data['label'],
 					'value' => $data['value'],
-					'source' => $item['data']['source'] ?? ""
+					'source' => $item['data']['source'] ?? "",
+					'item-name' => $item['data']['item-name']
 				];
 
 				if ( !empty( $data['label'] ) ) {
@@ -262,7 +266,8 @@ class PortableInfoboxRenderService {
 				'label' => $label,
 				'value' => $item['data']['value'],
 				'inlineStyles' => $styles,
-				'source' => $item['data']['source'] ?? ""
+				'source' => $item['data']['source'] ?? "",
+				'item-name' => $item['data']['item-name']
 			];
 
 			return $result;
diff --git a/templates/PortableInfoboxHorizontalGroupContent.hbs b/templates/PortableInfoboxHorizontalGroupContent.hbs
index 55bb355..0c14e99 100644
--- a/templates/PortableInfoboxHorizontalGroupContent.hbs
+++ b/templates/PortableInfoboxHorizontalGroupContent.hbs
@@ -1,10 +1,10 @@
-<table class="pi-horizontal-group{{#unless renderLabels}} pi-horizontal-group-no-labels{{/unless}}">
+<table class="pi-horizontal-group{{#unless renderLabels}} pi-horizontal-group-no-labels{{/unless}}"{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>
 	{{#if header}}<caption class="pi-header pi-secondary-font pi-secondary-background pi-item-spacing"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}>{{{header}}}</caption>{{/if}}
 	{{#if renderLabels}}
 	<thead>
 		<tr>
 		{{#each data}}
-			<th class="pi-horizontal-group-item pi-data-label pi-secondary-font pi-border-color pi-item-spacing"{{#if source}} data-source="{{source}}"{{/if}}>{{{label}}}</th>
+			<th class="pi-horizontal-group-item pi-data-label pi-secondary-font pi-border-color pi-item-spacing"{{#if source}} data-source="{{source}}"{{/if}}{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>{{{label}}}</th>
 		{{/each}}
 		</tr>
 	</thead>
@@ -12,7 +12,7 @@
 	<tbody>
 		<tr>
 		{{#each data}}
-			<td class="pi-horizontal-group-item pi-data-value pi-font pi-border-color pi-item-spacing"{{#if source}} data-source="{{source}}"{{/if}}>{{{value}}}</td>
+			<td class="pi-horizontal-group-item pi-data-value pi-font pi-border-color pi-item-spacing"{{#if source}} data-source="{{source}}"{{/if}}{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>{{{value}}}</td>
 		{{/each}}
 		</tr>
 	</tbody>
diff --git a/templates/PortableInfoboxItemData.hbs b/templates/PortableInfoboxItemData.hbs
index 5deabb7..8cbed34 100644
--- a/templates/PortableInfoboxItemData.hbs
+++ b/templates/PortableInfoboxItemData.hbs
@@ -1,4 +1,4 @@
-<div class="pi-item pi-data pi-item-spacing pi-border-color{{#if cssClasses}} {{{cssClasses}}}{{/if}}"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}{{#if source}} data-source="{{source}}"{{/if}}>
+<div class="pi-item pi-data pi-item-spacing pi-border-color{{#if cssClasses}} {{{cssClasses}}}{{/if}}"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}{{#if source}} data-source="{{source}}"{{/if}}{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>
 	{{#if label}}
 		<{{#if useHeadings}}h3{{else}}div{{/if}} class="pi-data-label pi-secondary-font">{{{label}}}</{{#if useHeadings}}h3{{else}}div{{/if}}>
 	{{/if}}
diff --git a/templates/PortableInfoboxItemGroup.hbs b/templates/PortableInfoboxItemGroup.hbs
index 3da3b12..0c91372 100644
--- a/templates/PortableInfoboxItemGroup.hbs
+++ b/templates/PortableInfoboxItemGroup.hbs
@@ -1 +1 @@
-<section class="pi-item pi-group pi-border-color{{#if cssClasses}} {{{cssClasses}}}{{/if}}">{{{content}}}</section>
\ No newline at end of file
+<section class="pi-item pi-group pi-border-color{{#if cssClasses}} {{{cssClasses}}}{{/if}}"{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>{{{content}}}</section>
\ No newline at end of file
diff --git a/templates/PortableInfoboxItemHeader.hbs b/templates/PortableInfoboxItemHeader.hbs
index 1b6cb70..52e1507 100644
--- a/templates/PortableInfoboxItemHeader.hbs
+++ b/templates/PortableInfoboxItemHeader.hbs
@@ -1 +1 @@
-<{{#if useHeadings}}h2{{else}}div{{/if}} class="pi-item pi-header pi-secondary-font pi-item-spacing pi-secondary-background"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}>{{{value}}}</{{#if useHeadings}}h2{{else}}div{{/if}}>
\ No newline at end of file
+<{{#if useHeadings}}h2{{else}}div{{/if}} class="pi-item pi-header pi-secondary-font pi-item-spacing pi-secondary-background"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>{{{value}}}</{{#if useHeadings}}h2{{else}}div{{/if}}>
\ No newline at end of file
diff --git a/templates/PortableInfoboxItemMedia.hbs b/templates/PortableInfoboxItemMedia.hbs
index 9168687..aa08cde 100644
--- a/templates/PortableInfoboxItemMedia.hbs
+++ b/templates/PortableInfoboxItemMedia.hbs
@@ -1,4 +1,4 @@
-<figure class="pi-item pi-media{{#if isImage}} pi-image{{/if}}{{#if isVideo}} pi-video{{/if}}{{#if isAudio}} pi-audio{{/if}}"{{#if source}} data-source="{{source}}"{{/if}}>
+<figure class="pi-item pi-media{{#if isImage}} pi-image{{/if}}{{#if isVideo}} pi-video{{/if}}{{#if isAudio}} pi-audio{{/if}}"{{#if source}} data-source="{{source}}"{{/if}}{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>
 	<a href="{{url}}" class="{{#if isImage}}image image-thumbnail{{/if}}{{#if isVideo}}video{{/if}}{{#if isAudio}}audio{{/if}}" title="{{alt}}">
 		{{#if isImage}}<img src="{{thumbnail}}" srcset="{{thumbnail}} 1x, {{thumbnail2x}} 2x" class="pi-image-thumbnail" alt="{{alt}}" width="{{{width}}}" height="{{{height}}}"/>
 		{{else}}{{#if isVideo}}<video src="{{url}}" class="pi-video-player" controls="true" controlsList="nodownload" preload="metadata">{{alt}}</video>
diff --git a/templates/PortableInfoboxItemMediaCollection.hbs b/templates/PortableInfoboxItemMediaCollection.hbs
index 61823e3..e638c57 100644
--- a/templates/PortableInfoboxItemMediaCollection.hbs
+++ b/templates/PortableInfoboxItemMediaCollection.hbs
@@ -1,10 +1,10 @@
-<div class="pi-media-collection" {{#if source}} data-source="{{source}}"{{/if}}>
+<div class="pi-media-collection" {{#if source}} data-source="{{source}}"{{/if}}{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>
 	<ul class="pi-media-collection-tabs">
 		{{#each images}}<li class="pi-tab-link pi-item-spacing{{#if isFirst}} current{{/if}}" data-pi-tab="pi-tab-{{ref}}">{{{caption}}}</li>{{/each}}
 	</ul>
 	{{#each images}}
 		<div class="pi-media-collection-tab-content{{#if isFirst}} current{{/if}}" id="pi-tab-{{ref}}">
-			<figure class="pi-item pi-media{{#if isImage}} pi-image{{/if}}{{#if isVideo}} pi-video{{/if}}{{#if isAudio}} pi-audio{{/if}}"{{#if source}} data-source="{{source}}"{{/if}}>
+			<figure class="pi-item pi-media{{#if isImage}} pi-image{{/if}}{{#if isVideo}} pi-video{{/if}}{{#if isAudio}} pi-audio{{/if}}"{{#if source}} data-source="{{source}}"{{/if}}{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>
 				<a href="{{url}}" class="{{#if isImage}}image image-thumbnail{{/if}}{{#if isVideo}}video{{/if}}{{#if isAudio}}audio{{/if}}" title="{{alt}}">
 					{{#if isImage}}<img src="{{thumbnail}}" srcset="{{thumbnail}} 1x, {{thumbnail2x}} 2x" class="pi-image-thumbnail" alt="{{alt}}" width="{{{width}}}" height="{{{height}}}"/>
 					{{else}}{{#if isVideo}}<video src="{{url}}" class="pi-video-player" controls="true" controlsList="nodownload" preload="metadata">{{alt}}</video>
diff --git a/templates/PortableInfoboxItemNavigation.hbs b/templates/PortableInfoboxItemNavigation.hbs
index c166868..0f4286a 100644
--- a/templates/PortableInfoboxItemNavigation.hbs
+++ b/templates/PortableInfoboxItemNavigation.hbs
@@ -1 +1 @@
-<nav class="pi-navigation pi-item-spacing pi-secondary-background pi-secondary-font">{{{value}}}</nav>
\ No newline at end of file
+<nav class="pi-navigation pi-item-spacing pi-secondary-background pi-secondary-font"{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>{{{value}}}</nav>
\ No newline at end of file
diff --git a/templates/PortableInfoboxItemSmartGroup.hbs b/templates/PortableInfoboxItemSmartGroup.hbs
index baeae72..ce151dd 100644
--- a/templates/PortableInfoboxItemSmartGroup.hbs
+++ b/templates/PortableInfoboxItemSmartGroup.hbs
@@ -2,13 +2,13 @@
     {{#if renderLabels}}
         <section class="pi-smart-group-head">
             {{#each data}}
-                <{{#if ../useHeadings}}h3{{else}}div{{/if}} class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="{{{inlineStyles}}}"{{#if source}} data-source="{{source}}"{{/if}}>{{{label}}}</{{#if ../useHeadings}}h3{{else}}div{{/if}}>
+                <{{#if ../useHeadings}}h3{{else}}div{{/if}} class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="{{{inlineStyles}}}"{{#if source}} data-source="{{source}}"{{/if}}{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>{{{label}}}</{{#if ../useHeadings}}h3{{else}}div{{/if}}>
             {{/each}}
         </section>
     {{/if}}
     <section class="pi-smart-group-body">
         {{#each data}}
-            <div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="{{{inlineStyles}}}"{{#if source}} data-source="{{source}}"{{/if}}>{{{value}}}</div>
+            <div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="{{{inlineStyles}}}"{{#if source}} data-source="{{source}}"{{/if}}{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>{{{value}}}</div>
         {{/each}}
     </section>
 </section>
\ No newline at end of file
diff --git a/templates/PortableInfoboxItemTitle.hbs b/templates/PortableInfoboxItemTitle.hbs
index 1b8a38e..8beedbd 100644
--- a/templates/PortableInfoboxItemTitle.hbs
+++ b/templates/PortableInfoboxItemTitle.hbs
@@ -1 +1 @@
-<{{#if useHeadings}}h2{{else}}div{{/if}} class="pi-item pi-item-spacing pi-title"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}{{#if source}} data-source="{{source}}"{{/if}}>{{{value}}}</{{#if useHeadings}}h2{{else}}div{{/if}}>
\ No newline at end of file
+<{{#if useHeadings}}h2{{else}}div{{/if}} class="pi-item pi-item-spacing pi-title"{{#if inlineStyles}} style="{{inlineStyles}}"{{/if}}{{#if source}} data-source="{{source}}"{{/if}}{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>{{{value}}}</{{#if useHeadings}}h2{{else}}div{{/if}}>
\ No newline at end of file
diff --git a/templates/PortableInfoboxWrapper.hbs b/templates/PortableInfoboxWrapper.hbs
index b872804..5728198 100644
--- a/templates/PortableInfoboxWrapper.hbs
+++ b/templates/PortableInfoboxWrapper.hbs
@@ -1 +1 @@
-<aside class="portable-infobox pi-background{{#if theme}} {{theme}}{{/if}}{{#if layout}} {{layout}}{{/if}}{{#if type}} {{type}}{{/if}}">{{{content}}}</aside>
\ No newline at end of file
+<aside class="portable-infobox pi-background{{#if theme}} {{theme}}{{/if}}{{#if layout}} {{layout}}{{/if}}{{#if type}} {{type}}{{/if}}"{{#if item-name}} data-item-name="{{item-name}}"{{/if}}>{{{content}}}</aside>
\ No newline at end of file
diff --git a/tests/phpunit/PortableInfoboxDataServiceTest.php b/tests/phpunit/PortableInfoboxDataServiceTest.php
index c8e94f8..19ff51f 100644
--- a/tests/phpunit/PortableInfoboxDataServiceTest.php
+++ b/tests/phpunit/PortableInfoboxDataServiceTest.php
@@ -66,7 +66,8 @@ class PortableInfoboxDataServiceTest extends MediaWikiTestCase {
 								'value' => 1,
 								'layout' => null,
 								'span' => 1,
-								'source' => 'test'
+								'source' => 'test',
+								'item-name' => null
 							]
 						]
 					],
diff --git a/tests/phpunit/PortableInfoboxRenderServiceTest.php b/tests/phpunit/PortableInfoboxRenderServiceTest.php
index 6c2d96b..235b313 100644
--- a/tests/phpunit/PortableInfoboxRenderServiceTest.php
+++ b/tests/phpunit/PortableInfoboxRenderServiceTest.php
@@ -38,7 +38,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 		$infoboxRenderService = new PortableInfoboxRenderService();
 
 		$actualOutput = $infoboxRenderService->renderInfobox(
-			$input, '', '', $accentColor, $accentColorText, ''
+			$input, '', '', $accentColor, $accentColorText, '', ''
 		);
 		$expectedHtml = $this->normalizeHTML( $expectedOutput );
 		$actualHtml = $this->normalizeHTML( $actualOutput );
@@ -61,7 +61,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'title',
 						'data' => [
-							'value' => 'Test Title'
+							'value' => 'Test Title',
+							'item-name' => null
 						]
 					]
 				],
@@ -78,7 +79,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'title',
 						'data' => [
-							'value' => 'Test Title'
+							'value' => 'Test Title',
+							'item-name' => null
 						]
 					]
 				],
@@ -103,7 +105,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'height' => '200',
 								'thumbnail' => 'http://thumbnail.jpg',
 								'thumbnail2x' => 'http://thumbnail2x.jpg',
-								'isImage' => true
+								'isImage' => true,
+								'item-name' => null
 							]
 						]
 					]
@@ -131,7 +134,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'alt' => 'image alt',
 								'url' => 'http://image.jpg',
 								'caption' => 'Lorem ipsum dolor',
-								'isVideo' => true
+								'isVideo' => true,
+								'item-name' => null
 							]
 						]
 					]
@@ -156,6 +160,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'navigation',
 						'data' => [
 							'value' => 'navigation value',
+							'item-name' => null
 						]
 					]
 				],
@@ -173,7 +178,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'data',
 						'data' => [
 							'label' => 'test label',
-							'value' => 'test value'
+							'value' => 'test value',
+							'item-name' => null
 						]
 					]
 				],
@@ -193,7 +199,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'title',
 						'data' => [
-							'value' => 'Test Title'
+							'value' => 'Test Title',
+							'item-name' => null
 						]
 					],
 					[
@@ -206,7 +213,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'height' => '200',
 								'thumbnail' => 'http://thumbnail.jpg',
 								'thumbnail2x' => 'http://thumbnail2x.jpg',
-								'isImage' => true
+								'isImage' => true,
+								'item-name' => null
 							]
 						]
 					],
@@ -214,7 +222,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'data',
 						'data' => [
 							'label' => 'test label',
-							'value' => 'test value'
+							'value' => 'test value',
+							'item-name' => null
 						]
 					]
 				],
@@ -241,7 +250,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'title',
 						'data' => [
-							'value' => 'Test Title'
+							'value' => 'Test Title',
+							'item-name' => null
 						]
 					],
 					[
@@ -252,7 +262,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'data',
 						'data' => [
 							'label' => 'test label',
-							'value' => 'test value'
+							'value' => 'test value',
+							'item-name' => null
 						]
 					]
 				],
@@ -273,14 +284,16 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'title',
 						'data' => [
-							'value' => 'Test Title'
+							'value' => 'Test Title',
+							'item-name' => null
 						]
 					],
 					[
 						'type' => 'data',
 						'data' => [
 							'label' => 'test label',
-							'value' => 'test value'
+							'value' => 'test value',
+							'item-name' => null
 						]
 					]
 				],
@@ -301,7 +314,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'title',
 						'data' => [
-							'value' => 'Test Title'
+							'value' => 'Test Title',
+							'item-name' => null
 						]
 					],
 					[
@@ -311,27 +325,31 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								[
 									'type' => 'header',
 									'data' => [
-										'value' => 'Test Header'
+										'value' => 'Test Header',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => 'default',
 							'collapse' => null,
-							'row-items' => null
+							'row-items' => null,
+							'item-name' => null
 						]
 					]
 				],
@@ -359,7 +377,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'title',
 						'data' => [
-							'value' => 'Test Title'
+							'value' => 'Test Title',
+							'item-name' => null
 						]
 					],
 					[
@@ -369,27 +388,31 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								[
 									'type' => 'header',
 									'data' => [
-										'value' => 'Test Header'
+										'value' => 'Test Header',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => 'default',
 							'collapse' => null,
-							'row-items' => null
+							'row-items' => null,
+							'item-name' => null
 						]
 					]
 				],
@@ -422,27 +445,31 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								[
 									'type' => 'header',
 									'data' => [
-										'value' => 'Test header'
+										'value' => 'Test header',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => 'horizontal',
 							'collapse' => null,
-							'row-items' => null
+							'row-items' => null,
+							'item-name' => null
 						]
 					]
 				],
@@ -480,20 +507,23 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'type' => 'data',
 									'data' => [
 										'label' => '',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => '',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => 'horizontal',
 							'collapse' => null,
-							'row-items' => null
+							'row-items' => null,
+							'item-name' => null
 						]
 					]
 				],
@@ -519,7 +549,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'navigation',
 						'data' => [
-							'value' => '<p>Links</p>'
+							'value' => '<p>Links</p>',
+							'item-name' => null
 						]
 					]
 				],
@@ -544,20 +575,23 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label 1',
-										'value' => 'test value 1'
+										'value' => 'test value 1',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label 2',
-										'value' => 'test value 2'
+										'value' => 'test value 2',
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => 'horizontal',
 							'collapse' => null,
-							'row-items' => null
+							'row-items' => null,
+							'item-name' => null
 						]
 					]
 				],
@@ -593,27 +627,31 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								[
 									'type' => 'header',
 									'data' => [
-										'value' => 'test header'
+										'value' => 'test header',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => '',
-										'value' => 'test value 1'
+										'value' => 'test value 1',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label 2',
-										'value' => 'test value 2'
+										'value' => 'test value 2',
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => 'horizontal',
 							'collapse' => null,
-							'row-items' => null
+							'row-items' => null,
+							'item-name' => null
 						]
 					]
 				],
@@ -651,20 +689,23 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'type' => 'data',
 									'data' => [
 										'label' => '',
-										'value' => 'test value 1'
+										'value' => 'test value 1',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => '',
-										'value' => 'test value 2'
+										'value' => 'test value 2',
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => 'horizontal',
 							'collapse' => null,
-							'row-items' => null
+							'row-items' => null,
+							'item-name' => null
 						]
 					]
 				],
@@ -697,7 +738,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -706,7 +748,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 2',
 										'value' => 'test value 2',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -715,7 +758,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 3',
 										'value' => 'test value 3',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -724,7 +768,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 4',
 										'value' => 'test value 4',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -733,13 +778,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 5',
 										'value' => 'test value 5',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -786,7 +833,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -795,7 +843,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 2',
 										'value' => 'test value 2',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -804,7 +853,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 3',
 										'value' => 'test value 3',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -813,13 +863,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 4',
 										'value' => 'test value 4',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -864,13 +916,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -903,7 +957,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 2,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -912,13 +967,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 2',
 										'value' => 'test value 2',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -953,7 +1010,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 2,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -962,13 +1020,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 2',
 										'value' => 'test value 2',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 7
+							'row-items' => 7,
+							'item-name' => null
 						]
 					]
 				],
@@ -1003,7 +1063,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 2,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1012,7 +1073,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 2',
 										'value' => 'test value 2',
 										'span' => 2,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1021,13 +1083,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 3',
 										'value' => 'test value 3',
 										'span' => 2,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -1076,7 +1140,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1085,7 +1150,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 2',
 										'value' => 'test value 2',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1094,7 +1160,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 3',
 										'value' => 'test value 3',
 										'span' => null,
-										'layout' => 'default'
+										'layout' => 'default',
+										'item-name' => null
 									]
 								],
 								[
@@ -1103,7 +1170,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 4',
 										'value' => 'test value 4',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1112,7 +1180,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 5',
 										'value' => 'test value 5',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1121,13 +1190,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 6',
 										'value' => 'test value 6',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -1178,7 +1249,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1187,7 +1259,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 2',
 										'value' => 'test value 2',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1196,7 +1269,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 3',
 										'value' => 'test value 3',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1205,7 +1279,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 4',
 										'value' => 'test value 4',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1214,7 +1289,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 5',
 										'value' => 'test value 5',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1223,13 +1299,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 6',
 										'value' => 'test value 6',
 										'span' => null,
-										'layout' => 'default'
+										'layout' => 'default',
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -1280,7 +1358,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 40,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1289,7 +1368,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 2',
 										'value' => 'test value 2',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1298,13 +1378,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 3',
 										'value' => 'test value 3',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -1347,7 +1429,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1356,7 +1439,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 2',
 										'value' => 'test value 2',
 										'span' => 40,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1365,13 +1449,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 3',
 										'value' => 'test value 3',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -1420,7 +1506,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 1',
 										'value' => 'test value 1',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1429,13 +1516,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 2',
 										'value' => 'test value 2',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'title',
 									'data' => [
-										'value' => 'title value'
+										'value' => 'title value',
+										'item-name' => null
 									]
 								],
 								[
@@ -1444,13 +1533,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 3',
 										'value' => 'test value 3',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -1494,7 +1585,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => null,
 										'value' => 'test value 1',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1503,13 +1595,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => null,
 										'value' => 'test value 2',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'title',
 									'data' => [
-										'value' => 'title value'
+										'value' => 'title value',
+										'item-name' => null
 									]
 								],
 								[
@@ -1518,7 +1612,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => null,
 										'value' => 'test value 3',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								],
 								[
@@ -1527,13 +1622,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'label' => 'Test 4',
 										'value' => 'test value 4',
 										'span' => 1,
-										'layout' => null
+										'layout' => null,
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => null,
 							'collapse' => null,
-							'row-items' => 3
+							'row-items' => 3,
+							'item-name' => null
 						]
 					]
 				],
@@ -1568,7 +1665,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'title',
 						'data' => [
-							'value' => 'Test Title'
+							'value' => 'Test Title',
+							'item-name' => null
 						]
 					],
 					[
@@ -1584,7 +1682,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'thumbnail' => 'http://thumbnail.jpg',
 								'thumbnail2x' => 'http://thumbnail2x.jpg',
 								'isImage' => true,
-								'isFirst' => true
+								'isFirst' => true,
+								'item-name' => null
 							],
 							[
 								'alt' => 'image alt',
@@ -1595,7 +1694,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'height' => '200',
 								'thumbnail' => 'http://thumbnail.jpg',
 								'thumbnail2x' => 'http://thumbnail2x.jpg',
-								'isImage' => true
+								'isImage' => true,
+								'item-name' => null
 							]
 						]
 					]
@@ -1635,7 +1735,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'title',
 						'data' => [
-							'value' => 'Test Title'
+							'value' => 'Test Title',
+							'item-name' => null
 						]
 					],
 					[
@@ -1645,27 +1746,31 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								[
 									'type' => 'header',
 									'data' => [
-										'value' => 'Test Header'
+										'value' => 'Test Header',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => 'default',
 							'collapse' => 'open',
-							'row-items' => null
+							'row-items' => null,
+							'item-name' => null
 						]
 					]
 				],
@@ -1693,7 +1798,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					[
 						'type' => 'title',
 						'data' => [
-							'value' => 'Test Title'
+							'value' => 'Test Title',
+							'item-name' => null
 						]
 					],
 					[
@@ -1703,27 +1809,31 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								[
 									'type' => 'header',
 									'data' => [
-										'value' => 'Test Header'
+										'value' => 'Test Header',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								],
 								[
 									'type' => 'data',
 									'data' => [
 										'label' => 'test label',
-										'value' => 'test value'
+										'value' => 'test value',
+										'item-name' => null
 									]
 								]
 							],
 							'layout' => 'default',
 							'collapse' => 'closed',
-							'row-items' => null
+							'row-items' => null,
+							'item-name' => null
 						]
 					]
 				],
diff --git a/tests/phpunit/nodes/NodeDataTest.php b/tests/phpunit/nodes/NodeDataTest.php
index 927cdb7..6007264 100644
--- a/tests/phpunit/nodes/NodeDataTest.php
+++ b/tests/phpunit/nodes/NodeDataTest.php
@@ -532,67 +532,158 @@ class NodeDataTest extends MediaWikiTestCase {
 			[
 				'<data source="test"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => 'test',
+					'label' => '',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test" span="2"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => '2', 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => 'test',
+					'label' => '',
+					'span' => '2',
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test" span="2.2"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => 'test',
+					'label' => '',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test" span="non_numeric_span"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => 'test',
+					'label' => '',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test" layout="wrong layout"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => 'test',
+					'label' => '',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test" layout="default"></data>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'label' => '', 'span' => 1, 'layout' => 'default', 'source' => 'test' ]
+				[
+					'value' => 'test',
+					'label' => '',
+					'span' => 1,
+					'layout' => 'default',
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test"><default>def</default></data>',
 				[],
-				[ 'value' => 'def', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => 'def',
+					'label' => '',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test"><label>l</label><default>def</default></data>',
 				[],
-				[ 'value' => 'def', 'label' => 'l', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => 'def',
+					'label' => 'l',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test"><label source="l">jjj</label><default>def</default></data>',
 				[ 'l' => 1 ],
-				[ 'value' => 'def', 'label' => 'jjj', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => 'def',
+					'label' => 'jjj',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test"><label source="l" /><default>def</default></data>',
 				[ 'l' => 1 ],
-				[ 'value' => 'def', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => 'def',
+					'label' => '',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test"><label>l</label><default>def</default></data>',
 				[ 'test' => 1 ],
-				[ 'value' => 1, 'label' => 'l', 'span' => 1, 'layout' => null , 'source' => 'test' ]
+				[
+					'value' => 1,
+					'label' => 'l',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data></data>',
 				[],
-				[ 'label' => '', 'value' => null, 'span' => 1, 'layout' => null, 'source' => null ]
+				[
+					'label' => '',
+					'value' => null,
+					'span' => 1,
+					'layout' => null,
+					'source' => null,
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test"><label>l</label><format>{{{test}}}%</format><default>def</default></data>',
 				[ 'test' => 1 ],
-				[ 'value' => '{{{test}}}%', 'label' => 'l', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => '{{{test}}}%',
+					'label' => 'l',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test">' .
@@ -604,18 +695,33 @@ class NodeDataTest extends MediaWikiTestCase {
 					'label' => 'l',
 					'span' => 1,
 					'layout' => null,
-					'source' => 'test'
+					'source' => 'test',
+					'item-name' => null
 				]
 			],
 			[
 				'<data source="test"><label>l</label><format>{{{test}}}%</format><default>def</default></data>',
 				[],
-				[ 'value' => 'def', 'label' => 'l', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => 'def',
+					'label' => 'l',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 			[
 				'<data source="test"><format>{{{test}}}%</format></data>',
 				[ 'test' => 0 ],
-				[ 'value' => '{{{test}}}%', 'label' => '', 'span' => 1, 'layout' => null, 'source' => 'test' ]
+				[
+					'value' => '{{{test}}}%',
+					'label' => '',
+					'span' => 1,
+					'layout' => null,
+					'source' => 'test',
+					'item-name' => null
+				]
 			],
 		];
 	}
@@ -648,7 +754,8 @@ class NodeDataTest extends MediaWikiTestCase {
 						'label' => '',
 						'span' => 1,
 						'layout' => null,
-						'source' => 'test'
+						'source' => 'test',
+						'item-name' => null
 					]
 				]
 			],
@@ -662,7 +769,8 @@ class NodeDataTest extends MediaWikiTestCase {
 						'label' => '',
 						'span' => 1,
 						'layout' => 'default',
-						'source' => 'test'
+						'source' => 'test',
+						'item-name' => null
 					]
 				]
 			],
@@ -676,7 +784,8 @@ class NodeDataTest extends MediaWikiTestCase {
 						'label' => '',
 						'span' => 1,
 						'layout' => null,
-						'source' => 'test'
+						'source' => 'test',
+						'item-name' => null
 					]
 				]
 			],
@@ -690,7 +799,8 @@ class NodeDataTest extends MediaWikiTestCase {
 						'label' => '',
 						'span' => '2',
 						'layout' => null,
-						'source' => 'test'
+						'source' => 'test',
+						'item-name' => null
 					]
 				]
 			],
@@ -704,7 +814,8 @@ class NodeDataTest extends MediaWikiTestCase {
 						'label' => '',
 						'span' => 1,
 						'layout' => null,
-						'source' => 'test'
+						'source' => 'test',
+						'item-name' => null
 					]
 				]
 			],
@@ -718,7 +829,8 @@ class NodeDataTest extends MediaWikiTestCase {
 						'label' => '',
 						'span' => 1,
 						'layout' => null,
-						'source' => 'test'
+						'source' => 'test',
+						'item-name' => null
 					]
 				]
 			],
diff --git a/tests/phpunit/nodes/NodeGroupTest.php b/tests/phpunit/nodes/NodeGroupTest.php
index 808c039..dde62ad 100644
--- a/tests/phpunit/nodes/NodeGroupTest.php
+++ b/tests/phpunit/nodes/NodeGroupTest.php
@@ -83,7 +83,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'value' => 1,
 								'span' => 1,
 								'layout' => null,
-								'source' => 'elem1'
+								'source' => 'elem1',
+								'item-name' => null
 							],
 							'source' => [ 'elem1' ]
 						],
@@ -95,7 +96,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'value' => 2,
 								'span' => 1,
 								'layout' => null,
-								'source' => 'elem2'
+								'source' => 'elem2',
+								'item-name' => null
 							],
 							'source' => [ 'elem2' ]
 						],
@@ -107,14 +109,16 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'value' => null,
 								'span' => 1,
 								'layout' => null,
-								'source' => 'elem3'
+								'source' => 'elem3',
+								'item-name' => null
 							],
 							'source' => [ 'elem3' ]
 						]
 					],
 					'layout' => 'default',
 					'collapse' => null,
-					'row-items' => null
+					'row-items' => null,
+					'item-name' => null
 				]
 			],
 			[
@@ -134,7 +138,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'value' => 1,
 								'span' => 1,
 								'layout' => null,
-								'source' => 'elem1'
+								'source' => 'elem1',
+								'item-name' => null
 							],
 							'source' => [ 'elem1' ]
 						],
@@ -146,7 +151,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'value' => 2,
 								'span' => 1,
 								'layout' => null,
-								'source' => 'elem2'
+								'source' => 'elem2',
+								'item-name' => null
 							],
 							'source' => [ 'elem2' ]
 						],
@@ -158,14 +164,16 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'value' => null,
 								'span' => 1,
 								'layout' => null,
-								'source' => 'elem3'
+								'source' => 'elem3',
+								'item-name' => null
 							],
 							'source' => [ 'elem3' ]
 						],
 					],
 					'layout' => 'horizontal',
 					'collapse' => null,
-					'row-items' => null
+					'row-items' => null,
+					'item-name' => null
 				]
 			],
 			[
@@ -185,7 +193,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'value' => 1,
 								'span' => 1,
 								'layout' => null,
-								'source' => 'elem1'
+								'source' => 'elem1',
+								'item-name' => null
 							],
 							'source' => [ 'elem1' ]
 						],
@@ -197,7 +206,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'value' => 2,
 								'span' => 1,
 								'layout' => null,
-								'source' => 'elem2'
+								'source' => 'elem2',
+								'item-name' => null
 							],
 							'source' => [ 'elem2' ]
 						],
@@ -209,14 +219,16 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'value' => null,
 								'span' => 1,
 								'layout' => null,
-								'source' => 'elem3'
+								'source' => 'elem3',
+								'item-name' => null
 							],
 							'source' => [ 'elem3' ]
 						]
 					],
 					'layout' => 'default',
 					'collapse' => null,
-					'row-items' => null
+					'row-items' => null,
+					'item-name' => null
 				]
 			],
 			[
@@ -227,7 +239,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 						[
 							'type' => 'header',
 							'data' => [
-								'value' => 'h'
+								'value' => 'h',
+								'item-name' => null
 							],
 							'isEmpty' => false,
 							'source' => []
@@ -239,7 +252,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'label' => '',
 								'span' => 1,
 								'layout' => null,
-								'source' => '1'
+								'source' => '1',
+								'item-name' => null
 							],
 							'isEmpty' => false,
 							'source' => [ '1' ]
@@ -251,7 +265,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'label' => '',
 								'span' => 1,
 								'layout' => null,
-								'source' => '2'
+								'source' => '2',
+								'item-name' => null
 							],
 							'isEmpty' => false,
 							'source' => [ '2' ]
@@ -259,7 +274,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 					],
 					'layout' => 'default',
 					'collapse' => null,
-					'row-items' => null
+					'row-items' => null,
+					'item-name' => null
 				]
 			],
 			[
@@ -269,7 +285,7 @@ class NodeGroupTest extends MediaWikiTestCase {
 					'value' => [
 						[
 							'type' => 'header',
-							'data' => [ 'value' => 'h' ],
+							'data' => [ 'value' => 'h', 'item-name' => null ],
 							'isEmpty' => false,
 							'source' => []
 						],
@@ -280,7 +296,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'label' => '',
 								'span' => 1,
 								'layout' => null,
-								'source' => '1'
+								'source' => '1',
+								'item-name' => null
 							],
 							'isEmpty' => false,
 							'source' => [ '1' ]
@@ -292,7 +309,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'label' => '',
 								'span' => 1,
 								'layout' => null,
-								'source' => '2'
+								'source' => '2',
+								'item-name' => null
 							],
 							'isEmpty' => true,
 							'source' => [ '2' ]
@@ -300,7 +318,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 					],
 					'layout' => 'default',
 					'collapse' => null,
-					'row-items' => null
+					'row-items' => null,
+					'item-name' => null
 				]
 			],
 			[
@@ -310,7 +329,10 @@ class NodeGroupTest extends MediaWikiTestCase {
 					'value' => [
 						[
 							'type' => 'header',
-							'data' => [ 'value' => 'h' ],
+							'data' => [
+								'value' => 'h',
+								'item-name' => null
+							],
 							'isEmpty' => false,
 							'source' => []
 						],
@@ -321,7 +343,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'label' => '',
 								'span' => 1,
 								'layout' => null,
-								'source' => '1'
+								'source' => '1',
+								'item-name' => null
 							],
 							'isEmpty' => true,
 							'source' => [ '1' ]
@@ -333,7 +356,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 								'label' => '',
 								'span' => 1,
 								'layout' => null,
-								'source' => '2'
+								'source' => '2',
+								'item-name' => null
 							],
 							'isEmpty' => true,
 							'source' => [ '2' ]
@@ -341,7 +365,8 @@ class NodeGroupTest extends MediaWikiTestCase {
 					],
 					'layout' => 'default',
 					'collapse' => null,
-					'row-items' => null
+					'row-items' => null,
+					'item-name' => null
 				]
 			]
 		];
diff --git a/tests/phpunit/nodes/NodeHeaderTest.php b/tests/phpunit/nodes/NodeHeaderTest.php
index fd30e1d..121b0de 100644
--- a/tests/phpunit/nodes/NodeHeaderTest.php
+++ b/tests/phpunit/nodes/NodeHeaderTest.php
@@ -23,15 +23,15 @@ class NodeHeaderTest extends MediaWikiTestCase {
 		return [
 			[
 				'<header></header>',
-				[ 'value' => '' ]
+				[ 'value' => '', 'item-name' => null ]
 			],
 			[
 				'<header>kjdflkja dafkjlsdkfj</header>',
-				[ 'value' => 'kjdflkja dafkjlsdkfj' ]
+				[ 'value' => 'kjdflkja dafkjlsdkfj', 'item-name' => null ]
 			],
 			[
 				'<header>kjdflkja<ref>dafkjlsdkfj</ref></header>',
-				[ 'value' => 'kjdflkja<ref>dafkjlsdkfj</ref>' ]
+				[ 'value' => 'kjdflkja<ref>dafkjlsdkfj</ref>', 'item-name' => null ]
 			]
 		];
 	}
diff --git a/tests/phpunit/nodes/NodeMediaTest.php b/tests/phpunit/nodes/NodeMediaTest.php
index 1569cd0..17a9571 100644
--- a/tests/phpunit/nodes/NodeMediaTest.php
+++ b/tests/phpunit/nodes/NodeMediaTest.php
@@ -180,7 +180,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'isImage' => true,
 					'isVideo' => false,
 					'isAudio' => false,
-					'source' => 'img'
+					'source' => 'img',
+					'item-name' => null
 				] ]
 			],
 			[
@@ -195,7 +196,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'isImage' => true,
 					'isVideo' => false,
 					'isAudio' => false,
-					'source' => 'img'
+					'source' => 'img',
+					'item-name' => null
 				] ]
 			],
 			[
@@ -210,7 +212,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'isImage' => true,
 					'isVideo' => false,
 					'isAudio' => false,
-					'source' => 'img'
+					'source' => 'img',
+					'item-name' => null
 				] ]
 			],
 			[
@@ -225,7 +228,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'isImage' => true,
 					'isVideo' => false,
 					'isAudio' => false,
-					'source' => 'img'
+					'source' => 'img',
+					'item-name' => null
 				] ]
 			],
 			[
@@ -240,7 +244,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'isImage' => false,
 					'isVideo' => true,
 					'isAudio' => false,
-					'source' => 'media'
+					'source' => 'media',
+					'item-name' => null
 				] ]
 			],
 			[
@@ -261,7 +266,8 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'isImage' => false,
 					'isVideo' => false,
 					'isAudio' => true,
-					'source' => 'media'
+					'source' => 'media',
+					'item-name' => null
 				] ]
 			],
 			[
diff --git a/tests/phpunit/nodes/NodeNavigationTest.php b/tests/phpunit/nodes/NodeNavigationTest.php
index be525d4..99522b4 100644
--- a/tests/phpunit/nodes/NodeNavigationTest.php
+++ b/tests/phpunit/nodes/NodeNavigationTest.php
@@ -23,15 +23,15 @@ class NodeNavigationTest extends MediaWikiTestCase {
 		return [
 			[
 				'<navigation></navigation>',
-				[ 'value' => '' ]
+				[ 'value' => '', 'item-name' => null ]
 			],
 			[
 				'<navigation>kjdflkja dafkjlsdkfj</navigation>',
-				[ 'value' => 'kjdflkja dafkjlsdkfj' ]
+				[ 'value' => 'kjdflkja dafkjlsdkfj', 'item-name' => null ]
 			],
 			[
 				'<navigation>kjdflkja<ref>dafkjlsdkfj</ref></navigation>',
-				[ 'value' => 'kjdflkja<ref>dafkjlsdkfj</ref>' ]
+				[ 'value' => 'kjdflkja<ref>dafkjlsdkfj</ref>', 'item-name' => null ]
 			]
 		];
 	}
diff --git a/tests/phpunit/nodes/NodeTitleTest.php b/tests/phpunit/nodes/NodeTitleTest.php
index 9e32204..10b4b1d 100644
--- a/tests/phpunit/nodes/NodeTitleTest.php
+++ b/tests/phpunit/nodes/NodeTitleTest.php
@@ -24,57 +24,57 @@ class NodeTitleTest extends MediaWikiTestCase {
 			[
 				'<title source="test"/>',
 				[ 'test' => 'test' ],
-				[ 'value' => 'test', 'source' => 'test' ]
+				[ 'value' => 'test', 'source' => 'test', 'item-name' => null ]
 			],
 			[
 				'<title source="test"><default>def</default></title>',
 				[],
-				[ 'value' => 'def', 'source' => 'test' ]
+				[ 'value' => 'def', 'source' => 'test', 'item-name' => null ]
 			],
 			[
 				'<title source="test"><default>def</default></title>',
 				[],
-				[ 'value' => 'def', 'source' => 'test' ]
+				[ 'value' => 'def', 'source' => 'test', 'item-name' => null ]
 			],
 			[
 				'<title source="test"><default>def</default></title>',
 				[ 'l' => 1 ],
-				[ 'value' => 'def', 'source' => 'test' ]
+				[ 'value' => 'def', 'source' => 'test', 'item-name' => null ]
 			],
 			[
 				'<title source="test"><default>def</default></title>',
 				[ 'l' => 1 ],
-				[ 'value' => 'def', 'source' => 'test' ]
+				[ 'value' => 'def', 'source' => 'test', 'item-name' => null ]
 			],
 			[
 				'<title source="test"><default>def</default></title>',
 				[ 'test' => 1 ],
-				[ 'value' => 1, 'source' => 'test' ]
+				[ 'value' => 1, 'source' => 'test', 'item-name' => null ]
 			],
 			[
 				'<title></title>',
 				[],
-				[ 'value' => null, 'source' => null ]
+				[ 'value' => null, 'source' => null, 'item-name' => null ]
 			],
 			[
 				'<title source="test"><format>{{{test}}}%</format><default>def</default></title>',
 				[ 'test' => 1 ],
-				[ 'value' => '{{{test}}}%', 'source' => 'test' ]
+				[ 'value' => '{{{test}}}%', 'source' => 'test', 'item-name' => null ]
 			],
 			[
 				'<title source="test"><format>{{{not_defined_var}}}%</format><default>def</default></title>',
 				[ 'test' => 1 ],
-				[ 'value' => '{{{not_defined_var}}}%', 'source' => 'test' ]
+				[ 'value' => '{{{not_defined_var}}}%', 'source' => 'test', 'item-name' => null ]
 			],
 			[
 				'<title source="test"><format>{{{test}}}%</format><default>def</default></title>',
 				[],
-				[ 'value' => 'def', 'source' => 'test' ]
+				[ 'value' => 'def', 'source' => 'test', 'item-name' => null ]
 			],
 			[
 				'<title source="test"><format>{{{test}}}%</format></title>',
 				[ 'test' => 0 ],
-				[ 'value' => '{{{test}}}%', 'source' => 'test' ]
+				[ 'value' => '{{{test}}}%', 'source' => 'test', 'item-name' => null ]
 			]
 		];
 	}

From 4968e853c389a263b75aba71e1d7f6e167e6f4fc Mon Sep 17 00:00:00 2001
From: lkucharczyk <14111811+lkucharczyk@users.noreply.github.com>
Date: Sat, 2 Feb 2019 23:56:16 +0100
Subject: [PATCH 4/5] Add missing item-name for image collections

---
 includes/services/PortableInfoboxRenderService.php | 6 +++++-
 tests/phpunit/PortableInfoboxRenderServiceTest.php | 4 ++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/includes/services/PortableInfoboxRenderService.php b/includes/services/PortableInfoboxRenderService.php
index 8217afe..a960f75 100644
--- a/includes/services/PortableInfoboxRenderService.php
+++ b/includes/services/PortableInfoboxRenderService.php
@@ -145,7 +145,11 @@ class PortableInfoboxRenderService {
 			$templateName = 'media';
 		} else {
 			// More than one image means image collection
-			$data = [ 'images' => $data, 'source' => $data[0]['source'] ?? "" ];
+			$data = [
+				'images' => $data,
+				'source' => $data[0]['source'] ?? "",
+				'item-name' => $data[0]['item-name'] ?? ""
+			];
 			$templateName = 'media-collection';
 		}
 
diff --git a/tests/phpunit/PortableInfoboxRenderServiceTest.php b/tests/phpunit/PortableInfoboxRenderServiceTest.php
index 235b313..ae5c2c6 100644
--- a/tests/phpunit/PortableInfoboxRenderServiceTest.php
+++ b/tests/phpunit/PortableInfoboxRenderServiceTest.php
@@ -106,6 +106,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'thumbnail' => 'http://thumbnail.jpg',
 								'thumbnail2x' => 'http://thumbnail2x.jpg',
 								'isImage' => true,
+								'source' => null,
 								'item-name' => null
 							]
 						]
@@ -135,6 +136,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'url' => 'http://image.jpg',
 								'caption' => 'Lorem ipsum dolor',
 								'isVideo' => true,
+								'source' => null,
 								'item-name' => null
 							]
 						]
@@ -214,6 +216,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'thumbnail' => 'http://thumbnail.jpg',
 								'thumbnail2x' => 'http://thumbnail2x.jpg',
 								'isImage' => true,
+								'source' => null,
 								'item-name' => null
 							]
 						]
@@ -1683,6 +1686,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'thumbnail2x' => 'http://thumbnail2x.jpg',
 								'isImage' => true,
 								'isFirst' => true,
+								'source' => null,
 								'item-name' => null
 							],
 							[

From c11b8f6b68eee767dae58282e1d0e62acbfd10d7 Mon Sep 17 00:00:00 2001
From: lkucharczyk <14111811+lkucharczyk@users.noreply.github.com>
Date: Sun, 3 Feb 2019 17:49:06 +0100
Subject: [PATCH 5/5] Add unit tests

---
 .../services/PortableInfoboxRenderService.php |   4 +-
 .../PortableInfoboxRenderServiceTest.php      | 240 +++++++++++-------
 tests/phpunit/nodes/NodeDataTest.php          |  15 ++
 tests/phpunit/nodes/NodeGroupTest.php         |  34 +++
 tests/phpunit/nodes/NodeHeaderTest.php        |   4 +
 tests/phpunit/nodes/NodeMediaTest.php         |  16 ++
 tests/phpunit/nodes/NodeNavigationTest.php    |   4 +
 tests/phpunit/nodes/NodeTitleTest.php         |  10 +
 8 files changed, 228 insertions(+), 99 deletions(-)

diff --git a/includes/services/PortableInfoboxRenderService.php b/includes/services/PortableInfoboxRenderService.php
index a960f75..89c9403 100644
--- a/includes/services/PortableInfoboxRenderService.php
+++ b/includes/services/PortableInfoboxRenderService.php
@@ -147,8 +147,8 @@ class PortableInfoboxRenderService {
 			// More than one image means image collection
 			$data = [
 				'images' => $data,
-				'source' => $data[0]['source'] ?? "",
-				'item-name' => $data[0]['item-name'] ?? ""
+				'source' => $data[0]['source'],
+				'item-name' => $data[0]['item-name']
 			];
 			$templateName = 'media-collection';
 		}
diff --git a/tests/phpunit/PortableInfoboxRenderServiceTest.php b/tests/phpunit/PortableInfoboxRenderServiceTest.php
index ae5c2c6..eac7183 100644
--- a/tests/phpunit/PortableInfoboxRenderServiceTest.php
+++ b/tests/phpunit/PortableInfoboxRenderServiceTest.php
@@ -62,6 +62,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'title',
 						'data' => [
 							'value' => 'Test Title',
+							'source' => null,
 							'item-name' => null
 						]
 					]
@@ -71,8 +72,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Only title',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -80,6 +80,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'title',
 						'data' => [
 							'value' => 'Test Title',
+							'source' => null,
 							'item-name' => null
 						]
 					]
@@ -89,8 +90,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Only title with custom colors',
 				'accentColor' => '#FFF',
-				'accentColorText' => '#000',
-				'type' => ''
+				'accentColorText' => '#000'
 			],
 			[
 				'input' => [
@@ -123,8 +123,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Only image',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -153,8 +152,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Only video',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -171,8 +169,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'navigation only',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -181,6 +178,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'data' => [
 							'label' => 'test label',
 							'value' => 'test value',
+							'source' => null,
 							'item-name' => null
 						]
 					]
@@ -193,8 +191,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Only pair',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -202,6 +199,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'title',
 						'data' => [
 							'value' => 'Test Title',
+							'source' => null,
 							'item-name' => null
 						]
 					],
@@ -226,6 +224,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'data' => [
 							'label' => 'test label',
 							'value' => 'test value',
+							'source' => 'test',
 							'item-name' => null
 						]
 					]
@@ -238,15 +237,14 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									class="pi-image-thumbnail" alt="image alt" width="400" height="200"/>
 							</a>
 						</figure>
-						<div class="pi-item pi-data pi-item-spacing pi-border-color">
+						<div class="pi-item pi-data pi-item-spacing pi-border-color" data-source="test">
 							<h3 class="pi-data-label pi-secondary-font">test label</h3>
 							<div class="pi-data-value pi-font">test value</div>
 						</div>
 					</aside>',
 				'description' => 'Simple infobox with title, image and key-value pair',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -254,6 +252,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'title',
 						'data' => [
 							'value' => 'Test Title',
+							'source' => null,
 							'item-name' => null
 						]
 					],
@@ -266,6 +265,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'data' => [
 							'label' => 'test label',
 							'value' => 'test value',
+							'source' => null,
 							'item-name' => null
 						]
 					]
@@ -279,8 +279,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Simple infobox with title, INVALID image and key-value pair',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -296,21 +295,21 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'data' => [
 							'label' => 'test label',
 							'value' => 'test value',
-							'item-name' => null
+							'source' => null,
+							'item-name' => 'testname'
 						]
 					]
 				],
 				'output' => '<aside class="portable-infobox pi-background">
 						<h2 class="pi-item pi-item-spacing pi-title">Test Title</h2>
-						<div class="pi-item pi-data pi-item-spacing pi-border-color">
+						<div class="pi-item pi-data pi-item-spacing pi-border-color" data-item-name="testname">
 							<h3 class="pi-data-label pi-secondary-font">test label</h3>
 							<div class="pi-data-value pi-font">test value</div>
 						</div>
 					</aside>',
 				'description' => 'Simple infobox with title, empty image and key-value pair',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -318,6 +317,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'title',
 						'data' => [
 							'value' => 'Test Title',
+							'source' => null,
 							'item-name' => null
 						]
 					],
@@ -337,7 +337,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label',
 										'value' => 'test value',
-										'item-name' => null
+										'source' => null,
+										'item-name' => 'dataname'
 									]
 								],
 								[
@@ -345,6 +346,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label',
 										'value' => 'test value',
+										'source' => 'datasrc',
 										'item-name' => null
 									]
 								]
@@ -360,11 +362,11 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						<h2 class="pi-item pi-item-spacing pi-title">Test Title</h2>
 						<section class="pi-item pi-group pi-border-color">
 							<h2 class="pi-item pi-header pi-secondary-font pi-item-spacing pi-secondary-background">Test Header</h2>
-							<div class="pi-item pi-data pi-item-spacing pi-border-color">
+							<div class="pi-item pi-data pi-item-spacing pi-border-color" data-item-name="dataname">
 								<h3 class="pi-data-label pi-secondary-font">test label</h3>
 								<div class="pi-data-value pi-font">test value</div>
 							</div>
-							<div class="pi-item pi-data pi-item-spacing pi-border-color">
+							<div class="pi-item pi-data pi-item-spacing pi-border-color" data-source="datasrc">
 								<h3 class="pi-data-label pi-secondary-font">test label</h3>
 								<div class="pi-data-value pi-font">test value</div>
 							</div>
@@ -372,8 +374,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with title, group with header and two key-value pairs',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -381,6 +382,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'title',
 						'data' => [
 							'value' => 'Test Title',
+							'source' => null,
 							'item-name' => null
 						]
 					],
@@ -400,6 +402,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label',
 										'value' => 'test value',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -408,6 +411,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label',
 										'value' => 'test value',
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -436,8 +440,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 				'description' => 'Infobox with title, group with header and two key-value pairs, custom' .
 					'accent color and accent text color',
 				'accentColor' => '#FFF',
-				'accentColorText' => '#000',
-				'type' => ''
+				'accentColorText' => '#000'
 			],
 			[
 				'input' => [
@@ -457,6 +460,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label',
 										'value' => 'test value',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -465,6 +469,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label',
 										'value' => 'test value',
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -497,8 +502,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with horizontal group',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -511,6 +515,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => '',
 										'value' => 'test value',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -519,6 +524,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => '',
 										'value' => 'test value',
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -544,8 +550,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with horizontal group without header and labels',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -564,8 +569,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with navigation',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			// horizontal group tests
 			[
@@ -579,6 +583,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label 1',
 										'value' => 'test value 1',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -587,7 +592,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label 2',
 										'value' => 'test value 2',
-										'item-name' => null
+										'source' => 'src',
+										'item-name' => 'name'
 									]
 								]
 							],
@@ -604,13 +610,13 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								<thead>
 									<tr>
 										<th class="pi-horizontal-group-item pi-data-label pi-secondary-font pi-border-color pi-item-spacing">test label 1</th>
-										<th class="pi-horizontal-group-item pi-data-label pi-secondary-font pi-border-color pi-item-spacing">test label 2</th>
+										<th class="pi-horizontal-group-item pi-data-label pi-secondary-font pi-border-color pi-item-spacing" data-source="src" data-item-name="name">test label 2</th>
 									</tr>
 								</thead>
 								<tbody>
 									<tr>
 										<td class="pi-horizontal-group-item pi-data-value pi-font pi-border-color pi-item-spacing">test value 1</td>
-										<td class="pi-horizontal-group-item pi-data-value pi-font pi-border-color pi-item-spacing">test value 2</td>
+										<td class="pi-horizontal-group-item pi-data-value pi-font pi-border-color pi-item-spacing" data-source="src" data-item-name="name">test value 2</td>
 									</tr>
 								</tbody>
 							</table>
@@ -618,8 +624,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Horizontal group data without header',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -631,6 +636,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'type' => 'header',
 									'data' => [
 										'value' => 'test header',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -639,6 +645,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => '',
 										'value' => 'test value 1',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -647,6 +654,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label 2',
 										'value' => 'test value 2',
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -679,8 +687,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Horizontal group data with empty label',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -693,6 +700,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => '',
 										'value' => 'test value 1',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -701,6 +709,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => '',
 										'value' => 'test value 2',
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -726,8 +735,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Horizontal group data with empty label',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -742,6 +750,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -752,6 +761,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -762,6 +772,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 3',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -772,6 +783,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 4',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -782,6 +794,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 5',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -821,8 +834,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 5 elements with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -837,6 +849,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -847,7 +860,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 1,
 										'layout' => null,
-										'item-name' => null
+										'source' => null,
+										'item-name' => 'test2'
 									]
 								],
 								[
@@ -857,7 +871,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 3',
 										'span' => 1,
 										'layout' => null,
-										'item-name' => null
+										'source' => 'test3',
+										'item-name' => 'test3'
 									]
 								],
 								[
@@ -867,7 +882,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 4',
 										'span' => 1,
 										'layout' => null,
-										'item-name' => null
+										'source' => 'test4',
+										'item-name' => 'test4'
 									]
 								]
 							],
@@ -883,29 +899,28 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 							<section class="pi-item pi-smart-group pi-border-color">
 								<section class="pi-smart-group-head">
 									<h3 class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="width: 33.333333333333%">Test 1</h3>
-									<h3 class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="width: 33.333333333333%">Test 2</h3>
-									<h3 class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="width: 33.333333333333%">Test 3</h3>
+									<h3 class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="width: 33.333333333333%" data-item-name="test2">Test 2</h3>
+									<h3 class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="width: 33.333333333333%" data-source="test3" data-item-name="test3">Test 3</h3>
 								</section>
 								<section class="pi-smart-group-body">
 									<div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="width: 33.333333333333%">test value 1</div>
-									<div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="width: 33.333333333333%">test value 2</div>
-									<div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="width: 33.333333333333%">test value 3</div>
+									<div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="width: 33.333333333333%" data-item-name="test2">test value 2</div>
+									<div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="width: 33.333333333333%" data-source="test3" data-item-name="test3">test value 3</div>
 								</section>
 							</section>
 							<section class="pi-item pi-smart-group pi-border-color">
 								<section class="pi-smart-group-head">
-									<h3 class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="width: 100%">Test 4</h3>
+									<h3 class="pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style="width: 100%" data-source="test4" data-item-name="test4">Test 4</h3>
 								</section>
 								<section class="pi-smart-group-body">
-									<div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="width: 100%">test value 4</div>
+									<div class="pi-smart-data-value pi-data-value pi-font pi-item-spacing" style="width: 100%" data-source="test4" data-item-name="test4">test value 4</div>
 								</section>
 							</section>
 						</section>
 					</aside>',
 				'description' => 'Flex wrapped group of 4 elements with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -920,6 +935,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -945,8 +961,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of a single element with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -961,6 +976,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 2,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -971,6 +987,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -998,8 +1015,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 2 + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1014,6 +1030,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 2,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1024,6 +1041,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -1051,8 +1069,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 2 + 1 with row size 7',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1067,6 +1084,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 2,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1077,6 +1095,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 2,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1087,6 +1106,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 3',
 										'span' => 2,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -1128,8 +1148,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 2 + 2 + 2 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1144,6 +1163,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1154,6 +1174,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1164,6 +1185,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 3',
 										'span' => null,
 										'layout' => 'default',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1174,6 +1196,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 4',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1184,6 +1207,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 5',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1194,6 +1218,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 6',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -1237,8 +1262,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 1 + 1 + default + 1 + 1 + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1253,6 +1277,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1263,6 +1288,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1273,6 +1299,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 3',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1283,6 +1310,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 4',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1293,6 +1321,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 5',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1303,6 +1332,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 6',
 										'span' => null,
 										'layout' => 'default',
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -1346,8 +1376,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 1 + 1 + 1 + 1 + 1 + default with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1362,6 +1391,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 40,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1372,6 +1402,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1382,6 +1413,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 3',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -1417,8 +1449,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 40 + 1 + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1433,6 +1464,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1443,6 +1475,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 40,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1453,6 +1486,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 3',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -1494,8 +1528,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 1 + 40 + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1510,6 +1543,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1520,6 +1554,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1527,6 +1562,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'type' => 'title',
 									'data' => [
 										'value' => 'title value',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1537,6 +1573,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 3',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -1573,8 +1610,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 1 + 1 + title + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1589,6 +1625,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 1',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1599,6 +1636,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 2',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1606,6 +1644,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'type' => 'title',
 									'data' => [
 										'value' => 'title value',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1616,6 +1655,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 3',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1626,6 +1666,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 										'value' => 'test value 4',
 										'span' => 1,
 										'layout' => null,
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -1660,8 +1701,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Flex wrapped group of 1 (no label) + 1 (no label) + title + 1 (no label) + 1 with row size 3',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1669,6 +1709,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'title',
 						'data' => [
 							'value' => 'Test Title',
+							'source' => null,
 							'item-name' => null
 						]
 					],
@@ -1686,8 +1727,8 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'thumbnail2x' => 'http://thumbnail2x.jpg',
 								'isImage' => true,
 								'isFirst' => true,
-								'source' => null,
-								'item-name' => null
+								'source' => 'src',
+								'item-name' => 'img'
 							],
 							[
 								'alt' => 'image alt',
@@ -1699,20 +1740,21 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								'thumbnail' => 'http://thumbnail.jpg',
 								'thumbnail2x' => 'http://thumbnail2x.jpg',
 								'isImage' => true,
-								'item-name' => null
+								'source' => 'src',
+								'item-name' => 'img'
 							]
 						]
 					]
 				],
 				'output' => '<aside class="portable-infobox pi-background">
 						<h2 class="pi-item pi-item-spacing pi-title">Test Title</h2>
-						<div class="pi-media-collection">
+						<div class="pi-media-collection" data-source="src" data-item-name="img">
 							<ul class="pi-media-collection-tabs">
 								<li class="pi-tab-link pi-item-spacing current" data-pi-tab="pi-tab-1">caption</li>
 								<li class="pi-tab-link pi-item-spacing" data-pi-tab="pi-tab-2">caption</li>
 							</ul>
 							<div class="pi-media-collection-tab-content current" id="pi-tab-1">
-								<figure class="pi-item pi-media pi-image">
+								<figure class="pi-item pi-media pi-image" data-source="src" data-item-name="img">
 									<a href="http://image.jpg" class="image image-thumbnail" title="image alt">
 										<img src="http://thumbnail.jpg" srcset="http://thumbnail.jpg 1x, http://thumbnail2x.jpg 2x"
 											class="pi-image-thumbnail" alt="image alt" width="400" height="200"/>
@@ -1720,7 +1762,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 								</figure>
 							</div>
 							<div class="pi-media-collection-tab-content" id="pi-tab-2">
-								<figure class="pi-item pi-media pi-image">
+								<figure class="pi-item pi-media pi-image" data-source="src" data-item-name="img">
 									<a href="http://image.jpg" class="image image-thumbnail" title="image alt">
 										<img src="http://thumbnail.jpg" srcset="http://thumbnail.jpg 1x, http://thumbnail2x.jpg 2x"
 											class="pi-image-thumbnail" alt="image alt" width="400" height="200"/>
@@ -1731,8 +1773,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Simple infobox with title and image collection',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1740,6 +1781,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'title',
 						'data' => [
 							'value' => 'Test Title',
+							'source' => null,
 							'item-name' => null
 						]
 					],
@@ -1751,6 +1793,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'type' => 'header',
 									'data' => [
 										'value' => 'Test Header',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1759,6 +1802,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label',
 										'value' => 'test value',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1767,6 +1811,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label',
 										'value' => 'test value',
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -1794,8 +1839,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with title, collapsible group with header and two key-value pairs',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			],
 			[
 				'input' => [
@@ -1803,6 +1847,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 						'type' => 'title',
 						'data' => [
 							'value' => 'Test Title',
+							'source' => null,
 							'item-name' => null
 						]
 					],
@@ -1814,6 +1859,15 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'type' => 'header',
 									'data' => [
 										'value' => 'Test Header',
+										'item-name' => 'header'
+									]
+								],
+								[
+									'type' => 'data',
+									'data' => [
+										'label' => 'test label',
+										'value' => 'test value',
+										'source' => null,
 										'item-name' => null
 									]
 								],
@@ -1822,14 +1876,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 									'data' => [
 										'label' => 'test label',
 										'value' => 'test value',
-										'item-name' => null
-									]
-								],
-								[
-									'type' => 'data',
-									'data' => [
-										'label' => 'test label',
-										'value' => 'test value',
+										'source' => null,
 										'item-name' => null
 									]
 								]
@@ -1844,7 +1891,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 				'output' => '<aside class="portable-infobox pi-background">
 						<h2 class="pi-item pi-item-spacing pi-title">Test Title</h2>
 						<section class="pi-item pi-group pi-border-color pi-collapse pi-collapse-closed">
-							<h2 class="pi-item pi-header pi-secondary-font pi-item-spacing pi-secondary-background">Test Header</h2>
+							<h2 class="pi-item pi-header pi-secondary-font pi-item-spacing pi-secondary-background" data-item-name="header">Test Header</h2>
 							<div class="pi-item pi-data pi-item-spacing pi-border-color">
 								<h3 class="pi-data-label pi-secondary-font">test label</h3>
 								<div class="pi-data-value pi-font">test value</div>
@@ -1857,8 +1904,7 @@ class PortableInfoboxRenderServiceTest extends MediaWikiTestCase {
 					</aside>',
 				'description' => 'Infobox with title, collapsed group with header and two key-value pairs',
 				'accentColor' => '',
-				'accentColorText' => '',
-				'type' => ''
+				'accentColorText' => ''
 			]
 		];
 	}
diff --git a/tests/phpunit/nodes/NodeDataTest.php b/tests/phpunit/nodes/NodeDataTest.php
index 6007264..7b02c61 100644
--- a/tests/phpunit/nodes/NodeDataTest.php
+++ b/tests/phpunit/nodes/NodeDataTest.php
@@ -834,6 +834,21 @@ class NodeDataTest extends MediaWikiTestCase {
 					]
 				]
 			],
+			[
+				'<data source="test" name="data name"></data>',
+				[ 'test' => 'test' ],
+				[
+					'type' => 'data',
+					'data' => [
+						'value' => 'test',
+						'label' => '',
+						'span' => 1,
+						'layout' => null,
+						'source' => 'test',
+						'item-name' => 'data name'
+					]
+				]
+			]
 		];
 	}
 
diff --git a/tests/phpunit/nodes/NodeGroupTest.php b/tests/phpunit/nodes/NodeGroupTest.php
index dde62ad..f9c3b12 100644
--- a/tests/phpunit/nodes/NodeGroupTest.php
+++ b/tests/phpunit/nodes/NodeGroupTest.php
@@ -368,6 +368,40 @@ class NodeGroupTest extends MediaWikiTestCase {
 					'row-items' => null,
 					'item-name' => null
 				]
+			],
+			[
+				'<group name="g"><header name="h">h</header><data source="d" name="d"/></group>',
+				[ 'd' => 'data' ],
+				[
+					'value' => [
+						[
+							'type' => 'header',
+							'data' => [
+								'value' => 'h',
+								'item-name' => 'h'
+							],
+							'isEmpty' => false,
+							'source' => []
+						],
+						[
+							'type' => 'data',
+							'data' => [
+								'value' => 'data',
+								'label' => '',
+								'span' => 1,
+								'layout' => null,
+								'source' => 'd',
+								'item-name' => 'd'
+							],
+							'isEmpty' => false,
+							'source' => [ 'd' ]
+						]
+					],
+					'layout' => 'default',
+					'collapse' => null,
+					'row-items' => null,
+					'item-name' => 'g'
+				]
 			]
 		];
 	}
diff --git a/tests/phpunit/nodes/NodeHeaderTest.php b/tests/phpunit/nodes/NodeHeaderTest.php
index 121b0de..474faa9 100644
--- a/tests/phpunit/nodes/NodeHeaderTest.php
+++ b/tests/phpunit/nodes/NodeHeaderTest.php
@@ -32,6 +32,10 @@ class NodeHeaderTest extends MediaWikiTestCase {
 			[
 				'<header>kjdflkja<ref>dafkjlsdkfj</ref></header>',
 				[ 'value' => 'kjdflkja<ref>dafkjlsdkfj</ref>', 'item-name' => null ]
+			],
+			[
+				'<header name="headertest">kjdflkja dafkjlsdkfj</header>',
+				[ 'value' => 'kjdflkja dafkjlsdkfj', 'item-name' => 'headertest' ]
 			]
 		];
 	}
diff --git a/tests/phpunit/nodes/NodeMediaTest.php b/tests/phpunit/nodes/NodeMediaTest.php
index 17a9571..9ce5061 100644
--- a/tests/phpunit/nodes/NodeMediaTest.php
+++ b/tests/phpunit/nodes/NodeMediaTest.php
@@ -232,6 +232,22 @@ class NodeMediaTest extends MediaWikiTestCase {
 					'item-name' => null
 				] ]
 			],
+			[
+				'<media source="img" name="img" />',
+				[ 'img' => 'test.jpg' ],
+				MEDIATYPE_BITMAP,
+				[ [
+					'url' => 'http://test.url',
+					'name' => 'Test.jpg',
+					'alt' => 'Test.jpg',
+					'caption' => null,
+					'isImage' => true,
+					'isVideo' => false,
+					'isAudio' => false,
+					'source' => 'img',
+					'item-name' => 'img'
+				] ]
+			],
 			[
 				'<media source="media" />',
 				[ 'media' => 'test.webm' ],
diff --git a/tests/phpunit/nodes/NodeNavigationTest.php b/tests/phpunit/nodes/NodeNavigationTest.php
index 99522b4..f502585 100644
--- a/tests/phpunit/nodes/NodeNavigationTest.php
+++ b/tests/phpunit/nodes/NodeNavigationTest.php
@@ -32,6 +32,10 @@ class NodeNavigationTest extends MediaWikiTestCase {
 			[
 				'<navigation>kjdflkja<ref>dafkjlsdkfj</ref></navigation>',
 				[ 'value' => 'kjdflkja<ref>dafkjlsdkfj</ref>', 'item-name' => null ]
+			],
+			[
+				'<navigation name="ihatetests">kjdflkja dafkjlsdkfj</navigation>',
+				[ 'value' => 'kjdflkja dafkjlsdkfj', 'item-name' => 'ihatetests' ]
 			]
 		];
 	}
diff --git a/tests/phpunit/nodes/NodeTitleTest.php b/tests/phpunit/nodes/NodeTitleTest.php
index 10b4b1d..36b802b 100644
--- a/tests/phpunit/nodes/NodeTitleTest.php
+++ b/tests/phpunit/nodes/NodeTitleTest.php
@@ -75,6 +75,16 @@ class NodeTitleTest extends MediaWikiTestCase {
 				'<title source="test"><format>{{{test}}}%</format></title>',
 				[ 'test' => 0 ],
 				[ 'value' => '{{{test}}}%', 'source' => 'test', 'item-name' => null ]
+			],
+			[
+				'<title source="test" name="nametest" />',
+				[ 'test' => 'abc' ],
+				[ 'value' => 'abc', 'source' => 'test', 'item-name' => 'nametest' ]
+			],
+			[
+				'<title name="nametest"><default>def</default></title>',
+				[],
+				[ 'value' => 'def', 'source' => null, 'item-name' => 'nametest' ]
 			]
 		];
 	}