Bug with ListGrid customCellEditor for SelectItem

[Blama]

Hi Isomorphic,

I'm having a problem with custom cell editors like here. Unfortunately it does not reproduce in a testcase, but I can show the reason I assume behind the problem (I'm using v10.0p_2015-10-23 in my application).
The problem is that in the edit-row the background of a SelectItem does not get white. This is because the css class applied is wrong. Please see the screen recording of Chrome 46 F12 tools.


As you can see the class of the div is tallCellSelectedDark(Focused), while in this sample (used other sample for non-multiple SelectItem as in my application) it is selectItemText:


I have no idea where this comes from, but perhaps do you.

Best regards
Blama

[Isomorphic]

The select item DIV in question is styled using the "textBoxStyle" applied to the item. (It is picked up by an internal JS method - formItem.getTextBoxStyle()).
For some reason your SelectItem is picking up the text box style from the base-style of the grid rather than using the standard default for SelectItems.

There is one obscure case where the framework will do this - if you are using the undocumented "PopUpTextAreaItem" class- but it seems like this would be unrelated to your usage (from the auto-generated ID alone this clearly appears to be a SelectItem).

At a guess, the form item is actually picking up the ListGrid's base cell style as its textBoxStyle attribute somehow -- perhaps this property is specified directly on the ListGridField object in application code and is being picked up that way?
A simple fix might be to add an editorProperties block to the field and explicitly set the textBoxStyle to "selectItemText".

If that doesn't explain or fix it, there may be an override to "getTextBoxStyle" in play - but it's hard to see where that would come from. As always, a test case would be the best way for us to get you a definitive answer.

Regards
Isomorphic Software

[Blama]

Hi Isomorphic,

thanks for the fast answer. Such a thing is definitely not used, no PopUpTextAreaItem, no getTextBoxStyle-override, no default-textBoxStyle-change.

To me, it looks like a bug. I'll try to create a testcase tomorrow, but I were not sucessfull today. I'll also try a editorProperties block to see if I can mitigate the issue.

Best regards
Blama

[jaredm]

If it were me I'd be putting a breakpoint on getTextBoxStyle and looking at the call stack to see how its getting the style you're seeing.

[Blama]

Ok, I will try that. Thanks for the suggestion.

[jaredm]

Ok, I will try that. Thanks for the suggestion.

No problem, compare it to call stack of the out-of-the-box sample that works and then compare to them to figure out where it goes wrong. It may take a bit of time but its the only way I've found to diagnose such problems in my own code. Good luck!

[Blama]

Hi Isomorphic,

I was able to reproduce using BuiltInDS and v10.1p_2016-03-02.
The problem is with providing custom editor to fields that would have been TextAreaItems normally.

Please change this in animals.ds.xml (see the length="500"):

<field name="status"          title="Endangered Status"  type="text" length="500" />

BuiltInDS.java:

package com.smartgwt.sample.client;

import java.util.LinkedHashMap;

import com.google.gwt.core.client.EntryPoint;
import com.smartgwt.client.core.KeyIdentifier;
import com.smartgwt.client.data.AdvancedCriteria;
import com.smartgwt.client.data.Criterion;
import com.smartgwt.client.data.DataSource;
import com.smartgwt.client.data.SortSpecifier;
import com.smartgwt.client.types.OperatorId;
import com.smartgwt.client.types.SortDirection;
import com.smartgwt.client.util.Page;
import com.smartgwt.client.util.PageKeyHandler;
import com.smartgwt.client.util.SC;
import com.smartgwt.client.widgets.IButton;
import com.smartgwt.client.widgets.Window;
import com.smartgwt.client.widgets.events.ClickEvent;
import com.smartgwt.client.widgets.events.ClickHandler;
import com.smartgwt.client.widgets.form.fields.FormItem;
import com.smartgwt.client.widgets.form.fields.SelectItem;
import com.smartgwt.client.widgets.form.fields.StaticTextItem;
import com.smartgwt.client.widgets.form.fields.TextItem;
import com.smartgwt.client.widgets.grid.ListGrid;
import com.smartgwt.client.widgets.grid.ListGridEditorContext;
import com.smartgwt.client.widgets.grid.ListGridEditorCustomizer;
import com.smartgwt.client.widgets.grid.ListGridField;
import com.smartgwt.client.widgets.layout.VLayout;

public class BuiltInDS implements EntryPoint {
    private VLayout mainLayout;
    private IButton recreateBtn;

    public void onModuleLoad() {
        KeyIdentifier debugKey = new KeyIdentifier();
        debugKey.setCtrlKey(true);
        debugKey.setKeyName("D");

        Page.registerKey(debugKey, new PageKeyHandler() {
            public void execute(String keyName) {
                SC.showConsole();
            }
        });

        mainLayout = new VLayout(20);
        mainLayout.setWidth100();
        mainLayout.setHeight100();

        recreateBtn = new IButton("Recreate");
        recreateBtn.addClickHandler(new ClickHandler() {
            @Override
            public void onClick(ClickEvent event) {
                recreate();
            }
        });
        mainLayout.addMember(recreateBtn);
        recreate();
        mainLayout.draw();
    }

