Examples with StateNode com.vaadin.client.flow.StateNode used on opensource projects

Example 6 with StateNode

use of com.vaadin.client.flow.StateNode in project flow by vaadin.

the class GwtTemplateBinderTest method createNgForModelNode.

/**
 * Creates 3 children for the {@code parent}: the first one is defined via
 * the {@code firstChildTag}, the second is defined via the {@code ngForTag}
 * (this is the template which represents *ngFor) and the
 * {@code lastChildTag} defines the third child.
 * <p>
 * {@code collectionVar} is an outer scope collection variable name and
 * {@code textVar} is text template parameter name. It's used inside *ngFor
 * template.
 * <p>
 * So the result is:
 *
 * <pre>
 *                                 parent
 *                                   |
 *              ________________________________________________________
 *              |                          |                           |
 *      <firstChildTag>    <ngForTag>{{textVar}}</ngForTag>     <lastChildTag>
 * </pre>
 */
private StateNode createNgForModelNode(TestElementTemplateNode parent, String firstChildTag, String ngForTag, String lastChildTag, String collectionVar, String textVar) {
    TestElementTemplateNode child1 = TestElementTemplateNode.create(firstChildTag);
    int child1Id = 57;
    registry.getTemplateRegistry().register(child1Id, child1);
    TestForTemplateNode templateNode = TestTemplateNode.create(ForTemplateNode.TYPE);
    int templateId = 42;
    registry.getTemplateRegistry().register(templateId, templateNode);
    TestElementTemplateNode forChild = TestElementTemplateNode.create(ngForTag);
    templateNode.setCollectionVariable(collectionVar);
    TestTextTemplate text = TestTextTemplate.create(TestBinding.createTextValueBinding(textVar));
    int textChildId = 85;
    registry.getTemplateRegistry().register(textChildId, text);
    forChild.setChildrenIds(new double[] { textChildId });
    int forChildId = 11;
    registry.getTemplateRegistry().register(forChildId, forChild);
    templateNode.setChildrenIds(new double[] { forChildId });
    TestElementTemplateNode child2 = TestElementTemplateNode.create(lastChildTag);
    int child2Id = 84;
    registry.getTemplateRegistry().register(child2Id, child2);
    parent.setChildrenIds(new double[] { child1Id, templateId, child2Id });
    NodeMap model = stateNode.getMap(NodeFeatures.TEMPLATE_MODELMAP);
    MapProperty property = model.getProperty(collectionVar);
    StateNode modelNode = new StateNode(1, tree);
    property.setValue(modelNode);
    return modelNode;
}

Example 7 with StateNode

use of com.vaadin.client.flow.StateNode in project flow by vaadin.

the class GwtTemplateBinderTest method testNgFor_updateModelValues.

public void testNgFor_updateModelValues() {
    TestElementTemplateNode parent = TestElementTemplateNode.create("div");
    String textVar = "text";
    // create 3 children for the parent: <div/><li
    // *ngFor>{{text}}</li><span/>
    StateNode modelNode = createNgForModelNode(parent, "div", "li", "span", "items", textVar);
    StateNode varNode = new StateNode(2, tree);
    varNode.getMap(NodeFeatures.TEMPLATE_MODELMAP).getProperty(textVar).setValue("foo");
    com.vaadin.client.flow.nodefeature.NodeList modelList = modelNode.getList(NodeFeatures.TEMPLATE_MODELLIST);
    modelList.add(0, varNode);
    Element element = createElement(parent);
    Reactive.flush();
    StateNode varNode1 = new StateNode(3, tree);
    varNode1.getMap(NodeFeatures.TEMPLATE_MODELMAP).getProperty(textVar).setValue("bar");
    StateNode varNode2 = new StateNode(4, tree);
    varNode2.getMap(NodeFeatures.TEMPLATE_MODELMAP).getProperty(textVar).setValue("bar1");
    modelList.splice(0, 1);
    modelList.add(0, varNode1);
    modelList.add(1, varNode2);
    Reactive.flush();
    assertEquals("DIV", element.getTagName());
    NodeList childNodes = element.getChildNodes();
    assertTrue(childNodes.getLength() > 1);
    assertEquals("DIV", ((Element) childNodes.item(0)).getTagName());
    assertEquals("SPAN", ((Element) childNodes.item(childNodes.getLength() - 1)).getTagName());
    Element li = ((Element) childNodes.item(childNodes.getLength() - 3));
    assertEquals("LI", li.getTagName());
    assertEquals(5, childNodes.getLength());
    // comment
    assertEquals(Node.COMMENT_NODE, childNodes.item(1).getNodeType());
    assertEquals("bar", li.getTextContent());
    li = ((Element) childNodes.item(childNodes.getLength() - 2));
    assertEquals("LI", li.getTagName());
    assertEquals("bar1", li.getTextContent());
}

