nixite/testing/style.test.nix

let
  style = import ../nixite/style.nix;
  html = import ../nixite/html.nix;
  it = import ./it.nix;

  my =
    (style.styled "p" "p" {} {
      some-style = "some value";
    })
    (style.styled "div" "div" {class = ["something"];} {
      this = "that";
    })
    (style.styled "s" "div" {
        id = "s";
        class = ["something"];
      } {
        s = "yes";
      })
    (style.styled "foobar" "div" {class = ["foo" "bar"];} {
      something = "something";
    })
    (style.style "body" {
      foo = "bar";
    })
    (style.styled "list" "ul" {
      __child = child:
        assert builtins.isList child; (map (html.tag "li" {}) child);
    } {});
in [
  (it "makes a p component" {
    expected = html.tag "p" {class = ["p"];} "yes";
    actual = my.p {} "yes";
  })
  (it "does not error without attrs" {
    expected = html.tag "p" {class = ["p"];} "yes";
    actual = my.p "yes";
  })
  (it "makes a component" {
    expected = html.tag "div" {class = ["something"];} "foobar";
    actual = my.div {} "foobar";
  })
  (it "makes special components" {
    expected = html.tag "div" {
      id = "s";
      class = ["something"];
    } "foobar";
    actual = my.s {} "foobar";
  })
  (it "works on many classes" {
    expected = html.tag "div" {class = ["foo" "bar"];} "foobar";
    actual = my.foobar {} "foobar";
  })
  (it "does custom behavour" {
    expected = toString (html.tag "ul" {
        __ = "";
        class = ["list"];
      } [
        (html.tag "li" {} "1")
        (html.tag "li" {} "2")
      ]);
    actual = toString (my.list {} ["1" "2"]);
  })
  (it "combines attrs" {
    expected = html.tag "div" {
      id = "foo";
      class = ["something"];
    } "foobar";
    actual = my.div {id = "foo";} "foobar";
  })
  (it "makes a style" {
    expected = ''
      p.p {
        some-style: some value;
      }
      div.something {
        this: that;
      }
      div.something#s {
        s: yes;
      }
      div.foo.bar {
        something: something;
      }
      body {
        foo: bar;
      }
    '';
    actual = my.style;
  })
]