The base diff components:
diff = SingleValueFactory("diff", "Container element for side-by-side comparison") # Diff container
diff_item_1 = SingleValueFactory("diff-item-1", "First item in the comparison") # First item
diff_item_2 = SingleValueFactory("diff-item-2", "Second item in the comparison") # Second item
diff_resizer = SingleValueFactory("diff-resizer", "The resizer control for adjusting comparison") # Resizer control
def test_diff_basic_examples(
):
Test basic diff utilities.
def test_diff_basic_examples():
"""Test basic diff utilities."""
# Basic components
assert str(diff) == "diff"
assert str(diff_item_1) == "diff-item-1"
assert str(diff_item_2) == "diff-item-2"
assert str(diff_resizer) == "diff-resizer"
# With modifiers
assert str(diff.hover) == "hover:diff"
assert str(diff_item_1.md) == "md:diff-item-1"
assert str(diff_resizer.dark) == "dark:diff-resizer"
# Run the tests
test_diff_basic_examples()
def test_diff_basic_fasthtml_examples(
):
Test basic diff and diff text from daisyUI v5 documentation.
def test_diff_basic_fasthtml_examples():
"""Test basic diff and diff text from daisyUI v5 documentation."""
from fasthtml.common import Figure, Div, Img
from cjm_fasthtml_tailwind.utilities.layout import aspect
from cjm_fasthtml_tailwind.utilities.typography import font_size, font_weight, font_family, text_color
from cjm_fasthtml_tailwind.utilities.flexbox_and_grid import place_content, grid_display
from cjm_fasthtml_tailwind.utilities.layout import display_tw
from cjm_fasthtml_tailwind.core.base import combine_classes
from cjm_fasthtml_daisyui.utilities.semantic_colors import bg_dui, text_dui
# Basic diff
img_diff = Figure(
Div(
Img(
alt="daisy",
src="https://img.daisyui.com/images/stock/photo-1560717789-0ac7c58ac90a.webp"
),
cls=str(diff_item_1),
role="img",
tabindex="0"
),
Div(
Img(
alt="daisy",
src="https://img.daisyui.com/images/stock/photo-1560717789-0ac7c58ac90a-blur.webp"
),
cls=str(diff_item_2),
role="img"
),
Div(cls=str(diff_resizer)),
cls=combine_classes(diff, aspect("16/9")),
tabindex="0"
)
assert img_diff.tag == "figure"
assert "diff" in img_diff.attrs['class']
assert "aspect-16/9" in img_diff.attrs['class']
assert img_diff.attrs['tabindex'] == "0"
# Verify structure
assert len(img_diff.children) == 3 # item1, item2, resizer
# Verify first item
item1 = img_diff.children[0]
assert item1.tag == "div"
assert "diff-item-1" in item1.attrs['class']
assert item1.attrs['role'] == "img"
assert item1.attrs['tabindex'] == "0"
assert item1.children[0].tag == "img"
assert item1.children[0].attrs['alt'] == "daisy"
assert item1.children[0].attrs['src'] == "https://img.daisyui.com/images/stock/photo-1560717789-0ac7c58ac90a.webp"
# Verify second item
item2 = img_diff.children[1]
assert item2.tag == "div"
assert "diff-item-2" in item2.attrs['class']
assert item2.attrs['role'] == "img"
assert 'tabindex' not in item2.attrs # Only first item has tabindex
assert item2.children[0].tag == "img"
assert item2.children[0].attrs['alt'] == "daisy"
assert item2.children[0].attrs['src'] == "https://img.daisyui.com/images/stock/photo-1560717789-0ac7c58ac90a-blur.webp"
# Verify resizer
resizer = img_diff.children[2]
assert resizer.tag == "div"
assert "diff-resizer" in resizer.attrs['class']
assert resizer.children == () # Empty
# Diff text
text_diff = Figure(
Div(
Div(
"DAISY",
cls=combine_classes(bg_dui.primary, text_dui.primary_content, grid_display, place_content.center, font_size._9xl, font_weight.black)
),
cls=str(diff_item_1),
role="img",
tabindex="0"
),
Div(
Div(
"DAISY",
cls=combine_classes(bg_dui.base_200, grid_display, place_content.center, font_size._9xl, font_weight.black)
),
cls=str(diff_item_2),
role="img"
),
Div(cls=str(diff_resizer)),
cls=combine_classes(diff, aspect("16/9")),
tabindex="0"
)
assert text_diff.tag == "figure"
assert "diff" in text_diff.attrs['class']
assert "aspect-16/9" in text_diff.attrs['class']
# Verify text diff structure
assert len(text_diff.children) == 3
# Verify first text item
text_item1 = text_diff.children[0]
assert text_item1.tag == "div"
assert "diff-item-1" in text_item1.attrs['class']
assert text_item1.attrs['role'] == "img"
assert text_item1.attrs['tabindex'] == "0"
# Check inner div with styling
inner1 = text_item1.children[0]
assert inner1.tag == "div"
assert "bg-primary" in inner1.attrs['class']
assert "text-primary-content" in inner1.attrs['class']
assert "grid" in inner1.attrs['class']
assert "place-content-center" in inner1.attrs['class']
assert "text-9xl" in inner1.attrs['class']
assert "font-black" in inner1.attrs['class']
assert inner1.children[0] == "DAISY"
# Verify second text item
text_item2 = text_diff.children[1]
assert text_item2.tag == "div"
assert "diff-item-2" in text_item2.attrs['class']
assert text_item2.attrs['role'] == "img"
# Check inner div with different styling
inner2 = text_item2.children[0]
assert inner2.tag == "div"
assert "bg-base-200" in inner2.attrs['class']
assert "grid" in inner2.attrs['class']
assert "place-content-center" in inner2.attrs['class']
assert "text-9xl" in inner2.attrs['class']
assert "font-black" in inner2.attrs['class']
assert inner2.children[0] == "DAISY"
# Return the components in a Div
return Div(img_diff, text_diff)
# Run the tests
test_diff_basic_fasthtml_examples()
test_func = test_diff_basic_fasthtml_examples
app, rt = create_test_app(theme=DaisyUITheme.LIGHT)
@rt
def index():
return create_test_page(test_func.__doc__.title().replace('.', ''), test_func())
server = start_test_server(app)
display(HTMX())
server.stop()