Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix click event bubbling in Table::onRowClick() #1655

Merged
merged 27 commits into from
Sep 7, 2022
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
add test
mvorisek committed Sep 7, 2022
commit 5873e386b47598eeb72a1cb8af7e159a672d7ed8
10 changes: 8 additions & 2 deletions demos/_unit-test/grid-rowclick.php
Original file line number Diff line number Diff line change
@@ -5,17 +5,23 @@
namespace Atk4\Ui\Demos;

use Atk4\Ui\Grid;
use Atk4\Ui\JsExpression;
use Atk4\Ui\JsFunction;
use Atk4\Ui\JsToast;
use Atk4\Ui\Table;

/** @var \Atk4\Ui\App $app */
require_once __DIR__ . '/../init-app.php';

$model = new Country($app->db);
$grid = Grid::addTo($app);
$grid = Grid::addTo($app, ['name' => 'grid']);
$grid->setModel($model);

$grid->addDecorator($model->fieldName()->name, [Table\Column\Link::class, 'url' => '#no_reload']);
$grid->addDecorator($model->fieldName()->name, [Table\Column\Link::class, 'url' => 'xxx']);
$grid->table->js(true)->find('a')->on(
'click',
new JsFunction([], [new JsExpression('window.location.href = \'#test\'; return false;')])
);

$grid->table->onRowClick(function () {
return new JsToast(['message' => 'Clicked on row']);
2 changes: 1 addition & 1 deletion src/Table.php
Original file line number Diff line number Diff line change
@@ -510,7 +510,7 @@ public function onRowClick($action): void
$this->js(true)->find('tbody')->css('cursor', 'pointer');

// do not bubble row click event if click stems from row content like checkboxes
$this->js(true)->find('a, .checkbox, .atk4-norowclick')->on(
$this->js(true)->find('a, button, input, select, textarea, .atk4-norowclick')->on(
'click',
new JsFunction(['event'], [new JsExpression('event.stopPropagation()')])
);
8 changes: 6 additions & 2 deletions tests-behat/grid.feature
Original file line number Diff line number Diff line change
@@ -17,5 +17,9 @@ Feature: Grid
Then I should see "United Kingdom"

Scenario: Checkbox click event must not bubble to row click
Given I am on "_unit-test/grid-rowclick.php#no_reload"
Then page url should contain '/_unit-test/grid-rowclick.php#no_reload'
Given I am on "_unit-test/grid-rowclick.php#xxx"
When I click using selector "xpath(//div[@id='grid']//tr[2]//td[2])"
Then Toast display should contain text "Clicked on row"
When I click using selector "xpath(//div[@id='grid']//tr[2]//input[@type='checkbox'])"
When I click using selector "xpath(//div[@id='grid']//tr[2]//a)"
Then page url should contain '/_unit-test/grid-rowclick.php#test'