Unverified Commit 809ad58f authored by Lauri Timmanee's avatar Lauri Timmanee
Browse files

Issue #3181634 by Wongjn: States API: Empty/Filled state with number <input>... 

Issue #3181634 by Wongjn: States API: Empty/Filled state with number <input> does not update when using spinner
parent 5ca9f5d8

core/misc/states.es6.js

+4 −0
Original line number Diff line number Diff line
@@ -526,6 +526,10 @@ 
        // the state.

        return this.val() === '';

      },

      // Listen to 'change' for number native "spinner" widgets.

      change() {

        return this.val() === '';

      },

    },



    checked: {

core/misc/states.js

+3 −0
Original line number Diff line number Diff line
@@ -217,6 +217,9 @@ 
    empty: {

      keyup: function keyup() {

        return this.val() === '';

      },

      change: function change() {

        return this.val() === '';

      }

    },

    checked: {

core/modules/system/tests/modules/form_test/src/Form/JavascriptStatesForm.php

+15 −0
Original line number Diff line number Diff line
@@ -106,6 +106,10 @@ public function buildForm(array $form, FormStateInterface $form_state) { 
      '#empty_value' => '_none',

      '#empty_option' => '- None -',

    ];

    $form['number_trigger'] = [

      '#type' => 'number',

      '#title' => 'Number trigger',

    ];



    // Tested fields.

    // Checkbox trigger.
@@ -374,6 +378,17 @@ public function buildForm(array $form, FormStateInterface $form_state) { 
      ],

    ];



    // Number triggers.

    $form['item_visible_when_number_trigger_filled_by_spinner'] = [

      '#type' => 'item',

      '#title' => 'Item visible when number trigger filled by spinner widget',

      '#states' => [

        'visible' => [

          ':input[name="number_trigger"]' => ['filled' => TRUE],

        ],

      ],

    ];



    $form['select'] = [

      '#type' => 'select',

      '#title' => 'select 1',

core/tests/Drupal/Nightwatch/Tests/statesTest.js

+24 −0
Original line number Diff line number Diff line
@@ -21,4 +21,28 @@ module.exports = { 
      .waitForElementNotVisible('input[name="textfield"]', 1000)

      .assert.noDeprecationErrors();

  },

  'Test number trigger with spinner widget': (browser) => {

    browser

      .drupalRelativeURL('/form-test/javascript-states-form')

      .waitForElementVisible('body', 1000)

      .waitForElementNotVisible(

        '#edit-item-visible-when-number-trigger-filled-by-spinner',

        1000,

      )

      .execute(

        // eslint-disable-next-line func-names, prefer-arrow-callback, no-shadow

        function () {

          // Emulate usage of the spinner browser widget on number inputs

          // on modern browsers.

          const numberTrigger = document.getElementById('edit-number-trigger');

          numberTrigger.value = 1;

          numberTrigger.dispatchEvent(new Event('change'));

        },

      );



    browser.waitForElementVisible(

      '#edit-item-visible-when-number-trigger-filled-by-spinner',

      1000,

    );

  },

};