+ These are the contents.
+
These are the contents.
+ )
+ ).innerHTML
+ ).toBe(
+ `
`
+ );
+ });
+
+ // We're testing for native functionality of class here, not className
+ test("Class", async () => {
+ expect(
+ testContainer(
+ render(
+
+ )
+ ).innerHTML
+ ).toBe(
+ ``
+ );
+ });
+
+ // We're testing for native functionality of style here, which should always directly set style as an attribute
+ // when passed in as a string
+ test("Style", async () => {
+ expect(
+ testContainer(
+ render(
+
+ )
+ ).innerHTML
+ ).toBe(
+ ``
+ );
+ });
+});
+
+describe("Basic Events", () => {
+ test("Click-event", async () => {
+ let clicked = false;
+ let clickHandler = (ev)=>{
+ clicked = true;
+
+ // TODO test on properties that should be on a native click event
+ };
+ /** @type {HTMLButtonElement} */
+ let button = render();
+
+ document.body.append(button);
+ button.click();
+ expect(clicked).toBe(true);
+ document.body.removeChild(button);
+ });
+
+ test("Focus-event", async () => {
+ // This test exists just to have a second event to test, ideally we would have used two-part word event
+ // like focusin, but unfortunatily, it does not seem to be working. (probably JSDOM related?)
+ let focused = false;
+ let focusHandler = (ev)=>{
+ focused = true;
+ };
+ /** @type {HTMLButtonElement} */
+ let input = render();
+
+ document.body.append(input);
+ input.focus();
+ expect(focused).toBe(true);
+ document.body.removeChild(input);
+ });
+});
+
+describe("Children", () => {
+ test("3 levels", async () => {
+ expect(
+ testContainer(
+ render(
+ + Contents +
+ +Contents
`, + ``, + `