0

ZATS & Shadow component

asked 2019-10-23 15:46:54 +0800

Ignis11 gravatar image Ignis11
5 1

I´m trying to test ZK app with ZATS, but it doesn´t work with shadow component and choose - apply templates. I mean: I look for id of component inside a template (after click on button to enable shadow component) but received a null of this component.

Is ZATS enabled to work with shadow components? How can I test the load of the right template after event/click?

thanks in advance

delete flag offensive retag edit

1 Answer

Sort by » oldest newest most voted
0

answered 2019-10-24 12:34:49 +0800

cor3000 gravatar image cor3000
4887 2 7
ZK Team

It is not enabled per se, because there is no difference. Shadow elements just provide another way to add/remove components to a page.

So if your components appear due to a change to the template/templateUri property the contained components are queryable from ZATS just as normal. However the shadow elements itself aren't supported by ZATS via QueryAgent. Still - if really needed - you can query them directly from the actual component instance behind a ComponentAgent object, which also has a query() method. e.g.:

componentAgent.as(Div.class).query('::shadow#myApply')

Here a small example demonstrating this (uses zscript for simplicity - the same result can be achieved with normal @Command bindings, so don't copy/paste this pattern):

clicking the button will toggle between template1<->template2

zats-shadow.zul

<zk>
    <zs cript>
        public class MyVm {
            private String template = "template1";
            public String getTemplate() { return this.template; }

            //can't use annotations in zscript, in a java class you can do that
            //@Command
            //@NotifyChange("template");
            public void toggleTemplate() {
                this.template = "template1".equals(this.template) ? "template2" : "template1";
                BindUtils.postNotifyChange(null, null, this, "template");
            }
        }
    </zscript>
    <div id="root" viewModel="@id('vm') @init('MyVm')">
        <button id="toggleTemplate" onClick="vm.toggleTemplate()"/>
<!--        <button id="toggleTemplate" onClick="@command('toggleTemplate')"/>-->
        <apply id="myApply" dynamicValue="true" template="@load(vm.template)">
            <template name="template1">
                <div id="template1Content">
                    Template 1
                </div>
            </template>
            <template name="template2">
                <div id="template2Content">
                    Template 2
                </div>
            </template>
        </apply>
    </div>
</zk>

Here a corresponding ZATS test case asserting the updated components inside the different templates. Also shows how to access the inner state of the shadow element directly - if you really need that for a particular reason.

public class ZatsShadowTest {
    @ClassRule
    public static AutoEnvironment env = new AutoEnvironment("src/main/webapp");
    @Rule
    public AutoClient autoClient = env.autoClient();

    private DesktopAgent desktopAgent;

    @Before
    public void setup() {
        this.desktopAgent = autoClient.connect("/zats-shadow.zul");
    }

    @After
    public void cleanup() {
        this.desktopAgent = null;
    }

    public ComponentAgent root() { return desktopAgent.query("#root"); }
    public ComponentAgent template1Content() { return desktopAgent.query("#template1Content"); }
    public ComponentAgent template2Content() { return desktopAgent.query("#template2Content"); }
    public ComponentAgent toggleTemplate() { return desktopAgent.query("#toggleTemplate"); }
    public Apply myApply() { return (Apply) root().as(Div.class).query("::shadow#myApply"); }

    @Test
    public void testShadowTemplate() {
        assertEquals("template1", myApply().getTemplate());
        assertNotNull(template1Content());
        assertNull(template2Content());

        toggleTemplate().click();

        assertEquals("template2", myApply().getTemplate());
        assertNull(template1Content());
        assertNotNull(template2Content());
    }
}

Since this works on my side and you didn't provide any non working example. I can't comment on your particular issue.

In any case Shadow elements are nothing a user can/will interact with, that's why they aren't considered in the ZatsMimic library. It should be enough to just assert the actual contents tempalte1Content/template2Content are added/removed as expected.

link publish delete flag offensive edit

Comments

the <zs cript> tag contains a space to avoid being spam blocked ... please remove it to actually run the code

cor3000 ( 2019-10-24 12:39:10 +0800 )edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
1 follower

RSS

Stats

Asked: 2019-10-23 15:46:54 +0800

Seen: 7 times

Last updated: Oct 24

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More