[10.1] HtmlPane is displayed in SectionStackSection despite visibility hidden

[SimonF]

Hi there

I found a bug using HtmlPanes in a SectionSackSection. If I hide an HtmlPane inside of a SectionStackSection the HtmlPane is display despite of the hidden parameter

This is reproducable in the latest nightly SmartClient_v101p_2016-04-14_Pro in all current versions of all browser (Firefox, Chrome, IE11).


Code for reproduction

isc.VLayout.create({
    "ID" : "outOfBoundsLayout",
    "width" : "400",
    "height" : "500",
    "overflow" : "auto",
    "hideUsingDisplayNone" : false,
    "leaveScrollbarGap" : false,
    "members" : [
        isc.SectionStack.create({
            "ID" : "sectionStack",
            "visibilityMode" : "multiple",
            "width" : "100%",
            "height" : 200,
            "sections" :
            [{
                    "ID" : "sectionStackSection",
                    "items" :
                    [
                        isc.HTMLPane.create({
                            "ID" : "htmlPane",
                            "contents" : "<p>This shouldn't be visible<\/p>",
                            "visibility" : "hidden"
                        }),
                        isc.HTMLPane.create({
                            "ID" : "htmlPane2",
                            "contents" : "<p>This is visible<\/p>",
                        }),
                    ]
                }
            ],
            "members" :
            []
        }),

        isc.HTMLPane.create({
            "ID" : "htmlPane3",
            "contents" : "<p>This isn't visible<\/p>",
            "visibility" : "hidden"
        }),
        isc.HTMLPane.create({
            "ID" : "htmlPane4",
            "contents" : "<p>This is visible<\/p>",
        }),
    ]
})

It's working with a Layout inside the sectionstackSection, see here:

isc.VLayout.create({
    "ID" : "outOfBoundsLayout",
    "width" : "400",
    "height" : "500",
    "overflow" : "auto",
    "hideUsingDisplayNone" : false,
    "leaveScrollbarGap" : false,
    "members" : [
        isc.SectionStack.create({
            "ID" : "sectionStack",
            "visibilityMode" : "multiple",
            "width" : "100%",
            "height" : 200,
            "sections" :
            [{
                    "ID" : "sectionStackSection",
                    "items" :
                    [
                        isc.VLayout.create({
                            "ID" : "anInnerLayout",
                            "overflow" : "auto",
                            "hideUsingDisplayNone" : false,
                            "leaveScrollbarGap" : false,
                            "members" : [
                                isc.HTMLPane.create({
                                    "ID" : "htmlPane",
                                    "contents" : "<p>This shouldn't be visible<\/p>",
                                    "visibility" : "hidden"
                                }),
                                isc.HTMLPane.create({
                                    "ID" : "htmlPane2",
                                    "contents" : "<p>This is visible<\/p>",
                                }),
                            ]
                        })]
                }
            ],
            "members" :
            []
        }),

        isc.HTMLPane.create({
            "ID" : "htmlPane3",
            "contents" : "<p>This isn't visible<\/p>",
            "visibility" : "hidden"
        }),
        isc.HTMLPane.create({
            "ID" : "htmlPane4",
            "contents" : "<p>This is visible<\/p>",
        }),
    ]
})

Best regards
Simon

[Isomorphic]

This in intended - a SectionStack manages its items visibility, showing and hiding them when sections and expanded or collapsed, including the initial expansion that happens at draw. The second structure you showed, with an inventing Layout, is the right structure to use if you need to show and hide things within a section.