Improve slot handling to allow nested components, conditional slots, and slot.super (Fixes #33, #34, #37)

Co-authored-by: rbeard0330 <@dul2k3BKW6m>
This commit is contained in:
rbeard0330 2021-05-25 18:55:40 -04:00 committed by Emil Stenström
parent c4db1646db
commit 070b754d24
7 changed files with 459 additions and 69 deletions

View file

@ -1,11 +1,11 @@
from textwrap import dedent
from django.template import Context
from django.template import Context, Template
from .django_test_setup import * # NOQA
from .testutils import Django30CompatibleSimpleTestCase as SimpleTestCase
from django_components import component
from .testutils import Django30CompatibleSimpleTestCase as SimpleTestCase
class ComponentTest(SimpleTestCase):
@ -98,6 +98,8 @@ class ComponentTest(SimpleTestCase):
""")
)
class ComponentMediaTests(SimpleTestCase):
def test_component_media_with_strings(self):
class SimpleComponent(component.Component):
class Media:
@ -164,3 +166,52 @@ class ComponentTest(SimpleTestCase):
<script src="path/to/script.js"></script>
""")
)
class ComponentIsolationTests(SimpleTestCase):
def setUp(self):
class SlottedComponent(component.Component):
def template(self, context):
return "slotted_template.html"
component.registry.register('test', SlottedComponent)
def test_instances_of_component_do_not_share_slots(self):
template = Template(
"""
{% load component_tags %}
{% component_block "test" %}
{% slot "header" %}Override header{% endslot %}
{% endcomponent_block %}
{% component_block "test" %}
{% slot "main" %}Override main{% endslot %}
{% endcomponent_block %}
{% component_block "test" %}
{% slot "footer" %}Override footer{% endslot %}
{% endcomponent_block %}
"""
)
template.render(Context({}))
rendered = template.render(Context({}))
self.assertHTMLEqual(
rendered,
"""
<custom-template>
<header>Override header</header>
<main>Default main</main>
<footer>Default footer</footer>
</custom-template>
<custom-template>
<header>Default header</header>
<main>Override main</main>
<footer>Default footer</footer>
</custom-template>
<custom-template>
<header>Default header</header>
<main>Default main</main>
<footer>Override footer</footer>
</custom-template>
"""
)