
| Current Path : /var/www/html/ift/web/core/tests/Drupal/FunctionalJavascriptTests/TableDrag/ |
Linux ift1.ift-informatik.de 5.4.0-216-generic #236-Ubuntu SMP Fri Apr 11 19:53:21 UTC 2025 x86_64 |
| Current File : /var/www/html/ift/web/core/tests/Drupal/FunctionalJavascriptTests/TableDrag/TableDragTest.php |
<?php
namespace Drupal\FunctionalJavascriptTests\TableDrag;
use Behat\Mink\Element\NodeElement;
use Behat\Mink\Exception\ExpectationException;
use Drupal\FunctionalJavascriptTests\WebDriverTestBase;
/**
* Tests draggable table.
*
* @group javascript
*/
class TableDragTest extends WebDriverTestBase {
/**
* Class used to verify that dragging operations are in execution.
*/
const DRAGGING_CSS_CLASS = 'tabledrag-test-dragging';
/**
* {@inheritdoc}
*/
protected static $modules = ['tabledrag_test'];
/**
* {@inheritdoc}
*/
protected $defaultTheme = 'stark';
/**
* The state service.
*
* @var \Drupal\Core\State\StateInterface
*/
protected $state;
/**
* {@inheritdoc}
*/
protected function setUp() {
parent::setUp();
$this->state = $this->container->get('state');
}
/**
* Tests row weight switch.
*/
public function testRowWeightSwitch() {
$this->state->set('tabledrag_test_table', array_flip(range(1, 3)));
$this->drupalGet('tabledrag_test');
$session = $this->getSession();
$page = $session->getPage();
$weight_select1 = $page->findField("table[1][weight]");
$weight_select2 = $page->findField("table[2][weight]");
$weight_select3 = $page->findField("table[3][weight]");
// Check that rows weight selects are hidden.
$this->assertFalse($weight_select1->isVisible());
$this->assertFalse($weight_select2->isVisible());
$this->assertFalse($weight_select3->isVisible());
// Toggle row weight selects as visible.
$this->findWeightsToggle('Show row weights')->click();
// Check that rows weight selects are visible.
$this->assertTrue($weight_select1->isVisible());
$this->assertTrue($weight_select2->isVisible());
$this->assertTrue($weight_select3->isVisible());
// Toggle row weight selects back to hidden.
$this->findWeightsToggle('Hide row weights')->click();
// Check that rows weight selects are hidden again.
$this->assertFalse($weight_select1->isVisible());
$this->assertFalse($weight_select2->isVisible());
$this->assertFalse($weight_select3->isVisible());
}
/**
* Tests draggable table drag'n'drop.
*/
public function testDragAndDrop() {
$this->state->set('tabledrag_test_table', array_flip(range(1, 3)));
$this->drupalGet('tabledrag_test');
$session = $this->getSession();
$page = $session->getPage();
$weight_select1 = $page->findField("table[1][weight]");
$weight_select2 = $page->findField("table[2][weight]");
$weight_select3 = $page->findField("table[3][weight]");
// Check that initially the rows are in the correct order.
$this->assertOrder(['Row with id 1', 'Row with id 2', 'Row with id 3']);
// Check that the 'unsaved changes' text is not present in the message area.
$this->assertSession()->pageTextNotContains('You have unsaved changes.');
$row1 = $this->findRowById(1)->find('css', 'a.tabledrag-handle');
$row2 = $this->findRowById(2)->find('css', 'a.tabledrag-handle');
$row3 = $this->findRowById(3)->find('css', 'a.tabledrag-handle');
// Drag row1 over row2.
$row1->dragTo($row2);
// Check that the 'unsaved changes' text was added in the message area.
$this->assertSession()->waitForText('You have unsaved changes.');
// Check that row1 and row2 were swapped.
$this->assertOrder(['Row with id 2', 'Row with id 1', 'Row with id 3']);
// Check that weights were changed.
$this->assertGreaterThan($weight_select2->getValue(), $weight_select1->getValue());
$this->assertGreaterThan($weight_select2->getValue(), $weight_select3->getValue());
$this->assertGreaterThan($weight_select1->getValue(), $weight_select3->getValue());
// Now move the last row (row3) in the second position. row1 should go last.
$row3->dragTo($row1);
// Check that the order is: row2, row3 and row1.
$this->assertOrder(['Row with id 2', 'Row with id 3', 'Row with id 1']);
}
/**
* Tests accessibility through keyboard of the tabledrag functionality.
*/
public function testKeyboardAccessibility() {
$this->state->set('tabledrag_test_table', array_flip(range(1, 5)));
$expected_table = [
['id' => 1, 'weight' => 0, 'parent' => '', 'indentation' => 0, 'changed' => FALSE],
['id' => 2, 'weight' => 0, 'parent' => '', 'indentation' => 0, 'changed' => FALSE],
['id' => 3, 'weight' => 0, 'parent' => '', 'indentation' => 0, 'changed' => FALSE],
['id' => 4, 'weight' => 0, 'parent' => '', 'indentation' => 0, 'changed' => FALSE],
['id' => 5, 'weight' => 0, 'parent' => '', 'indentation' => 0, 'changed' => FALSE],
];
$this->drupalGet('tabledrag_test');
$this->assertDraggableTable($expected_table);
// Nest the row with id 2 as child of row 1.
$this->moveRowWithKeyboard($this->findRowById(2), 'right');
$expected_table[1] = ['id' => 2, 'weight' => -10, 'parent' => 1, 'indentation' => 1, 'changed' => TRUE];
$this->assertDraggableTable($expected_table);
// Nest the row with id 3 as child of row 1.
$this->moveRowWithKeyboard($this->findRowById(3), 'right');
$expected_table[2] = ['id' => 3, 'weight' => -9, 'parent' => 1, 'indentation' => 1, 'changed' => TRUE];
$this->assertDraggableTable($expected_table);
// Nest the row with id 3 as child of row 2.
$this->moveRowWithKeyboard($this->findRowById(3), 'right');
$expected_table[2] = ['id' => 3, 'weight' => -10, 'parent' => 2, 'indentation' => 2, 'changed' => TRUE];
$this->assertDraggableTable($expected_table);
// Nesting should be allowed to maximum level 2.
$this->moveRowWithKeyboard($this->findRowById(4), 'right', 4);
$expected_table[3] = ['id' => 4, 'weight' => -9, 'parent' => 2, 'indentation' => 2, 'changed' => TRUE];
$this->assertDraggableTable($expected_table);
// Re-order children of row 1.
$this->moveRowWithKeyboard($this->findRowById(4), 'up');
$expected_table[2] = ['id' => 4, 'weight' => -10, 'parent' => 2, 'indentation' => 2, 'changed' => TRUE];
$expected_table[3] = ['id' => 3, 'weight' => -9, 'parent' => 2, 'indentation' => 2, 'changed' => TRUE];
$this->assertDraggableTable($expected_table);
// Move back the row 3 to the 1st level.
$this->moveRowWithKeyboard($this->findRowById(3), 'left');
$expected_table[3] = ['id' => 3, 'weight' => -9, 'parent' => 1, 'indentation' => 1, 'changed' => TRUE];
$this->assertDraggableTable($expected_table);
$this->moveRowWithKeyboard($this->findRowById(3), 'left');
$expected_table[0] = ['id' => 1, 'weight' => -10, 'parent' => '', 'indentation' => 0, 'changed' => FALSE];
$expected_table[3] = ['id' => 3, 'weight' => -9, 'parent' => '', 'indentation' => 0, 'changed' => TRUE];
$expected_table[4] = ['id' => 5, 'weight' => -8, 'parent' => '', 'indentation' => 0, 'changed' => FALSE];
$this->assertDraggableTable($expected_table);
// Move row 3 to the last position.
$this->moveRowWithKeyboard($this->findRowById(3), 'down');
$expected_table[3] = ['id' => 5, 'weight' => -9, 'parent' => '', 'indentation' => 0, 'changed' => FALSE];
$expected_table[4] = ['id' => 3, 'weight' => -8, 'parent' => '', 'indentation' => 0, 'changed' => TRUE];
$this->assertDraggableTable($expected_table);
// Nothing happens when trying to move the last row further down.
$this->moveRowWithKeyboard($this->findRowById(3), 'down');
$this->assertDraggableTable($expected_table);
// Nest row 3 under 5. The max depth allowed should be 1.
$this->moveRowWithKeyboard($this->findRowById(3), 'right', 3);
$expected_table[4] = ['id' => 3, 'weight' => -10, 'parent' => 5, 'indentation' => 1, 'changed' => TRUE];
$this->assertDraggableTable($expected_table);
// The first row of the table cannot be nested.
$this->moveRowWithKeyboard($this->findRowById(1), 'right');
$this->assertDraggableTable($expected_table);
// Move a row which has nested children. The children should move with it,
// with nesting preserved. Swap the order of the top-level rows by moving
// row 1 to after row 3.
$this->moveRowWithKeyboard($this->findRowById(1), 'down', 2);
$expected_table[0] = ['id' => 5, 'weight' => -10, 'parent' => '', 'indentation' => 0, 'changed' => FALSE];
$expected_table[3] = $expected_table[1];
$expected_table[1] = $expected_table[4];
$expected_table[4] = $expected_table[2];
$expected_table[2] = ['id' => 1, 'weight' => -9, 'parent' => '', 'indentation' => 0, 'changed' => TRUE];
$this->assertDraggableTable($expected_table);
}
/**
* Tests the root and leaf behaviors for rows.
*/
public function testRootLeafDraggableRowsWithKeyboard() {
$this->state->set('tabledrag_test_table', [
1 => [],
2 => ['parent' => 1, 'depth' => 1, 'classes' => ['tabledrag-leaf']],
3 => ['parent' => 1, 'depth' => 1],
4 => [],
5 => ['classes' => ['tabledrag-root']],
]);
$this->drupalGet('tabledrag_test');
$expected_table = [
['id' => 1, 'weight' => 0, 'parent' => '', 'indentation' => 0, 'changed' => FALSE],
['id' => 2, 'weight' => 0, 'parent' => 1, 'indentation' => 1, 'changed' => FALSE],
['id' => 3, 'weight' => 0, 'parent' => 1, 'indentation' => 1, 'changed' => FALSE],
['id' => 4, 'weight' => 0, 'parent' => '', 'indentation' => 0, 'changed' => FALSE],
['id' => 5, 'weight' => 0, 'parent' => '', 'indentation' => 0, 'changed' => FALSE],
];
$this->assertDraggableTable($expected_table);
// Rows marked as root cannot be moved as children of another row.
$this->moveRowWithKeyboard($this->findRowById(5), 'right');
$this->assertDraggableTable($expected_table);
// Rows marked as leaf cannot have children. Trying to move the row #3
// as child of #2 should have no results.
$this->moveRowWithKeyboard($this->findRowById(3), 'right');
$this->assertDraggableTable($expected_table);
// Leaf can be still swapped and moved to first level.
$this->moveRowWithKeyboard($this->findRowById(2), 'down');
$this->moveRowWithKeyboard($this->findRowById(2), 'left');
$expected_table[0]['weight'] = -10;
$expected_table[1]['id'] = 3;
$expected_table[1]['weight'] = -10;
$expected_table[2] = ['id' => 2, 'weight' => -9, 'parent' => '', 'indentation' => 0, 'changed' => TRUE];
$expected_table[3]['weight'] = -8;
$expected_table[4]['weight'] = -7;
$this->assertDraggableTable($expected_table);
// Root rows can have children.
$this->moveRowWithKeyboard($this->findRowById(4), 'down');
$this->moveRowWithKeyboard($this->findRowById(4), 'right');
$expected_table[3]['id'] = 5;
$expected_table[4] = ['id' => 4, 'weight' => -10, 'parent' => 5, 'indentation' => 1, 'changed' => TRUE];
$this->assertDraggableTable($expected_table);
}
/**
* Tests the warning that appears upon making changes to a tabledrag table.
*/
public function testTableDragChangedWarning() {
$this->drupalGet('tabledrag_test');
// By default no text is visible.
$this->assertSession()->pageTextNotContains('You have unsaved changes.');
// Try to make a non-allowed action, like moving further down the last row.
// No changes happen, so no message should be shown.
$this->moveRowWithKeyboard($this->findRowById(5), 'down');
$this->assertSession()->pageTextNotContains('You have unsaved changes.');
// Make a change. The message will appear.
$this->moveRowWithKeyboard($this->findRowById(5), 'right');
$this->assertSession()->pageTextContainsOnce('You have unsaved changes.');
// Make another change, the text will stay visible and appear only once.
$this->moveRowWithKeyboard($this->findRowById(2), 'up');
$this->assertSession()->pageTextContainsOnce('You have unsaved changes.');
}
/**
* Asserts that several pieces of markup are in a given order in the page.
*
* @param string[] $items
* An ordered list of strings.
*
* @throws \Behat\Mink\Exception\ExpectationException
* When any of the given string is not found.
*
* @todo Remove this and use the WebAssert method when #2817657 is done.
*/
protected function assertOrder(array $items) {
$session = $this->getSession();
$text = $session->getPage()->getHtml();
$strings = [];
foreach ($items as $item) {
if (($pos = strpos($text, $item)) === FALSE) {
throw new ExpectationException("Cannot find '$item' in the page", $session->getDriver());
}
$strings[$pos] = $item;
}
ksort($strings);
$this->assertSame($items, array_values($strings), "Strings found on the page but incorrectly ordered.");
}
/**
* Asserts the whole structure of the draggable test table.
*
* @param array $structure
* The table structure. Each entry represents a row and consists of:
* - id: the expected value for the ID hidden field.
* - weight: the expected row weight.
* - parent: the expected parent ID for the row.
* - indentation: how many indents the row should have.
* - changed: whether or not the row should have been marked as changed.
*/
protected function assertDraggableTable(array $structure) {
$rows = $this->getSession()->getPage()->findAll('xpath', '//table[@id="tabledrag-test-table"]/tbody/tr');
$this->assertSession()->elementsCount('xpath', '//table[@id="tabledrag-test-table"]/tbody/tr', count($structure));
foreach ($structure as $delta => $expected) {
$this->assertTableRow($rows[$delta], $expected['id'], $expected['weight'], $expected['parent'], $expected['indentation'], $expected['changed']);
}
}
/**
* Asserts the values of a draggable row.
*
* @param \Behat\Mink\Element\NodeElement $row
* The row element to assert.
* @param string $id
* The expected value for the ID hidden input of the row.
* @param int $weight
* The expected weight of the row.
* @param string $parent
* The expected parent ID.
* @param int $indentation
* The expected indentation of the row.
* @param bool $changed
* Whether or not the row should have been marked as changed.
*/
protected function assertTableRow(NodeElement $row, $id, $weight, $parent = '', $indentation = 0, $changed = FALSE) {
// Assert that the row position is correct by checking that the id
// corresponds.
$this->assertSession()->hiddenFieldValueEquals("table[$id][id]", $id, $row);
$this->assertSession()->hiddenFieldValueEquals("table[$id][parent]", $parent, $row);
$this->assertSession()->fieldValueEquals("table[$id][weight]", $weight, $row);
$this->assertSession()->elementsCount('css', '.js-indentation.indentation', $indentation, $row);
// A row is marked as changed when the related markup is present.
$this->assertSession()->elementsCount('css', 'abbr.tabledrag-changed', (int) $changed, $row);
}
/**
* Finds a row in the test table by the row ID.
*
* @param string $id
* The ID of the row.
*
* @return \Behat\Mink\Element\NodeElement
* The row element.
*/
protected function findRowById($id) {
$xpath = "//table[@id='tabledrag-test-table']/tbody/tr[.//input[@name='table[$id][id]']]";
$row = $this->getSession()->getPage()->find('xpath', $xpath);
$this->assertNotEmpty($row);
return $row;
}
/**
* Finds the show/hide weight toggle element.
*
* @param string $expected_text
* The expected text on the element.
*
* @return \Behat\Mink\Element\NodeElement
* The toggle element.
*/
protected function findWeightsToggle($expected_text) {
$toggle = $this->getSession()->getPage()->findButton($expected_text);
$this->assertNotEmpty($toggle);
return $toggle;
}
/**
* Moves a row through the keyboard.
*
* @param \Behat\Mink\Element\NodeElement $row
* The row to move.
* @param string $arrow
* The arrow button to use to move the row. Either one of 'left', 'right',
* 'up' or 'down'.
* @param int $repeat
* (optional) How many times to press the arrow button. Defaults to 1.
*/
protected function moveRowWithKeyboard(NodeElement $row, $arrow, $repeat = 1) {
$keys = [
'left' => 37,
'right' => 39,
'up' => 38,
'down' => 40,
];
if (!isset($keys[$arrow])) {
throw new \InvalidArgumentException('The arrow parameter must be one of "left", "right", "up" or "down".');
}
$key = $keys[$arrow];
$handle = $row->find('css', 'a.tabledrag-handle');
$handle->focus();
for ($i = 0; $i < $repeat; $i++) {
$this->markRowHandleForDragging($handle);
$handle->keyDown($key);
$handle->keyUp($key);
$this->waitUntilDraggingCompleted($handle);
}
$handle->blur();
}
/**
* Marks a row handle for dragging.
*
* The handle is marked by adding a css class that is removed by an helper
* js library once the dragging is over.
*
* @param \Behat\Mink\Element\NodeElement $handle
* The draggable row handle element.
*
* @throws \Exception
* Thrown when the class is not added successfully to the handle.
*/
protected function markRowHandleForDragging(NodeElement $handle) {
$class = self::DRAGGING_CSS_CLASS;
$script = <<<JS
document.evaluate("{$handle->getXpath()}", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null)
.singleNodeValue.classList.add('{$class}');
JS;
$this->getSession()->executeScript($script);
$has_class = $this->getSession()->getPage()->waitFor(1, function () use ($handle, $class) {
return $handle->hasClass($class);
});
if (!$has_class) {
throw new \Exception(sprintf('Dragging css class was not added on handle "%s".', $handle->getXpath()));
}
}
/**
* Waits until the dragging operations are finished on a row handle.
*
* @param \Behat\Mink\Element\NodeElement $handle
* The draggable row handle element.
*
* @throws \Exception
* Thrown when the dragging operations are not completed on time.
*/
protected function waitUntilDraggingCompleted(NodeElement $handle) {
$class_removed = $this->getSession()->getPage()->waitFor(1, function () use ($handle) {
return !$handle->hasClass($this::DRAGGING_CSS_CLASS);
});
if (!$class_removed) {
throw new \Exception(sprintf('Dragging operations did not complete on time on handle %s', $handle->getXpath()));
}
}
}