Bind keys of kvp data using _key parameter (#143)

PhpGt · May 24, 2020 · 151ed5f · 151ed5f
1 parent eaef00d
commit 151ed5f
Show file tree

Hide file tree

Showing 4 changed files with 123 additions and 59 deletions.
diff --git a/composer.lock b/composer.lock
diff --git a/src/Bindable.php b/src/Bindable.php
@@ -137,6 +137,7 @@ public function bindList(
 
 			if(is_string($key)) {
 				$insertedT->bindValue($key);
+				$insertedT->bindKeyValue("_key", $key);
 			}
 
 			if($this->isBindableValue($data)) {

diff --git a/test/unit/BindableTest.php b/test/unit/BindableTest.php
@@ -1,5 +1,4 @@
 <?php /** @noinspection PhpComposerExtensionStubsInspection */
-
 namespace Gt\DomTemplate\Test;
 
 use EmptyIterator;
@@ -659,4 +658,27 @@ public function testBindListEmptySetsInnerHtmlToEmpty() {
 		$ul->bindList([]);
 		self::assertEquals("", $ul->innerHTML);
 	}
+
+	public function testBindKvpList() {
+		$kvpData = [
+			"Name" => "Alan",
+			"Occupation" => "Cryptanalyst",
+			"Place of work" => "Bletchley Park",
+		];
+
+		$document = new HTMLDocument(Helper::HTML_KVP_LIST);
+		$document->extractTemplates();
+		$ul = $document->getElementById("list");
+		$ul->bindList($kvpData);
+
+		$expectedKeys = array_keys($kvpData);
+		$expectedValues = array_values($kvpData);
+		foreach($ul->querySelectorAll("li") as $i => $li) {
+			$keySpan = $li->querySelector(".key span");
+			$valueSpan = $li->querySelector(".value span");
+
+			self::assertEquals($expectedKeys[$i], $keySpan->textContent);
+			self::assertEquals($expectedValues[$i], $valueSpan->textContent);
+		}
+	}
 }
diff --git a/test/unit/Helper/Helper.php b/test/unit/Helper/Helper.php
@@ -567,6 +567,25 @@ class Helper {
 		]
 	];
 
+	const HTML_KVP_LIST = <<<HTML
+<!doctype html>
+<meta charset="utf-8" />
+<title>KVP list test</title>
+<main>
+	<ul id="list">
+		<li data-template>
+			<p class="key">
+				KEY: <span data-bind:text="_key">Key goes here</span>
+			</p>
+			<p class="value">
+				VALUE: <span data-bind:text>Value goes here</span>			
+			</p>
+		</li>
+	</ul>
+</main>
+HTML;
+
+
 	const HTML_SHOP = <<<HTML
 <!doctype html>
 <meta charset="utf-8" />