Checkbox clicks not working anymore?

Get help with testing, discuss unit testing strategies etc.
Post Reply
User avatar
klodoma
Posts: 49
Joined: Thu Oct 01, 2015 11:55 am

Checkbox clicks not working anymore?

Post by klodoma » Thu Oct 24, 2019 10:18 am

For some reasons, click actions don't work anymore on checkboxes. It used to work, but now I cannot get it running.
I've tried different selectors, but none seems to do the job anymore.

The other fields seem ok.
Ext.ComponentQuery.query delivers the object but the click action doesn't work.

Any ideas?

A demo test-case. Using, Extjs 6.7 Modern and Siesta-Lite

Code: Select all


StartTest(function (t) {

    Ext.Viewport.removeAll(true);
    Ext.Viewport.add({
        xtype: 'formpanel',
        items: [
            {
                xtype: 'checkboxfield',
                name: 'tomato',
                label: 'Tomato',
                value: 'tomato',
                checked: true
            }, {
                xtype: 'checkboxfield',
                name: 'salami',
                label: 'Salami'
            }, {
                xtype: 'togglefield',
                label: 'Toggle'
            }
        ]
    });

    t.pass('View could be rendered');

    console.log(Ext.ComponentQuery.query('field[label=Tomato]'));

    t.chain(
        { click: '>> togglefield => .x-component' },
        { click: '>> field[label=Tomato]' },
        { click: '>> checkbox' }
    );

});
Screenshot_465.png
Screenshot_465.png (29.07 KiB) Viewed 230 times

User avatar
nickolay
Core Developer
Core Developer
Posts: 3382
Joined: Mon May 16, 2011 10:48 am

Re: Checkbox clicks not working anymore?

Post by nickolay » Thu Oct 24, 2019 10:21 am

Might be some markup change in the recent Ext. I'll check in the evening. What if you try to click the dom element directly?
We offer training in both Ext JS and our products, read more here.
Read the API documentation

User avatar
klodoma
Posts: 49
Joined: Thu Oct 01, 2015 11:55 am

Re: Checkbox clicks not working anymore?

Post by klodoma » Thu Oct 24, 2019 1:08 pm

Code: Select all

{ click: Ext.ComponentQuery.query('field[label=Tomato]')[0].el.dom },
This works, as said, I have this problem only with checkboxes.

User avatar
nickolay
Core Developer
Core Developer
Posts: 3382
Joined: Mon May 16, 2011 10:48 am

Re: Checkbox clicks not working anymore?

Post by nickolay » Fri Oct 25, 2019 10:28 am

Thanks for the detailed report. Its now fixed and pushed (fully cycle of nightly testing in all browsers is still pending). You can verify in the tomorrow nightly, or in the upcoming 5.3.0.

If you are ok with hotpatching, you can also find this place in "siesta-all.js"

Code: Select all

            if (Ext && Ext.form && Ext.form.Field && locateInputEl) {
                // Deal with bizarre markup in Ext 5.1.2+
                if (
                    (Ext.form.Checkbox && comp instanceof Ext.form.Checkbox || Ext.form.Radio && comp instanceof Ext.form.Radio)
                    && comp.el
                ) {
                    var displayEl   = comp.displayEl;

                    if (displayEl && comp.boxLabel) {
                        return displayEl;
                    }
                    //                                                    Ext6 Modern
                    return comp.el.down('.x-form-field') || comp.el.down('.x-field-input') || comp.inputEl;
                }

                if (comp instanceof Ext.form.Field && comp.inputEl) {
                    var field       = comp.el.down('.x-form-field');

                    return (field && field.dom) ? field : comp.inputEl;
                }

                if (Ext.form.HtmlEditor && comp instanceof Ext.form.HtmlEditor) {
                    //     Ext JS 3       Ext JS 4
                    return comp.iframe || comp.inputEl;
                }
            }

            // Sencha Touch: Form fields can have a child input component
            if (Ext && Ext.field && Ext.field.Field && comp instanceof Ext.field.Field && locateInputEl && comp.getComponent) {
and update it to:

Code: Select all

            if (Ext && Ext.form && Ext.form.Field && locateInputEl) {
                // Deal with bizarre markup in Ext 5.1.2+
                if (
                    (Ext.form.Checkbox && comp instanceof Ext.form.Checkbox || Ext.form.Radio && comp instanceof Ext.form.Radio)
                    && comp.el
                ) {
                    var displayEl   = comp.displayEl;

                    if (displayEl && comp.boxLabel) {
                        return displayEl;
                    }

                    var inputComponent  = Ext.ComponentQuery.query('checkboxinput', comp)[ 0 ]

                    if (inputComponent) return this.compToEl(inputComponent)

                    //                                                    Ext6 Modern               Ext6.7                                   Fallback
                    return comp.el.down('.x-form-field') || comp.el.down('.x-field-input') || comp.el.down('.x-input-el') || comp.inputEl || comp.el;
                }

                if (comp instanceof Ext.form.Field && comp.inputEl) {
                    var field       = comp.el.down('.x-form-field');

                    return (field && field.dom) ? field : comp.inputEl;
                }

                if (Ext.form.HtmlEditor && comp instanceof Ext.form.HtmlEditor) {
                    //     Ext JS 3       Ext JS 4
                    return comp.iframe || comp.inputEl;
                }
            }

            if (Ext && Ext.field && Ext.field.Slider && (comp instanceof Ext.field.Slider)) {
                return this.compToEl(Ext.ComponentQuery.query('slider', comp)[ 0 ])
            }

            // Sencha Touch: Form fields can have a child input component
            if (Ext && Ext.field && Ext.field.Field && comp instanceof Ext.field.Field && locateInputEl && comp.getComponent) {
We offer training in both Ext JS and our products, read more here.
Read the API documentation

User avatar
klodoma
Posts: 49
Joined: Thu Oct 01, 2015 11:55 am

Re: Checkbox clicks not working anymore?

Post by klodoma » Fri Oct 25, 2019 2:26 pm

Thanks for the update. I'll wait for the fix, as it comes from npm repos

Post Reply