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

  p = style.styled "generic" "p" {
    foo = "bar";
    forgetme = "nothing";
  };

  my = (style.styled "p" "p" { style = { some-style = "some value"; }; })
    (style.styled "classless" "div" { class = [ ]; })
    (style.styled "quote" p.generic {
      baz = "baz";
      forgetme = "forgotten";
    }) (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 [
  (it "extends existing components" {
    expected = html.tag "p" {
      forgetme = "forgotten";
      baz = "baz";
      foo = "bar";
      class = [ "generic" "quote" ];
    } "yes";
    actual = my.quote { } "yes";
    asString = true;
  })
  (it "makes a p component" {
    expected = html.tag "p" { class = [ "p" ]; } "yes";
    actual = my.p { } "yes";
    asString = true;
  })
  (it "makes a component with no class" {
    expected = html.tag "div" { class = [ ]; } "yes";
    actual = my.classless { } "yes";
    asString = true;
  })
  (it "does not error without attrs" {
    expected = html.tag "p" { class = [ "p" ]; } "yes";
    actual = my.p "yes";
    asString = true;
  })
  (it "makes a component" {
    expected = html.tag "div" { class = [ "div" "something" ]; } "foobar";
    actual = my.div { } "foobar";
    asString = true;
  })
  (it "makes special components" {
    expected = html.tag "div" {
      id = "s";
      class = [ "s" "something" ];
    } "foobar";
    actual = my.s { } "foobar";
    asString = true;
  })
  (it "works on many classes" {
    expected = html.tag "div" { class = [ "foobar" "foo" "bar" ]; } "foobar";
    actual = my.foobar { } "foobar";
    asString = true;
  })
  (it "does custom behavour" {
    expected = html.tag "ul" {
      __ = "";
      class = [ "list" ];
    } [ (html.tag "li" { } "1") (html.tag "li" { } "2") ];
    actual = my.list { } [ "1" "2" ];
    asString = true;
  })
  (it "combines attrs" {
    expected = html.tag "div" {
      id = "foo";
      class = [ "div" "something" ];
    } "foobar";
    actual = my.div { id = "foo"; } "foobar";
    asString = true;
  })
  (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;
  })
]