Add TreeItemSelector test

demos/form-control/tree-item-selector.php

@@ -24,35 +24,50 @@
                         'id' => 502,
                     ],
                     [
-                        'name' => 'Google Pixels',
+                        'name' => 'Google Pixel',
                         'id' => 503,
                     ],
                 ],
             ],
             ['name' => 'Tv', 'id' => 501, 'nodes' => []],
-            ['name' => 'Radio', 'id' => 601, 'nodes' => []],
+            ['name' => 'Radio', 'id' => 601],
         ],
     ],
-    ['name' => 'Cleaner', 'id' => 201, 'nodes' => []],
-    ['name' => 'Appliances', 'id' => 301, 'nodes' => []],
+    ['name' => 'Cleaner', 'id' => 201],
+    ['name' => 'Appliances', 'id' => 301],
 ];
 
+$pathFromIdFx = function (array $items, int $id) use (&$pathFromIdFx): ?string {
+    foreach ($items as $item) {
+        if (($item['id'] ?? false) === $id) {
+            return $item['name'];
+        }
+
+        $itemRes = $pathFromIdFx($item['nodes'] ?? [], $id);
+        if ($itemRes !== null) {
+            return $item['name'] . ' > ' . $itemRes;
+        }
+    }
+
+    return null;
+};
+
 Header::addTo($app, ['Tree item selector']);
 
 $form = Form::addTo($app);
 $control = $form->addControl('tree', [Form\Control\TreeItemSelector::class, 'treeItems' => $items, 'caption' => 'Multiple selection:'], ['type' => 'json']);
 $control->set([201, 301, 503]);
 
-// $control->onItem(function (array $value) use ($app) {
-//    return new JsToast($app->encodeJson($value));
-// });
+$control->onItem(function (array $values) use ($pathFromIdFx, $items) {
+    return new JsToast('Selected: ' . implode(',<br>', array_map(fn ($v) => $pathFromIdFx($items, $v), $values)));
+});
 
 $control = $form->addControl('tree1', [Form\Control\TreeItemSelector::class, 'treeItems' => $items, 'allowMultiple' => false, 'caption' => 'Single selection:']);
-$control->set(502);
+$control->set(503);
 
-// $control->onItem(function (int $value) {
-//    return new JsToast('Received ' . $value);
-// });
+$control->onItem(function (int $value) use ($pathFromIdFx, $items) {
+    return new JsToast('Selected: ' . $pathFromIdFx($items, $value));
+});
 
 $form->onSubmit(function (Form $form) use ($app) {
     $response = [

phpstan.neon.dist

@@ -51,6 +51,9 @@ parameters:
         -
             path: 'demos/form-control/upload.php'
             message: '~^Call to an undefined method Atk4\\Ui\\Form\\Control::onDelete\(\)\.$~'
+        -
+            path: 'demos/form-control/tree-item-selector.php'
+            message: '~^Call to an undefined method Atk4\\Ui\\Form\\Control::onItem\(\)\.$~'
         -
             path: 'demos/form-control/upload.php'
             message: '~^Call to an undefined method Atk4\\Ui\\Form\\Control::clearThumbnail\(\)\.$~'

tests-behat/scroll.feature

@@ -40,3 +40,11 @@ Feature: Dynamic scroll
     Then Toast display should contain text "row clicked: 14"
     When I click using selector "//tr[td[text()='Austria']]//i.icon.bell"
     Then Toast display should contain text "action clicked: 14"
+
+  Scenario: with fixed header
+    Given I am on "interactive/scroll-grid-container.php"
+    Then I should see "Brazil"
+    Then I should not see "Canada"
+    When I click using selector "//table//tr/td[text()='Brazil']"
+    Then I should see "Brazil"
+    Then I should see "Canada"

tests-behat/tree-item-selector.feature

@@ -0,0 +1,26 @@
+Feature: TreeItemSelector
+
+  Scenario: single
+    Given I am on "form-control/tree-item-selector.php"
+    Then I click using selector "(//div.atk-tree-loader)[2]//div[text()='Cleaner']"
+    Then Toast display should contain text "Selected: Cleaner"
+    Then I click using selector "(//div.atk-tree-loader)[2]//div[text()='Cleaner']"
+    Then No toast should be displayed
+    Then I click using selector "(//div.atk-tree-loader)[2]//i.icon.caret.right[../div/div[text()='Electronics']]"
+    Then No toast should be displayed
+    Then I click using selector "(//div.atk-tree-loader)[2]//div[text()='Phone']"
+    Then No toast should be displayed
+
+  Scenario: multiple
+    Then I click using selector "(//div.atk-tree-loader)[1]//div[text()='Cleaner']"
+    Then Toast display should contain text "Appliances"
+    Then I click using selector "(//div.atk-tree-loader)[1]//div[text()='Cleaner']"
+    Then Toast display should contain text "Appliances"
+    Then Toast display should contain text "Cleaner"
+    Then I click using selector "(//div.atk-tree-loader)[1]//i.icon.caret.right[../div/div[text()='Electronics']]"
+    Then No toast should be displayed
+    Then I click using selector "(//div.atk-tree-loader)[1]//div[text()='Phone']"
+    Then Toast display should contain text "Appliances"
+    Then Toast display should contain text "Electronics > Phone > iPhone"
+    Then I click using selector "(//div.atk-tree-loader)[1]//div[text()='Phone']"
+    Then Toast display should contain text "Appliances"