state test working, added random experimental html

2025-12-26 01:36:04 -06:00
parent b08e2767f6
commit c4560aba37
5 changed files with 302 additions and 21 deletions
--- a/Test/Pages/home.js
+++ b/Test/Pages/home.js
@@ -1,7 +0,0 @@
-class Home extends Page {
-
-    render = () => {
-    }
-}
-
-export default Home
--- a/Test/state/state.test.js
+++ b/Test/state/state.test.js
@@ -0,0 +1,71 @@
+window.testSuites.push( class testState {
+    SimpleState() {
+        class Home extends Shadow {
+            state = {
+                pathname: "/"
+            }
+
+            render() {
+                VStack(() => {
+                    p("hi")
+                        .top(() => {return (this.state.pathname === "/" ? [11, vw] : [7, vw])})
+                })
+                .onAppear(() => {
+                    this.state.pathname = "/asd"
+                })
+            }
+        }
+
+        register(Home, randomName("home"))
+        window.Home()
+        if(!($("p").style.top === "7vw")) return "state was not respeccted"
+    }
+
+    StateArrayPush() {
+        class Home extends Shadow {
+            state = {
+                logs: []
+            }
+
+            render() {
+                VStack(() => {
+                    p("hi")
+                        .fontSize(() => {return this.state.logs.length > 0 ? [2, em] : [1, em]})
+                })
+                .onAppear(() => {
+                    this.state.logs = ["one", "two"]
+                })
+            }
+        }
+
+        register(Home, randomName("home"))
+        window.Home()
+
+        if(!($("p").style.fontSize === "2em")) return "state did not update!"
+    }
+
+    SimpleStack() {
+        class Home extends Shadow {
+            state = {
+                logs: []
+            }
+
+            render() {
+                VStack(() => {
+                    let asd = this.state.logs.length * 2
+                    p("hi")
+                        .fontSize(asd, vw)
+                })
+                .onAppear(() => {
+                    this.state.logs = ["one", "two"]
+                })
+            }
+        }
+
+        register(Home, randomName("home"))
+        window.Home()
+        
+        if(!($("p").style.fontSize === "4vw")) return "state did not update!"
+    }
+
+})
--- a/Test/test.html
+++ b/Test/test.html
@@ -6,13 +6,6 @@
    <link rel="stylesheet" href="">
    <script src="../index.js"></script>
    <script src="test.js" type="module"></script>
-    <script type="module">
-      import Home from "./Pages/home.js";
-
-      window.routes = {
-          "/Test": Home
-      }
-    </script>
  </head>
  <body style="background: rgb(242, 194, 147)">

--- a/Test/test.js
+++ b/Test/test.js
@@ -1,13 +1,7 @@
 console.log("Tests initializing.")
 window.testSuites = [];

-await import ("./Skeleton/parse.test.js")
-await import ("./Skeleton/init.test.js")
-await import ("./Skeleton/observedobject.test.js")
-await import ("./Skeleton/parserender.test.js")
-await import ("./Skeleton/state.test.js")
-await import ("./Element/stacks.test.js")
-await import ("./Element/Group.test.js")
+await import ("./state/state.test.js")

 window.randomName = function randomName(prefix) {
    const sanitizedPrefix = prefix.toLowerCase().replace(/[^a-z0-9]/g, '');
@@ -43,6 +37,7 @@ window.test = async function() {
            let test = suiteContents[i];
            if(typeof suite[test] === 'function' && test !== "constructor") {
                testNum++;
+                document.body.innerHTML = ""
                console.log(`%c${testNum}. ${test}`, "margin-top: 10px; border-top: 2px solid #e9c9a0; color: #e9c9a0; border-radius: 10px; padding: 10px;");
                
                let fail;