Example 8 with StateNode

use of com.vaadin.client.flow.StateNode in project flow by vaadin.

the class GwtTemplateBinderTest method testNgFor_updateModel.

public void testNgFor_updateModel() {
    TestElementTemplateNode parent = TestElementTemplateNode.create("div");
    String textVar = "text";
    String collectionVar = "items";
    // create 3 children for the parent: <div/><li
    // *ngFor>{{text}}</li><span/>
    StateNode modelNode = createNgForModelNode(parent, "div", "li", "span", collectionVar, textVar);
    StateNode varNode = new StateNode(2, tree);
    varNode.getMap(NodeFeatures.TEMPLATE_MODELMAP).getProperty(textVar).setValue("foo");
    modelNode.getList(NodeFeatures.TEMPLATE_MODELLIST).add(0, varNode);
    Element element = createElement(parent);
    Reactive.flush();
    NodeMap model = stateNode.getMap(NodeFeatures.TEMPLATE_MODELMAP);
    MapProperty property = model.getProperty(collectionVar);
    modelNode = new StateNode(3, tree);
    property.setValue(modelNode);
    varNode = new StateNode(4, tree);
    varNode.getMap(NodeFeatures.TEMPLATE_MODELMAP).getProperty(textVar).setValue("bar");
    modelNode.getList(NodeFeatures.TEMPLATE_MODELLIST).add(0, varNode);
    Reactive.flush();
    assertEquals("DIV", element.getTagName());
    NodeList childNodes = element.getChildNodes();
    assertTrue(childNodes.getLength() > 1);
    assertEquals("DIV", ((Element) childNodes.item(0)).getTagName());
    assertEquals("SPAN", ((Element) childNodes.item(childNodes.getLength() - 1)).getTagName());
    Element li = ((Element) childNodes.item(childNodes.getLength() - 2));
    assertEquals("LI", li.getTagName());
    assertEquals(4, childNodes.getLength());
    // comment
    assertEquals(Node.COMMENT_NODE, childNodes.item(1).getNodeType());
    assertEquals("bar", li.getTextContent());
}

Example 9 with StateNode

use of com.vaadin.client.flow.StateNode in project flow by vaadin.

the class GwtTemplateBinderTest method testBindOverrideNodeAfterCreated.

public void testBindOverrideNodeAfterCreated() {
    TestElementTemplateNode templateNode = TestElementTemplateNode.create("div");
    int id = 83;
    Element element = createElement(templateNode, id);
    Reactive.flush();
    // tests the rare(ish) case resulting in #1050 (fixed by #1051)
    tree.setUpdateInProgress(true);
    StateNode overrideNode = createSimpleOverrideNode(id);
    overrideNode.getMap(NodeFeatures.ELEMENT_PROPERTIES).getProperty("id").setValue("override");
    tree.setUpdateInProgress(false);
    Reactive.flush();
    assertEquals("override", element.getId());
}

Example 10 with StateNode

use of com.vaadin.client.flow.StateNode in project flow by vaadin.

the class GwtTemplateBinderTest method testBindOverrideNode_properties_afterBind.

public void testBindOverrideNode_properties_afterBind() {
    TestElementTemplateNode templateNode = TestElementTemplateNode.create("div");
    int id = 68;
    StateNode overrideNode = createSimpleOverrideNode(id);
    Element element = createElement(templateNode, id);
    NodeMap props = overrideNode.getMap(NodeFeatures.ELEMENT_PROPERTIES);
    props.getProperty("foo").setValue("bar");
    Reactive.flush();
    assertEquals("bar", WidgetUtil.getJsProperty(element, "foo"));
}