Separate parserender test, small template additions and fixes
This commit is contained in:
@@ -148,52 +148,4 @@ window.testSuites.push( class testParse {
|
|||||||
|
|
||||||
window.Registry.parseConstructor(Space)
|
window.Registry.parseConstructor(Space)
|
||||||
}
|
}
|
||||||
|
|
||||||
// CopyTo() {
|
|
||||||
// let str = "render=()=>{VStack(()=>{"
|
|
||||||
// let ret = str.copyTo("{")
|
|
||||||
|
|
||||||
// if(ret !== "render=()=>") return "Copy 1 failed!"
|
|
||||||
// }
|
|
||||||
|
|
||||||
ParseRender() {
|
|
||||||
class Sidebar extends Shadow {
|
|
||||||
$$windowState = windowState
|
|
||||||
$$form = Forms.observe(window.location.pathname)
|
|
||||||
$sidebarPos = -200
|
|
||||||
|
|
||||||
render = () => {
|
|
||||||
VStack(() => {
|
|
||||||
ForEach(this.form.children, (form) => {
|
|
||||||
switch(form.constructor.name) {
|
|
||||||
case "File":
|
|
||||||
SidebarFile(form)
|
|
||||||
break
|
|
||||||
case "Space":
|
|
||||||
SidebarSpace(form)
|
|
||||||
break
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.background("black")
|
|
||||||
.positionType("absolute")
|
|
||||||
.x(this.windowState.sidebarOut ? 0 : -200)
|
|
||||||
.y(0)
|
|
||||||
.width(200, "px")
|
|
||||||
.height(100, "vh")
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
let result = new Registry.parseRender(Sidebar).parse()
|
|
||||||
console.log(result)
|
|
||||||
|
|
||||||
let expectedOutput = "[[VStack.ForEach, form.children], [VStack.x, windowState.sidebarOut]]"
|
|
||||||
|
|
||||||
if(JSON.stringify(result) !== JSON.stringify(expectedOutput)) {
|
|
||||||
return "Result does not match expected array!"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// disallow addEventListener inside of render
|
|
||||||
|
|
||||||
})
|
})
|
||||||
54
Test/parserender.test.js
Normal file
54
Test/parserender.test.js
Normal file
@@ -0,0 +1,54 @@
|
|||||||
|
window.testSuites.push(
|
||||||
|
|
||||||
|
|
||||||
|
class ParseRender {
|
||||||
|
// CopyTo() {
|
||||||
|
// let str = "render=()=>{VStack(()=>{"
|
||||||
|
// let ret = str.copyTo("{")
|
||||||
|
|
||||||
|
// if(ret !== "render=()=>") return "Copy 1 failed!"
|
||||||
|
// }
|
||||||
|
|
||||||
|
ParseRender() {
|
||||||
|
class Sidebar extends Shadow {
|
||||||
|
$$windowState = windowState
|
||||||
|
$$form = Forms.observe(window.location.pathname)
|
||||||
|
$sidebarPos = -200
|
||||||
|
|
||||||
|
render = () => {
|
||||||
|
VStack(() => {
|
||||||
|
ForEach(this.form.children, (form) => {
|
||||||
|
switch(form.constructor.name) {
|
||||||
|
case "File":
|
||||||
|
SidebarFile(form)
|
||||||
|
break
|
||||||
|
case "Space":
|
||||||
|
SidebarSpace(form)
|
||||||
|
break
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
.background("black")
|
||||||
|
.positionType("absolute")
|
||||||
|
.x(this.windowState.sidebarOut ? 0 : -200)
|
||||||
|
.y(0)
|
||||||
|
.width(200, "px")
|
||||||
|
.height(100, "vh")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
let result = new Registry.parseRender(Sidebar).parse()
|
||||||
|
console.log(result)
|
||||||
|
|
||||||
|
let expectedOutput = "[[VStack.ForEach, form.children], [VStack.x, windowState.sidebarOut]]"
|
||||||
|
|
||||||
|
if(JSON.stringify(result) !== JSON.stringify(expectedOutput)) {
|
||||||
|
return "Result does not match expected array!"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// only functions which return a view may be called
|
||||||
|
// no addEventListener usage
|
||||||
|
}
|
||||||
|
|
||||||
|
)
|
||||||
@@ -5,6 +5,7 @@ await import ("./parse.test.js")
|
|||||||
await import ("./init.test.js")
|
await import ("./init.test.js")
|
||||||
await import ("./render.test.js")
|
await import ("./render.test.js")
|
||||||
await import ("./observedobject.test.js")
|
await import ("./observedobject.test.js")
|
||||||
|
await import ("./parserender.test.js")
|
||||||
|
|
||||||
window.randomName = function randomName(prefix) {
|
window.randomName = function randomName(prefix) {
|
||||||
const sanitizedPrefix = prefix.toLowerCase().replace(/[^a-z0-9]/g, '');
|
const sanitizedPrefix = prefix.toLowerCase().replace(/[^a-z0-9]/g, '');
|
||||||
|
|||||||
13
app.js
Normal file
13
app.js
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
/*
|
||||||
|
Captured Sun
|
||||||
|
*/
|
||||||
|
|
||||||
|
"use strict";
|
||||||
|
|
||||||
|
class Home extends Page {
|
||||||
|
render = () => {
|
||||||
|
("hello world")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Home
|
||||||
17
index.html
17
index.html
@@ -5,18 +5,13 @@
|
|||||||
<link rel="icon" href="">
|
<link rel="icon" href="">
|
||||||
<link rel="stylesheet" href="">
|
<link rel="stylesheet" href="">
|
||||||
<script src=""></script>
|
<script src=""></script>
|
||||||
<script type="module" src="https://server.parchment.page/quill.js"></script>
|
<script src="Quill/index.js"></script>
|
||||||
<script type="module">
|
<script type="module">
|
||||||
// EXAMPLE ROUTES
|
import Home from "./app.js"
|
||||||
// import President from "./Web/President/President.js";
|
|
||||||
// import RepublicanPrimaries from "./Web/President/RepublicanPrimaries.js";
|
window.routes = {
|
||||||
// import MyRepresentatives from "./Web/myRepresentatives/MyRepresentatives.js";
|
"/": Home
|
||||||
|
}
|
||||||
// window.routes = {
|
|
||||||
// "/": President,
|
|
||||||
// "/exampleone": RepublicanPrimaries,
|
|
||||||
// "/exampletwo/examplethree": MyRepresentatives
|
|
||||||
// }
|
|
||||||
</script>
|
</script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
4
index.js
4
index.js
@@ -675,6 +675,10 @@ function extendHTMLElementWithStyleSetters() {
|
|||||||
extendHTMLElementWithStyleSetters();
|
extendHTMLElementWithStyleSetters();
|
||||||
|
|
||||||
HTMLElement.prototype.padding = function(direction, value) {
|
HTMLElement.prototype.padding = function(direction, value) {
|
||||||
|
if(!value) {
|
||||||
|
this.style.padding = direction;
|
||||||
|
}
|
||||||
|
|
||||||
const directionName = `padding${direction.charAt(0).toUpperCase()}${direction.slice(1)}`;
|
const directionName = `padding${direction.charAt(0).toUpperCase()}${direction.slice(1)}`;
|
||||||
if (typeof value === 'number') {
|
if (typeof value === 'number') {
|
||||||
this.style[directionName] = `${value}px`;
|
this.style[directionName] = `${value}px`;
|
||||||
|
|||||||
Reference in New Issue
Block a user