2023-12-31 03:08:05 +00:00
|
|
|
let
|
|
|
|
style = import ../nixite/style.nix;
|
|
|
|
html = import ../nixite/html.nix;
|
|
|
|
it = import ./it.nix;
|
|
|
|
|
2024-01-01 03:20:59 +00:00
|
|
|
in [
|
|
|
|
|
|
|
|
(it "makes a p component" (let
|
|
|
|
my = (style.styled "para" "p" { style = { some-style = "some value"; }; });
|
|
|
|
in {
|
|
|
|
expected = html.tag "p" { class = [ "para" ]; } "yes";
|
|
|
|
actual = my.para { } "yes";
|
|
|
|
asString = true;
|
|
|
|
}))
|
2023-12-31 21:33:42 +00:00
|
|
|
|
2024-01-01 03:20:59 +00:00
|
|
|
(it "extends existing components" (let
|
|
|
|
my = (style.styled "generic" "p" {
|
|
|
|
foo = "bar";
|
|
|
|
forgetme = "nothing";
|
|
|
|
});
|
|
|
|
this = (style.styled "quote" my.generic {
|
2023-12-31 21:33:42 +00:00
|
|
|
baz = "baz";
|
|
|
|
forgetme = "forgotten";
|
2023-12-31 17:51:21 +00:00
|
|
|
});
|
2024-01-01 03:20:59 +00:00
|
|
|
in {
|
2023-12-31 21:33:42 +00:00
|
|
|
expected = html.tag "p" {
|
|
|
|
forgetme = "forgotten";
|
|
|
|
baz = "baz";
|
|
|
|
foo = "bar";
|
|
|
|
class = [ "generic" "quote" ];
|
|
|
|
} "yes";
|
2024-01-01 03:20:59 +00:00
|
|
|
actual = this.quote { } "yes";
|
2023-12-31 21:33:42 +00:00
|
|
|
asString = true;
|
2024-01-01 03:20:59 +00:00
|
|
|
}))
|
|
|
|
|
|
|
|
(it "makes a component with no class"
|
|
|
|
(let my = (style.styled "classless" "div" { class = [ ]; });
|
|
|
|
in {
|
|
|
|
expected = html.tag "div" { class = [ ]; } "yes";
|
|
|
|
actual = my.classless { } "yes";
|
|
|
|
asString = true;
|
|
|
|
}))
|
2024-01-01 04:41:56 +00:00
|
|
|
|
|
|
|
(it "does not error without attrs" (let
|
|
|
|
my = (style.styled "div" "div" {
|
|
|
|
class = [ "something" ];
|
|
|
|
style = { this = "that"; };
|
|
|
|
});
|
|
|
|
in{
|
2024-01-01 03:20:59 +00:00
|
|
|
expected = html.tag "div" { class = [ "div" "something" ]; } "yes";
|
|
|
|
actual = my.div "yes";
|
2023-12-31 17:51:21 +00:00
|
|
|
asString = true;
|
2024-01-01 04:41:56 +00:00
|
|
|
}))
|
|
|
|
|
|
|
|
(it "makes a component" (let
|
|
|
|
my = (style.styled "div" "div" {
|
|
|
|
class = [ "something" ];
|
|
|
|
style = { this = "that"; };
|
|
|
|
});
|
|
|
|
in{
|
2023-12-31 21:33:42 +00:00
|
|
|
expected = html.tag "div" { class = [ "div" "something" ]; } "foobar";
|
|
|
|
actual = my.div { } "foobar";
|
2023-12-31 17:51:21 +00:00
|
|
|
asString = true;
|
2024-01-01 04:41:56 +00:00
|
|
|
}))
|
|
|
|
|
|
|
|
(it "makes special components" (let
|
|
|
|
|
|
|
|
my = (style.styled "s" "div" {
|
|
|
|
id = "s";
|
|
|
|
class = [ "something" ];
|
|
|
|
style = { s = "yes"; };
|
|
|
|
});
|
|
|
|
in{
|
2023-12-31 03:08:41 +00:00
|
|
|
expected = html.tag "div" {
|
|
|
|
id = "s";
|
2023-12-31 21:33:42 +00:00
|
|
|
class = [ "s" "something" ];
|
2023-12-31 03:08:41 +00:00
|
|
|
} "foobar";
|
2023-12-31 21:33:42 +00:00
|
|
|
actual = my.s { } "foobar";
|
2023-12-31 17:51:21 +00:00
|
|
|
asString = true;
|
2024-01-01 04:41:56 +00:00
|
|
|
}))
|
|
|
|
(it "works on many classes" (let
|
|
|
|
my = (style.styled "foobar" "div" {
|
|
|
|
class = [ "foo" "bar" ];
|
|
|
|
style = { something = "something"; };
|
|
|
|
});
|
|
|
|
in{
|
2023-12-31 21:33:42 +00:00
|
|
|
expected = html.tag "div" { class = [ "foobar" "foo" "bar" ]; } "foobar";
|
|
|
|
actual = my.foobar { } "foobar";
|
2023-12-31 17:51:21 +00:00
|
|
|
asString = true;
|
2024-01-01 04:41:56 +00:00
|
|
|
}))
|
|
|
|
(it "does custom behavour" (let
|
|
|
|
|
|
|
|
my = (style.styled "list" "ul" {
|
|
|
|
__child = child:
|
|
|
|
assert builtins.isList child;
|
|
|
|
(map (html.tag "li" { }) child);
|
|
|
|
});
|
|
|
|
in {
|
2023-12-31 21:33:42 +00:00
|
|
|
expected = html.tag "ul" {
|
|
|
|
__ = "";
|
|
|
|
class = [ "list" ];
|
|
|
|
} [ (html.tag "li" { } "1") (html.tag "li" { } "2") ];
|
|
|
|
actual = my.list { } [ "1" "2" ];
|
2023-12-31 17:51:21 +00:00
|
|
|
asString = true;
|
2024-01-01 04:41:56 +00:00
|
|
|
}))
|
|
|
|
(it "combines attrs" (let
|
|
|
|
|
|
|
|
my = (style.styled "div" "div" {
|
|
|
|
class = [ "something" ];
|
|
|
|
style = { this = "that"; };
|
|
|
|
}) (style.styled "s" "div" {
|
|
|
|
id = "s";
|
|
|
|
class = [ "something" ];
|
|
|
|
style = { s = "yes"; };
|
|
|
|
}) (style.styled "foobar" "div" {
|
|
|
|
class = [ "foo" "bar" ];
|
|
|
|
style = { something = "something"; };
|
|
|
|
}) (style.style "body" { foo = "bar"; }) (style.styled "list" "ul" {
|
|
|
|
__child = child:
|
|
|
|
assert builtins.isList child;
|
|
|
|
(map (html.tag "li" { }) child);
|
|
|
|
});
|
|
|
|
in {
|
2023-12-31 03:08:41 +00:00
|
|
|
expected = html.tag "div" {
|
|
|
|
id = "foo";
|
2023-12-31 21:33:42 +00:00
|
|
|
class = [ "div" "something" ];
|
2023-12-31 03:08:41 +00:00
|
|
|
} "foobar";
|
2023-12-31 21:33:42 +00:00
|
|
|
actual = my.div { id = "foo"; } "foobar";
|
2023-12-31 17:51:21 +00:00
|
|
|
asString = true;
|
2024-01-01 04:41:56 +00:00
|
|
|
}))
|
2024-01-01 03:20:59 +00:00
|
|
|
(it "makes a style"
|
|
|
|
(let my = (style.styled "para" "p" { style = { foo = "bar"; }; });
|
|
|
|
in {
|
|
|
|
expected = { "p.para" = { foo = "bar"; }; };
|
|
|
|
actual = removeAttrs my.style [ "__toString" ];
|
|
|
|
}))
|
|
|
|
|
|
|
|
(it "retains tag"
|
|
|
|
(let p = (style.styled "para" "p" { style = { foo = "bar"; }; });
|
|
|
|
in {
|
|
|
|
expected = "p";
|
|
|
|
actual = p.para.tag;
|
|
|
|
}))
|
|
|
|
|
|
|
|
(it "retains attrs"
|
|
|
|
(let p = (style.styled "para" "p" { style = { foo = "bar"; }; });
|
|
|
|
in {
|
|
|
|
expected = { foo = "bar"; };
|
|
|
|
actual = p.para.attrs.style;
|
|
|
|
}))
|
|
|
|
|
|
|
|
(it "retains class" (let p = (style.styled "para" "p" { });
|
|
|
|
in {
|
|
|
|
expected = [ "para" ];
|
|
|
|
actual = p.para.attrs.class;
|
|
|
|
}))
|
|
|
|
|
|
|
|
(it "merges styles" (let
|
|
|
|
p = (style.styled "para" "p" { style = { foo = "bar"; }; });
|
|
|
|
d = (style.styled "para2" p.para { style = { baz = "bar"; }; });
|
|
|
|
my = p d;
|
|
|
|
in {
|
|
|
|
expected = {
|
|
|
|
"p.para" = { foo = "bar"; };
|
|
|
|
"p.para2.para" = {
|
|
|
|
foo = "bar";
|
|
|
|
baz = "bar";
|
|
|
|
};
|
|
|
|
};
|
|
|
|
actual = removeAttrs my.style [ "__toString" ];
|
|
|
|
}))
|
|
|
|
|
2024-01-01 04:41:56 +00:00
|
|
|
(it "fetches empty style"
|
|
|
|
(let
|
|
|
|
para = (style.tag "p" "para" {});
|
|
|
|
in {
|
|
|
|
expected = {"p.para" = {};};
|
|
|
|
actual = style.getStyle ( para "" );
|
|
|
|
}))
|
|
|
|
|
|
|
|
(it "fetches style"
|
|
|
|
(let
|
|
|
|
attrs = { style = { foo = "bar"; }; };
|
|
|
|
para = (style.tag "p" "para" attrs);
|
|
|
|
in {
|
|
|
|
expected = {"p.para" = attrs.style;};
|
|
|
|
actual = style.getStyle ( para "" );
|
|
|
|
}))
|
|
|
|
|
|
|
|
(it "fetches style for class"
|
|
|
|
(let
|
|
|
|
s = { foo = "bar"; };
|
|
|
|
para = (style.tag "p" "para" {style = s;});
|
|
|
|
in {
|
|
|
|
expected = {"p.para" = s;};
|
|
|
|
actual = style.getStyle ( para "" );
|
|
|
|
}))
|
|
|
|
|
|
|
|
(it "fetches style recursively"
|
|
|
|
(let
|
|
|
|
s = {
|
|
|
|
"p.para" = { foo = "bar"; };
|
|
|
|
"a.link" = { this = "that"; };
|
|
|
|
};
|
|
|
|
para = (style.tag "p" "para" {style = s."p.para";});
|
|
|
|
a = (style.tag "a" "link" {style = s."a.link";});
|
|
|
|
in {
|
|
|
|
expected = s;
|
|
|
|
actual = style.getStyles ( para (a "hello") );
|
|
|
|
}))
|
|
|
|
|
|
|
|
(it "fetches style recursively through lists"
|
|
|
|
(let
|
|
|
|
s = {
|
|
|
|
"p.para" = { foo = "bar"; };
|
|
|
|
"a.link" = { this = "that"; };
|
|
|
|
};
|
|
|
|
para = (style.tag "p" "para" {style = s."p.para";});
|
|
|
|
a = (style.tag "a" "link" {style = s."a.link";});
|
|
|
|
in {
|
|
|
|
expected = s;
|
|
|
|
actual = style.getStyles ( para [(a "hello")] );
|
|
|
|
}))
|
|
|
|
|
|
|
|
(it "fetches style recursively with repeats"
|
|
|
|
(let
|
|
|
|
s = {
|
|
|
|
"p.para" = { foo = "bar"; };
|
|
|
|
"a.link" = { this = "that"; };
|
|
|
|
};
|
|
|
|
para = (style.tag "p" "para" {style = s."p.para";});
|
|
|
|
a = (style.tag "a" "link" {style = s."a.link";});
|
|
|
|
in {
|
|
|
|
expected = s;
|
|
|
|
actual = style.getStyles ( para [(a "hello") (a "hello")] );
|
|
|
|
}))
|
|
|
|
|
|
|
|
(it "converts styles to string"
|
|
|
|
(let
|
|
|
|
s = {
|
|
|
|
"p.para" = { foo = "bar"; };
|
|
|
|
"a.link" = { this = "that"; };
|
|
|
|
};
|
|
|
|
in {
|
|
|
|
expected = ''
|
|
|
|
a.link {
|
|
|
|
this: that;
|
|
|
|
}
|
|
|
|
p.para {
|
|
|
|
foo: bar;
|
|
|
|
}
|
|
|
|
'';
|
|
|
|
actual = style.stylesToString s;
|
|
|
|
}))
|
|
|
|
|
2023-12-31 03:08:41 +00:00
|
|
|
]
|