Skip to content
Snippets Groups Projects
Unverified Commit fdb1fa9f authored by Lauri Timmanee's avatar Lauri Timmanee
Browse files

Issue #994360 by DuaelFr, gapple, dww, andypost, lauriii, emosbaugh,... 

Issue #994360 by DuaelFr, gapple, dww, andypost, lauriii, emosbaugh, timisoreana, Cyberwolf, esclapes, damien_vancouver, longwave, catch: #states cannot check/uncheck checkboxes elements
parent 312e5891
No related branches found
No related tags found
26 merge requests!54479.5.x SF update,!5014Issue #3071143: Table Render Array Example Is Incorrect,!4868Issue #1428520: Improve menu parent link selection,!4289Issue #1344552 by marcingy, Niklas Fiekas, Ravi.J, aleevas, Eduardo Morales...,!4114Issue #2707291: Disable body-level scrolling when a dialog is open as a modal,!4100Issue #3249600: Add support for PHP 8.1 Enums as allowed values for list_* data types,!2378Issue #2875033: Optimize joins and table selection in SQL entity query implementation,!2334Issue #3228209: Add hasRole() method to AccountInterface,!2062Issue #3246454: Add weekly granularity to views date sort,!1591Issue #3199697: Add JSON:API Translation experimental module,!1484Exposed filters get values from URL when Ajax is on,!1255Issue #3238922: Refactor (if feasible) uses of the jQuery serialize function to use vanillaJS,!1162Issue #3100350: Unable to save '/' root path alias,!1105Issue #3025039: New non translatable field on translatable content throws error,!1073issue #3191727: Focus states on mobile second level navigation items fixed,!10223132456: Fix issue where views instances are emptied before an ajax request is complete,!925Issue #2339235: Remove taxonomy hard dependency on node module,!877Issue #2708101: Default value for link text is not saved,!872Draft: Issue #3221319: Race condition when creating menu links and editing content deletes menu links,!844Resolve #3036010 "Updaters",!617Issue #3043725: Provide a Entity Handler for user cancelation,!579Issue #2230909: Simple decimals fail to pass validation,!560Move callback classRemove outside of the loop,!555Issue #3202493,!485Sets the autocomplete attribute for username/password input field on login form.,!30Issue #3182188: Updates composer usage to point at ./vendor/bin/composer
Hide whitespace changes
Inline Side-by-side
core/misc/states.js
+ 5
− 2
View file @ fdb1fa9f
......@@ -683,7 +683,6 @@
// element monitoring itself.
if (e.trigger) {
$(e.target)
.prop('disabled', e.value)
.closest('.js-form-item, .js-form-submit, .js-form-wrapper')
.toggleClass('form-disabled', e.value)
.find('select, input, textarea')
......@@ -723,7 +722,11 @@
$document.on('state:checked', (e) => {
if (e.trigger) {
$(e.target).prop('checked', e.value).trigger('change');
$(e.target)
.closest('.js-form-item, .js-form-wrapper')
.find('input')
.prop('checked', e.value)
.trigger('change');
}
});
......
core/modules/system/tests/modules/form_test/src/Form/JavascriptStatesForm.php
+ 117
− 0
View file @ fdb1fa9f
......@@ -180,6 +180,123 @@ public function buildForm(array $form, FormStateInterface $form_state) {
],
],
];
$form['checkboxes_all_checked_when_checkbox_trigger_checked'] = [
'#type' => 'checkboxes',
'#title' => 'Checkboxes: all checked when checkbox trigger checked',
'#options' => [
'value1' => 'Value 1',
'value2' => 'Value 2',
'value3' => 'Value 3',
],
'#states' => [
'checked' => [
':input[name="checkbox_trigger"]' => ['checked' => TRUE],
],
],
];
$form['checkboxes_some_checked_when_checkbox_trigger_checked'] = [
'#type' => 'checkboxes',
'#title' => 'Checkboxes: some checked when checkbox trigger checked',
'#options' => [
'value1' => 'Value 1',
'value2' => 'Value 2',
'value3' => 'Value 3',
],
'value1' => [
'#states' => [
'checked' => [
':input[name="checkbox_trigger"]' => ['checked' => TRUE],
],
],
],
'value3' => [
'#states' => [
'checked' => [
':input[name="checkbox_trigger"]' => ['checked' => TRUE],
],
],
],
];
$form['checkboxes_all_disabled_when_checkbox_trigger_checked'] = [
'#type' => 'checkboxes',
'#title' => 'Checkboxes: all disabled when checkbox trigger checked',
'#options' => [
'value1' => 'Value 1',
'value2' => 'Value 2',
'value3' => 'Value 3',
],
'#states' => [
'disabled' => [
':input[name="checkbox_trigger"]' => ['checked' => TRUE],
],
],
];
$form['checkboxes_some_disabled_when_checkbox_trigger_checked'] = [
'#type' => 'checkboxes',
'#title' => 'Checkboxes: some disabled when checkbox trigger checked',
'#options' => [
'value1' => 'Value 1',
'value2' => 'Value 2',
'value3' => 'Value 3',
],
'value1' => [
'#states' => [
'disabled' => [
':input[name="checkbox_trigger"]' => ['checked' => TRUE],
],
],
],
'value3' => [
'#states' => [
'disabled' => [
':input[name="checkbox_trigger"]' => ['checked' => TRUE],
],
],
],
];
$form['radios_checked_when_checkbox_trigger_checked'] = [
'#type' => 'radios',
'#title' => 'Radios checked when checkbox trigger checked',
'#options' => [
'value1' => 'Value 1',
'value2' => 'Value 2',
],
'value1' => [
'#states' => [
'checked' => [
':input[name="checkbox_trigger"]' => ['checked' => TRUE],
],
],
],
];
$form['radios_all_disabled_when_checkbox_trigger_checked'] = [
'#type' => 'radios',
'#title' => 'Radios: all disabled when checkbox trigger checked',
'#options' => [
'value1' => 'Value 1',
'value2' => 'Value 2',
],
'#states' => [
'disabled' => [
':input[name="checkbox_trigger"]' => ['checked' => TRUE],
],
],
];
$form['radios_some_disabled_when_checkbox_trigger_checked'] = [
'#type' => 'radios',
'#title' => 'Radios: some disabled when checkbox trigger checked',
'#options' => [
'value1' => 'Value 1',
'value2' => 'Value 2',
],
'value1' => [
'#states' => [
'disabled' => [
':input[name="checkbox_trigger"]' => ['checked' => TRUE],
],
],
],
];
// Checkboxes trigger.
$form['textfield_visible_when_checkboxes_trigger_value2_checked'] = [
......
core/tests/Drupal/FunctionalJavascriptTests/Core/Form/JavascriptStatesTest.php
+ 126
− 1
View file @ fdb1fa9f
......@@ -8,6 +8,11 @@
/**
* Tests the state of elements based on another elements.
*
* The form being tested is JavascriptStatesForm provided by the 'form_test'
* module under 'system' (core/modules/system/tests/module/form_test).
*
* @see Drupal\form_test\Form\JavascriptStatesForm
*
* @group javascript
*/
class JavascriptStatesTest extends WebDriverTestBase {
......@@ -25,7 +30,7 @@ class JavascriptStatesTest extends WebDriverTestBase {
/**
* {@inheritdoc}
*/
protected function setUp():void {
protected function setUp(): void {
parent::setUp();
// Add text formats.
$filtered_html_format = FilterFormat::create([
......@@ -94,6 +99,53 @@ protected function doCheckboxTriggerTests() {
$text_format_invisible_format = $page->findField('text_format_invisible_when_checkbox_trigger_checked[format]');
$this->assertNotEmpty($text_format_invisible_format);
$checkboxes_all_checked_element_value1 = $page->findField('checkboxes_all_checked_when_checkbox_trigger_checked[value1]');
$this->assertNotEmpty($checkboxes_all_checked_element_value1);
$checkboxes_all_checked_element_value2 = $page->findField('checkboxes_all_checked_when_checkbox_trigger_checked[value2]');
$this->assertNotEmpty($checkboxes_all_checked_element_value2);
$checkboxes_all_checked_element_value3 = $page->findField('checkboxes_all_checked_when_checkbox_trigger_checked[value3]');
$this->assertNotEmpty($checkboxes_all_checked_element_value3);
$checkboxes_some_checked_element_value1 = $page->findField('checkboxes_some_checked_when_checkbox_trigger_checked[value1]');
$this->assertNotEmpty($checkboxes_some_checked_element_value1);
$checkboxes_some_checked_element_value2 = $page->findField('checkboxes_some_checked_when_checkbox_trigger_checked[value2]');
$this->assertNotEmpty($checkboxes_some_checked_element_value2);
$checkboxes_some_checked_element_value3 = $page->findField('checkboxes_some_checked_when_checkbox_trigger_checked[value3]');
$this->assertNotEmpty($checkboxes_some_checked_element_value3);
$checkboxes_all_disabled_element_value1 = $page->findField('checkboxes_all_disabled_when_checkbox_trigger_checked[value1]');
$this->assertNotEmpty($checkboxes_all_disabled_element_value1);
$checkboxes_all_disabled_element_value2 = $page->findField('checkboxes_all_disabled_when_checkbox_trigger_checked[value2]');
$this->assertNotEmpty($checkboxes_all_disabled_element_value2);
$checkboxes_all_disabled_element_value3 = $page->findField('checkboxes_all_disabled_when_checkbox_trigger_checked[value3]');
$this->assertNotEmpty($checkboxes_all_disabled_element_value3);
$checkboxes_some_disabled_element_value1 = $page->findField('checkboxes_some_disabled_when_checkbox_trigger_checked[value1]');
$this->assertNotEmpty($checkboxes_some_disabled_element_value1);
$checkboxes_some_disabled_element_value2 = $page->findField('checkboxes_some_disabled_when_checkbox_trigger_checked[value2]');
$this->assertNotEmpty($checkboxes_some_disabled_element_value2);
$checkboxes_some_disabled_element_value3 = $page->findField('checkboxes_some_disabled_when_checkbox_trigger_checked[value3]');
$radios_checked_element = $page->findField('radios_checked_when_checkbox_trigger_checked');
$this->assertNotEmpty($radios_checked_element);
// We want to select the specific radio buttons, not the whole radios field itself.
$radios_all_disabled_value1 = $this->xpath('//input[@name=:name][@value=:value]', [':name' => 'radios_all_disabled_when_checkbox_trigger_checked', ':value' => 'value1']);
$this->assertCount(1, $radios_all_disabled_value1);
// We want to access the radio button directly for the rest of the test, so
// take it out of the array we got back from xpath().
$radios_all_disabled_value1 = reset($radios_all_disabled_value1);
$radios_all_disabled_value2 = $this->xpath('//input[@name=:name][@value=:value]', [':name' => 'radios_all_disabled_when_checkbox_trigger_checked', ':value' => 'value2']);
$this->assertCount(1, $radios_all_disabled_value2);
$radios_all_disabled_value2 = reset($radios_all_disabled_value2);
$radios_some_disabled_value1 = $this->xpath('//input[@name=:name][@value=:value]', [':name' => 'radios_some_disabled_when_checkbox_trigger_checked', ':value' => 'value1']);
$this->assertCount(1, $radios_some_disabled_value1);
$radios_some_disabled_value1 = reset($radios_some_disabled_value1);
$radios_some_disabled_value2 = $this->xpath('//input[@name=:name][@value=:value]', [':name' => 'radios_some_disabled_when_checkbox_trigger_checked', ':value' => 'value2']);
$this->assertCount(1, $radios_some_disabled_value2);
$radios_some_disabled_value2 = reset($radios_some_disabled_value2);
// Verify initial state.
$this->assertTrue($textfield_invisible_element->isVisible());
$this->assertFalse($details->hasAttribute('open'));
......@@ -104,6 +156,24 @@ protected function doCheckboxTriggerTests() {
$this->assertFalse($checkbox_visible_element->isVisible());
$this->assertTrue($text_format_invisible_value->isVisible());
$this->assertTrue($text_format_invisible_format->isVisible());
$this->assertFalse($checkboxes_all_checked_element_value1->isChecked());
$this->assertFalse($checkboxes_all_checked_element_value2->isChecked());
$this->assertFalse($checkboxes_all_checked_element_value3->isChecked());
$this->assertFalse($checkboxes_some_checked_element_value1->isChecked());
$this->assertFalse($checkboxes_some_checked_element_value2->isChecked());
$this->assertFalse($checkboxes_some_checked_element_value3->isChecked());
$this->assertFalse($checkboxes_all_disabled_element_value1->hasAttribute('disabled'));
$this->assertFalse($checkboxes_all_disabled_element_value2->hasAttribute('disabled'));
$this->assertFalse($checkboxes_all_disabled_element_value3->hasAttribute('disabled'));
$this->assertFalse($checkboxes_some_disabled_element_value1->hasAttribute('disabled'));
$this->assertFalse($checkboxes_some_disabled_element_value2->hasAttribute('disabled'));
$this->assertFalse($checkboxes_some_disabled_element_value3->hasAttribute('disabled'));
$this->assertFalse($radios_checked_element->isChecked());
$this->assertEquals(NULL, $radios_checked_element->getValue());
$this->assertFalse($radios_all_disabled_value1->hasAttribute('disabled'));
$this->assertFalse($radios_all_disabled_value2->hasAttribute('disabled'));
$this->assertFalse($radios_some_disabled_value1->hasAttribute('disabled'));
$this->assertFalse($radios_some_disabled_value2->hasAttribute('disabled'));
// Change state: check the checkbox.
$trigger->check();
......@@ -117,6 +187,61 @@ protected function doCheckboxTriggerTests() {
$this->assertTrue($checkbox_visible_element->isVisible());
$this->assertFalse($text_format_invisible_value->isVisible());
$this->assertFalse($text_format_invisible_format->isVisible());
// All 3 of the other set should be checked.
$this->assertTrue($checkboxes_all_checked_element_value1->isChecked());
$this->assertTrue($checkboxes_all_checked_element_value2->isChecked());
$this->assertTrue($checkboxes_all_checked_element_value3->isChecked());
// Value 1 and 3 should now be checked.
$this->assertTrue($checkboxes_some_checked_element_value1->isChecked());
$this->assertTrue($checkboxes_some_checked_element_value3->isChecked());
// Only value 2 should remain unchecked.
$this->assertFalse($checkboxes_some_checked_element_value2->isChecked());
// All 3 of these should be disabled.
$this->assertTrue($checkboxes_all_disabled_element_value1->hasAttribute('disabled'));
$this->assertTrue($checkboxes_all_disabled_element_value2->hasAttribute('disabled'));
$this->assertTrue($checkboxes_all_disabled_element_value3->hasAttribute('disabled'));
// Only values 1 and 3 should be disabled, 2 should still be enabled.
$this->assertTrue($checkboxes_some_disabled_element_value1->hasAttribute('disabled'));
$this->assertFalse($checkboxes_some_disabled_element_value2->hasAttribute('disabled'));
$this->assertTrue($checkboxes_some_disabled_element_value3->hasAttribute('disabled'));
$this->assertEquals('value1', $radios_checked_element->getValue());
// Both of these should now be disabled.
$this->assertTrue($radios_all_disabled_value1->hasAttribute('disabled'));
$this->assertTrue($radios_all_disabled_value2->hasAttribute('disabled'));
// Only value1 should be disabled, value 2 should remain enabled.
$this->assertTrue($radios_some_disabled_value1->hasAttribute('disabled'));
$this->assertFalse($radios_some_disabled_value2->hasAttribute('disabled'));
// Change state: uncheck the checkbox.
$trigger->uncheck();
// Verify triggered state, which should match the initial state.
$this->assertTrue($textfield_invisible_element->isVisible());
$this->assertFalse($details->hasAttribute('open'));
$this->assertFalse($textfield_in_details->isVisible());
$this->assertFalse($textfield_required_element->hasAttribute('required'));
$this->assertFalse($checkbox_checked_element->isChecked());
$this->assertTrue($checkbox_unchecked_element->isChecked());
$this->assertFalse($checkbox_visible_element->isVisible());
$this->assertTrue($text_format_invisible_value->isVisible());
$this->assertTrue($text_format_invisible_format->isVisible());
$this->assertFalse($checkboxes_all_checked_element_value1->isChecked());
$this->assertFalse($checkboxes_all_checked_element_value2->isChecked());
$this->assertFalse($checkboxes_all_checked_element_value3->isChecked());
$this->assertFalse($checkboxes_some_checked_element_value1->isChecked());
$this->assertFalse($checkboxes_some_checked_element_value2->isChecked());
$this->assertFalse($checkboxes_some_checked_element_value3->isChecked());
$this->assertFalse($checkboxes_all_disabled_element_value1->hasAttribute('disabled'));
$this->assertFalse($checkboxes_all_disabled_element_value2->hasAttribute('disabled'));
$this->assertFalse($checkboxes_all_disabled_element_value3->hasAttribute('disabled'));
$this->assertFalse($checkboxes_some_disabled_element_value1->hasAttribute('disabled'));
$this->assertFalse($checkboxes_some_disabled_element_value2->hasAttribute('disabled'));
$this->assertFalse($checkboxes_some_disabled_element_value3->hasAttribute('disabled'));
$this->assertFalse($radios_checked_element->isChecked());
$this->assertEquals(NULL, $radios_checked_element->getValue());
$this->assertFalse($radios_all_disabled_value1->hasAttribute('disabled'));
$this->assertFalse($radios_all_disabled_value2->hasAttribute('disabled'));
$this->assertFalse($radios_some_disabled_value1->hasAttribute('disabled'));
$this->assertFalse($radios_some_disabled_value2->hasAttribute('disabled'));
}
/**
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment