🔀 Add support for element fragments. (#99)

* #16 add fragment POC

* WIP

* 16 add fragment support to morph

* add keys for fragments

* ensure proper fragment order, refactor to handle fragment/element more similarly

* fix comment typo, incorrect child typo, simplify key check

* fix comment typo

* add snapshot tests

* flatten fragment using fold right, appending elements

* doc update

---------

Co-authored-by: Hayleigh Thompson <me@hayleigh.dev>

1 files changed, 51 insertions, 0 deletions

diff --git a/test/lustre_test.gleam b/test/lustre_test.gleam
index 9e47a01..f3a2993 100644
--- a/test/lustre_test.gleam
+++ b/test/lustre_test.gleam
@@ -1,6 +1,7 @@
 // IMPORTS ---------------------------------------------------------------------
 
 import apps/counter
+import apps/fragment
 import apps/static
 import birdie
 import gleam/erlang/process
@@ -98,3 +99,53 @@ pub fn counter_diff_test() {
   birdie.snap(json.to_string(patch.element_diff_to_json(diff)), title)
   process.send(runtime, Shutdown)
 }
+
+pub fn fragment_init_test() {
+  let title = "Can render an application's initial state when using fragments"
+  let app = lustre.simple(fragment.init, fragment.update, fragment.view)
+  let assert Ok(runtime) = lustre.start_actor(app, 0)
+  let el =
+    process.call(
+      runtime,
+      function.curry2(process.send)
+        |> function.compose(View)
+        |> function.compose(Debug),
+      100,
+    )
+
+  birdie.snap(element.to_string(el), title)
+  process.send(runtime, Shutdown)
+}
+
+pub fn fragment_counter_diff_test() {
+  let title = "Can compute a diff from one render to the next with fragments"
+  let app = lustre.simple(fragment.init, fragment.update, fragment.view)
+  let assert Ok(runtime) = lustre.start_actor(app, 0)
+
+  let prev =
+    process.call(
+      runtime,
+      function.curry2(process.send)
+        |> function.compose(View)
+        |> function.compose(Debug),
+      100,
+    )
+
+  process.send(runtime, Dispatch(fragment.Increment))
+  process.send(runtime, Dispatch(fragment.Increment))
+  process.send(runtime, Dispatch(fragment.Increment))
+
+  let next =
+    process.call(
+      runtime,
+      function.curry2(process.send)
+        |> function.compose(View)
+        |> function.compose(Debug),
+      100,
+    )
+
+  let diff = patch.elements(prev, next)
+
+  birdie.snap(json.to_string(patch.element_diff_to_json(diff)), title)
+  process.send(runtime, Shutdown)
+}