    private void recreate() {
        Window w = new Window();
        w.setWidth("95%");
        w.setHeight("95%");
        w.setMembersMargin(0);
        w.setModalMaskOpacity(70);
        w.setTitle("ListGrid-editRow FormItems get ListGrid CSS classes when normal editor is TextAreaItem");
        w.setShowMinimizeButton(false);
        w.setIsModal(true);
        w.setShowModalMask(true);
        w.centerInPage();

        final ListGrid animalsGrid = new ListGrid();

        animalsGrid.setHeight100();
        animalsGrid.setAutoFetchData(false);
        animalsGrid.setCanEdit(true);
        animalsGrid.setDataSource(DataSource.get("animals"));
        animalsGrid.setCanGroupBy(false);
        animalsGrid.setShowRecordComponents(false);
        animalsGrid.setShowRecordComponentsByCell(false);

        ListGridField commonName = new ListGridField("commonName");
        commonName.setCanEdit(false);
        ListGridField scientificName = new ListGridField("scientificName");
        scientificName.setCanEdit(false);
        ListGridField lifeSpan = new ListGridField("lifeSpan");
        ListGridField status = new ListGridField("status");
        ListGridField diet = new ListGridField("diet");
        diet.setCanEdit(false);

        animalsGrid.setEditorCustomizer(new ListGridEditorCustomizer() {
            public FormItem getEditor(ListGridEditorContext context) {
                ListGridField field = context.getEditField();
                String animal = context.getEditedRecord().getAttributeAsString("commonName");
                switch (animal) {

                case "Anteater":
                    switch (field.getName()) {
                    case "lifeSpan":
                        return new StaticTextItem();
                    case "status":
                        return new SelectItem() {
                            {
                                setValueMap(new LinkedHashMap<String, String>() {
                                    private static final long serialVersionUID = 1L;
                                    {
                                        put("Y", "Yes");
                                        put("N", "No");
                                    }
                                });
                            }
                        };
                    default:
                        return context.getDefaultProperties();
                    }
                case "Arabian Camel":
                    switch (field.getName()) {
                    case "lifeSpan":
                        return new StaticTextItem();
                    case "status":
                        return new TextItem();
                    default:
                        return context.getDefaultProperties();
                    }
                default:
                    return context.getDefaultProperties();
                }
            }
        });
        animalsGrid.setFields(commonName, scientificName, lifeSpan, status, diet);
        animalsGrid.setSort(new SortSpecifier[] { new SortSpecifier(commonName.getName(), SortDirection.ASCENDING) });
        animalsGrid.fetchData(new AdvancedCriteria(new Criterion("commonName", OperatorId.STARTS_WITH, "A")));
        w.addItem(animalsGrid);
        w.show();
    }
}

Tested in FF26 Development Mode (Simplicity skin), but it happens in my application in all browsers (Compiled Mode).

Screenshots:


I'm not sure what causes the different display for the TextItem. It starts always white (but with wrong borders) and sometimes switches to yellow when you don't focus the TextItem/move the mouse pointer away.

Best regards
Blama

[Blama]

Hi Isomorphic,

can you reproduce the issue with the provided testcase?

Best regards
Blama

[Isomorphic]

This one too - we'llk update shortly when we've looked into it.

[Isomorphic]

We don't see the issue you note with your sample code against the latest framework code and Simplicity skin.

Can you retry this with the latest build? Making sure that you're using the skin from that build.

If you still see it, please let us know the styles in use, before and after you see that effect - the style in your second image looks unset.

[Blama]

Will do so. Do you have the addition to the ds.xml as well? It is necessary to provoke the error.

[Isomorphic]

Ok, we see this issue now - we're looking into it today.

[Isomorphic]

This is fixed for tomorrow's builds.

[Blama]

Hi Isomorphic,

using v10.1p_2016-03-20, it seems to be working in my application, but not the testcase. The testcase (using Simplicity and the .ds.xml addition) shows the same issue as before and also this error for about 20x when starting the rowEditor with a double-click:

11:21:40.176 [ERROR] [builtinds] Uncaught exception escaped

java.lang.NullPointerException: null
    [B]at com.smartgwt.client.widgets.grid.ListGridEditorContext.<init>(ListGridEditorContext.java:23)[/B]
    at sun.reflect.GeneratedConstructorAccessor23.newInstance(Unknown Source)
    at sun.reflect.DelegatingConstructorAccessorImpl.newInstance(Unknown Source)
    at java.lang.reflect.Constructor.newInstance(Unknown Source)
    at com.google.gwt.dev.shell.MethodAdaptor.invoke(MethodAdaptor.java:105)
    at com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:72)
    at com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:172)
    at com.google.gwt.dev.shell.BrowserChannelServer.reactToMessagesWhileWaitingForReturn(BrowserChannelServer.java:341)
    at com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:222)
    at com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:137)
    at com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:589)
    at com.google.gwt.dev.shell.ModuleSpace.invokeNativeObject(ModuleSpace.java:293)
    at com.google.gwt.dev.shell.JavaScriptHost.invokeNativeObject(JavaScriptHost.java:91)
    at com.google.gwt.core.client.impl.Impl.apply(Impl.java)
    at com.google.gwt.core.client.impl.Impl.entry0(Impl.java:299)
    at sun.reflect.GeneratedMethodAccessor43.invoke(Unknown Source)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)
    at java.lang.reflect.Method.invoke(Unknown Source)
    at com.google.gwt.dev.shell.MethodAdaptor.invoke(MethodAdaptor.java:103)
    at com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:72)
    at com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:172)
    at com.google.gwt.dev.shell.BrowserChannelServer.reactToMessages(BrowserChannelServer.java:296)
    at com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:551)
    at com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:368)
    at java.lang.Thread.run(Unknown Source)

Tested in FF26 Dev Mode.
In my application (deployed FF26, GC49, IE Edge 13) I do not see any errors in the Developer Console Logs, but do see the same error in FF26 Dev Mode.

Best regards
Blama

[Isomorphic]

Can you clarify when you're actually seeing the problem here?

It seems as though you're saying you see these issues *only* in FF26 and in legacy Dev Mode, but not anywhere else - is that correct? Are the stack-traces Dev-mode specific, or is the entire issue Dev-mode specific?