` element. It's for
+ this reason that, depending on whether the element being constructed has
+ non-string a child element, we need to assign a `text` vs `tail` attribute
+ to that element or the last non-string child respectively.
+ """
+ if len(element):
+ last_child = element[-1]
+ last_child.tail = f"{last_child.tail or ''}{c}"
+ else:
+ element.text = f"{element.text or ''}{c}"
+
+
def _mutate_vdom(vdom: VdomDict) -> None:
"""Performs any necessary mutations on the VDOM attributes to meet VDOM spec.
@@ -195,7 +263,7 @@ def _mutate_vdom(vdom: VdomDict) -> None:
def _generate_vdom_children(
node: etree._Element, transforms: Iterable[_ModelTransform]
-) -> List[Union[VdomDict, str]]:
+) -> list[VdomDict | str]:
"""Generates a list of VDOM children from an lxml node.
Inserts inner text and/or tail text inbetween VDOM children, if necessary.
@@ -221,5 +289,37 @@ def _hypen_to_camel_case(string: str) -> str:
return first.lower() + remainder.title().replace("-", "")
-class HTMLParseError(etree.LxmlSyntaxError): # type: ignore[misc]
- """Raised when an HTML document cannot be parsed using strict parsing."""
+def _vdom_attr_to_html_str(key: str, value: Any) -> tuple[str, str]:
+ if key == "style":
+ if isinstance(value, dict):
+ value = ";".join(
+ # We lower only to normalize - CSS is case-insensitive:
+ # https://www.w3.org/TR/css-fonts-3/#font-family-casing
+ f"{_CAMEL_CASE_SUB_PATTERN.sub('-', k).lower()}:{v}"
+ for k, v in value.items()
+ )
+ elif (
+ # camel to data-* attributes
+ key.startswith("data")
+ # camel to aria-* attributes
+ or key.startswith("aria")
+ # handle special cases
+ or key in _DASHED_HTML_ATTRS
+ ):
+ key = _CAMEL_CASE_SUB_PATTERN.sub("-", key)
+
+ assert not callable(
+ value
+ ), f"Could not convert callable attribute {key}={value} to HTML"
+
+ # Again, we lower the attribute name only to normalize - HTML is case-insensitive:
+ # http://w3c.github.io/html-reference/documents.html#case-insensitivity
+ return key.lower(), str(value)
+
+
+# Pattern for delimitting camelCase names (e.g. camelCase to camel-case)
+_CAMEL_CASE_SUB_PATTERN = re.compile(r"(? None:
def _use_callable(initial_func: _Func) -> Tuple[_Func, Callable[[_Func], None]]:
- state = hooks.use_state(lambda: initial_func)
- return state[0], lambda new: state[1](lambda old: new)
+ state, set_state = hooks.use_state(lambda: initial_func)
+ return state, lambda new: set_state(lambda old: new)
diff --git a/tests/test_backend/test__common.py b/tests/test_backend/test__common.py
new file mode 100644
index 000000000..e575625a2
--- /dev/null
+++ b/tests/test_backend/test__common.py
@@ -0,0 +1,58 @@
+import pytest
+
+from idom import html
+from idom.backend._common import traversal_safe_path, vdom_head_elements_to_html
+
+
+@pytest.mark.parametrize(
+ "bad_path",
+ [
+ "../escaped",
+ "ok/../../escaped",
+ "ok/ok-again/../../ok-yet-again/../../../escaped",
+ ],
+)
+def test_catch_unsafe_relative_path_traversal(tmp_path, bad_path):
+ with pytest.raises(ValueError, match="Unsafe path"):
+ traversal_safe_path(tmp_path, *bad_path.split("/"))
+
+
+@pytest.mark.parametrize(
+ "vdom_in, html_out",
+ [
+ (
+ "example",
+ "example",
+ ),
+ (
+ # We do not modify strings given by user. If given as VDOM we would have
+ # striped this head element, but since provided as string, we leav as-is.
+ "",
+ "",
+ ),
+ (
+ html.head(
+ html.meta({"charset": "utf-8"}),
+ html.title("example"),
+ ),
+ # we strip the head element
+ 'example',
+ ),
+ (
+ html._(
+ html.meta({"charset": "utf-8"}),
+ html.title("example"),
+ ),
+ 'example',
+ ),
+ (
+ [
+ html.meta({"charset": "utf-8"}),
+ html.title("example"),
+ ],
+ 'example',
+ ),
+ ],
+)
+def test_vdom_head_elements_to_html(vdom_in, html_out):
+ assert vdom_head_elements_to_html(vdom_in) == html_out
diff --git a/tests/test_backend/test_common.py b/tests/test_backend/test_all.py
similarity index 87%
rename from tests/test_backend/test_common.py
rename to tests/test_backend/test_all.py
index f0856b209..98036cb16 100644
--- a/tests/test_backend/test_common.py
+++ b/tests/test_backend/test_all.py
@@ -5,7 +5,7 @@
import idom
from idom import html
from idom.backend import default as default_implementation
-from idom.backend._urls import PATH_PREFIX
+from idom.backend._common import PATH_PREFIX
from idom.backend.types import BackendImplementation, Connection, Location
from idom.backend.utils import all_implementations
from idom.testing import BackendFixture, DisplayFixture, poll
@@ -155,3 +155,20 @@ def ShowRoute():
# we can't easily narrow this check
assert hook_val.current is not None
+
+
+@pytest.mark.parametrize("imp", all_implementations())
+async def test_customized_head(imp: BackendImplementation, page):
+ custom_title = f"Custom Title for {imp.__name__}"
+
+ @idom.component
+ def sample():
+ return html.h1(f"^ Page title is customized to: '{custom_title}'")
+
+ async with BackendFixture(
+ implementation=imp,
+ options=imp.Options(head=html.title(custom_title)),
+ ) as server:
+ async with DisplayFixture(backend=server, driver=page) as display:
+ await display.show(sample)
+ assert (await display.page.title()) == custom_title
diff --git a/tests/test_backend/test_utils.py b/tests/test_backend/test_utils.py
index b55cdd990..c3cb13613 100644
--- a/tests/test_backend/test_utils.py
+++ b/tests/test_backend/test_utils.py
@@ -8,7 +8,6 @@
from idom.backend import flask as flask_implementation
from idom.backend.utils import find_available_port
from idom.backend.utils import run as sync_run
-from idom.backend.utils import traversal_safe_path
from idom.sample import SampleApp as SampleApp
@@ -45,16 +44,3 @@ async def test_run(page: Page, exit_stack: ExitStack):
await page.goto(url)
await page.wait_for_selector("#sample")
-
-
-@pytest.mark.parametrize(
- "bad_path",
- [
- "../escaped",
- "ok/../../escaped",
- "ok/ok-again/../../ok-yet-again/../../../escaped",
- ],
-)
-def test_catch_unsafe_relative_path_traversal(tmp_path, bad_path):
- with pytest.raises(ValueError, match="Unsafe path"):
- traversal_safe_path(tmp_path, *bad_path.split("/"))
diff --git a/tests/test_utils.py b/tests/test_utils.py
index 861fc315d..405cdce05 100644
--- a/tests/test_utils.py
+++ b/tests/test_utils.py
@@ -1,7 +1,10 @@
+from html import escape as html_escape
+
import pytest
import idom
-from idom.utils import HTMLParseError, html_to_vdom
+from idom import html
+from idom.utils import HTMLParseError, html_to_vdom, vdom_to_html
def test_basic_ref_behavior():
@@ -149,3 +152,81 @@ def test_html_to_vdom_with_no_parent_node():
}
assert html_to_vdom(source) == expected
+
+
+SOME_OBJECT = object()
+
+
+@pytest.mark.parametrize(
+ "vdom_in, html_out",
+ [
+ (
+ html.div("hello"),
+ "hello
",
+ ),
+ (
+ html.div(SOME_OBJECT),
+ f"{html_escape(str(SOME_OBJECT))}
",
+ ),
+ (
+ html.div({"someAttribute": SOME_OBJECT}),
+ f'',
+ ),
+ (
+ html.div(
+ "hello", html.a({"href": "https://example.com"}, "example"), "world"
+ ),
+ '',
+ ),
+ (
+ html.button({"onClick": lambda event: None}),
+ "",
+ ),
+ (
+ html._("hello ", html._("world")),
+ "hello world",
+ ),
+ (
+ html._(html.div("hello"), html._("world")),
+ "hello
world",
+ ),
+ (
+ html.div({"style": {"backgroundColor": "blue", "marginLeft": "10px"}}),
+ '',
+ ),
+ (
+ html.div({"style": "background-color:blue;margin-left:10px"}),
+ '',
+ ),
+ (
+ html._(
+ html.div("hello"),
+ html.a({"href": "https://example.com"}, "example"),
+ ),
+ 'hello