Taack/infra

UiBlockSpecifier parent div doesn't wrap all childrens

Closed this issue · 2 comments

Expected Behavior

The div that is created with any UiBlockSpecifier should wrap all the blocks defined in its Closure.
The div in question:

<div id="blockId1672304222172" class="pure-g taackBlock" blockid="welcome-index"

Current Behavior

The UiBlockSpecifier div only wraps the first block inside its Closure

Steps to Reproduce

  1. Reproduce the following code :
taackUiSimpleService.show(
                new UiBlockSpecifier().ui {
                    ajaxBlock 'index', {
                        custom("""
                            <p>hello 1</p>
                        """, null, BlockSpec.Width.THREE_QUARTER)
                    }
                    ajaxBlock 'hello', {
                        custom("""
                            <p>hello 2</p>
                        """, null, BlockSpec.Width.THREE_QUARTER)
                    }
                }, buildMenu(lang)
        )
  1. Check the rendered content, the second div is not a child of the first one even though it should.
    example

The example also works when using table() instead of custom()

Context

Mostly affects css styling in my case, though it may be causing some issue in other places since some blocks are not in their specific div.

Taack commented

the code generated by this test-case:

<div id='blockId1672307347185' class='pure-g taackBlock' blockId='crew-test''>
    <div class='pure-u-1 pure-u-md-3-4 taackContainer ajaxBlock taackAjaxBlock' ajaxBlockId=index>
        <div class='pure-g'>
            <div class='pure-u-1 taackContainer ajaxBlock taackAjaxBlock' ajaxBlockId=index>
                <div class="null">
                    <p>hello 1</p>
                </div>
            </div>
        </div>
    </div>
</div>
<div class='pure-u-1 pure-u-md-3-4 taackContainer ajaxBlock taackAjaxBlock' ajaxBlockId=hello>
    <div class='pure-g'>
        <div class='pure-u-1 taackContainer ajaxBlock taackAjaxBlock' ajaxBlockId=hello>
            <div class="null">
                <p>hello 2</p>
            </div>
        </div>
    </div>
</div>

it should be:

<div id='blockId1672307347185' class='pure-g taackBlock' blockId='crew-test''>
    <div class='pure-u-1 pure-u-md-3-4 taackContainer ajaxBlock taackAjaxBlock' ajaxBlockId=index>
        <div class='pure-g'>
            <div class='pure-u-1 taackContainer ajaxBlock taackAjaxBlock' ajaxBlockId=index>
                <div class="null">
                    <p>hello 1</p>
                </div>
            </div>
        </div>
    </div>
    <div class='pure-u-1 pure-u-md-3-4 taackContainer ajaxBlock taackAjaxBlock' ajaxBlockId=hello>
        <div class='pure-g'>
            <div class='pure-u-1 taackContainer ajaxBlock taackAjaxBlock' ajaxBlockId=hello>
                <div class="null">
                    <p>hello 2</p>
                </div>
            </div>
        </div>
    </div>
</div>
Taack commented

Fixed with lastest commit b00cc52