Unable to build dynamic iterative lists

Question

I am building a backoffice tool to modify Liquid templates using CKEditor as a rich editor. The problem which I have is that there seems to be no way to build and, what's more important, to keep, a form of dynamic list (table, unordered list, ordered list) based on Liquid for statement.

For example, I can build this HTML, and I can only build it in "Source" mode or externally:

<ul>
    {% for proc in Procedures %}
    <li>{{ proc.Name }}</li>
    {% endfor %}
</ul>

But as soon as I go to WYSIWYG mode, the for statement becomes an item of the list, and going back to "Source" shows me how it was changed without any action from my side:

<ul>
    <li>{% for proc in Procedures %}</li>
    <li>{{ proc.Name }}</li>
    <li>{% endfor %}</li>
</ul>

Similarly, with tables, I can type this:

<table>
    <thead>
        <tr>
            <td>Name</td>
        </tr>
    </thead>
    <tbody>
{% for proc in Procedures %}
        <tr>
            <td>{{proc.Name}}</td>
        </tr>
{% endfor %}
    </tbody>
</table>

But it inevitably becomes this after going to WYSIWYG mode:

<p>{% for proc in Procedures %} {% endfor %}</p>

<table>
    <thead>
        <tr>
            <td>Name</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>{{proc.Name}}</td>
        </tr>
    </tbody>
</table>

Off course I did a lot of research of CKEditor options, but couldn't find anything which would affect this. I have allowedContent set to true to be able to use custom styles and classes, but it doesn't change this behavior.

First I thought that this only says that CKEditor is not fit for this case. But then there is Dropkiq tool, which is built for Liquid and has CKEditor listed as one of its supported usages. Which means that at least someone have used CKEditor for editing Liquid content. Does anyone know, what is the solution for this problem?

CKEditor version which we use is 4.14.0, but I have also tried with the latest (before version 5) 4.22.1 and it's the same.