sam/Quill
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ternaries almost done, adding margin function

Browse Source
This commit is contained in:
metacryst
2024-05-17 12:47:17 -05:00
parent 8b2f9e2b77
commit 41ec6b7dd3
8 changed files with 350 additions and 189 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
Test/observedobject.test.js
View File

@@ -41,6 +41,91 @@ window.testSuites.push( class testObservedObject {
// throw some sort of warning if a global OO is accessed without "this"
DefaultObservedObject() {
window.Form = class Form extends ObservedObject {
id
path
$canvasPosition
}
class File extends Shadow {
$$form = Form.create({id: "123", path: "/", canvasPosition: "25|25"})
render = () => {
p(this.form.path)
}
}
window.register(File, "file-1")
let file = window.File()
if(file.firstChild?.innerText !== "/") {
return "Path is not inside of paragraph tag"
}
}
ObservedObject() {
let Form = class Form extends ObservedObject {
id
$path
$canvasPosition
}
let object = Form.create({id: "123", path: "/", canvasPosition: "25|25"});
register(class File extends Shadow {
$$form
render = () => {
p(this.form.path)
}
}, randomName("file"))
let file = File(object)
if(file.firstChild?.innerText !== "/") {
return "Path is not inside of paragraph tag"
}
object.path = "/asd"
if(file.form.path !== "/asd") {
return "Path did not change when changing original object"
}
if(file.firstChild?.innerText !== "/asd") {
return "Observed Object did not cause a reactive change"
}
}
ObservedObjectWithArray() {
let Form = class Form extends ObservedObject {
id
$children
}
let object = Form.create({id: "123", children: [{path: "berry"}, {path: "blue"}]});
register(class File extends Shadow {
$$form
render = () => {
ForEach(this.form.children, (child) => {
p(child.path)
})
}
}, randomName("file"))
let file = File(object)
if(file.firstChild?.innerText !== "berry" || file.children[1].innerText !== "blue") {
return "Paths did not render correctly in children"
}
file.form.children.push({path: "hello"})
if(file.children.length !== 3) {
return "No reactivity for adding children"
}
}
NotExtensible() {
return "not done"
}

18
Test/parserender.test.js
View File

@@ -1,13 +1,19 @@
/*
"(" is preceding character: el, el.attr, if, switch
el: the el is window.rendering
el.attr:
find the function and attr in the string
if there are multiple instances of being used with this el, add to a list (and if no list then make it and we are first)
if: the el is window.rendering. rerender el
switch: the el is window.rendering. rerender el
*/
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 {

159
Test/render.test.js
View File

@@ -1,159 +0,0 @@
window.testSuites.push( class testRender {
SimpleParagraphWithState() {
class File extends Shadow {
$form
render = () => {
p(this.form.data)
}
constructor() {
super()
}
}
window.register(File, randomName("file"))
let form = {data: "asdf"}
const el = window.File(form)
if(!(el.firstChild?.matches("p"))) {
return `Child paragraph not rendered`
}
if(!(el.firstChild.innerText === "asdf")) {
return "Child para does not have inner text"
}
}
ParagraphConstructorChangeState() {
register(class File extends Shadow {
$name
render = () => {
p(this.name)
}
constructor() {
super()
}
}, randomName("file"))
let name = "asdf"
const file = File(name)
file.name = "hey123"
if(file.firstChild.innerText !== "hey123") {
return "Paragraph did not react to change!"
}
}
LiteralDoesNotCreateFalseReactivity() {
register(class File extends Shadow {
$name = "asd"
render = () => {
p(this.name)
p("asd")
}
constructor() {
super()
}
}, randomName("file"))
const file = File()
file.name = "hey123"
if(file.children[1].innerText === "hey123") {
return "Paragraph innertext falsely changed"
}
}
DefaultObservedObject() {
window.Form = class Form extends ObservedObject {
id
path
$canvasPosition
}
class File extends Shadow {
$$form = Form.create({id: "123", path: "/", canvasPosition: "25|25"})
render = () => {
p(this.form.path)
}
}
window.register(File, "file-1")
let file = window.File()
if(file.firstChild?.innerText !== "/") {
return "Path is not inside of paragraph tag"
}
}
ObservedObject() {
let Form = class Form extends ObservedObject {
id
$path
$canvasPosition
}
let object = Form.create({id: "123", path: "/", canvasPosition: "25|25"});
register(class File extends Shadow {
$$form
render = () => {
p(this.form.path)
}
}, randomName("file"))
let file = File(object)
if(file.firstChild?.innerText !== "/") {
return "Path is not inside of paragraph tag"
}
object.path = "/asd"
if(file.form.path !== "/asd") {
return "Path did not change when changing original object"
}
if(file.firstChild?.innerText !== "/asd") {
return "Observed Object did not cause a reactive change"
}
}
ObservedObjectWithArray() {
let Form = class Form extends ObservedObject {
id
$children
}
let object = Form.create({id: "123", children: [{path: "berry"}, {path: "blue"}]});
register(class File extends Shadow {
$$form
render = () => {
ForEach(this.form.children, (child) => {
p(child.path)
})
}
}, randomName("file"))
let file = File(object)
if(file.firstChild?.innerText !== "berry" || file.children[1].innerText !== "blue") {
return "Paths did not render correctly in children"
}
file.form.children.push({path: "hello"})
if(file.children.length !== 3) {
return "No reactivity for adding children"
}
}
})

41
Test/stacks.test.js Normal file
View File

@@ -0,0 +1,41 @@
window.testSuites.push( class testStacks {
NestedChildren() {
register(class File extends Shadow {
$name
render = () => {
p(this.name)
VStack(() => {
p("Learn to code inside of a startup")
p("➵")
.position("absolute")
.fontSize(30)
.left("50%")
.top("50%")
.transformOrigin("center")
.transform("translate(-50%, -50%) rotate(90deg)")
.transition("all 1s")
.userSelect("none")
.onAppear((self) => {
setTimeout(() => {
self.style.top = "88%"
}, 100)
})
})
}
constructor() {
super()
}
}, randomName("file"))
const file = File("asdf")
if(file.querySelector(".VStack")?.children.length !== 2) {
return "Incorrect amount of children inside vstack!"
}
}
})

102
Test/state.test.js Normal file
View File

@@ -0,0 +1,102 @@
window.testSuites.push( class testState {
SimpleParagraphWithState() {
class File extends Shadow {
$form
render = () => {
p(this.form.data)
}
constructor() {
super()
}
}
window.register(File, randomName("file"))
let form = {data: "asdf"}
const el = window.File(form)
if(!(el.firstChild?.matches("p"))) {
return `Child paragraph not rendered`
}
if(!(el.firstChild.innerText === "asdf")) {
return "Child para does not have inner text"
}
}
ParagraphConstructorChangeState() {
register(class File extends Shadow {
$name
render = () => {
p(this.name)
}
constructor() {
super()
}
}, randomName("file"))
let name = "asdf"
const file = File(name)
file.name = "hey123"
if(file.firstChild.innerText !== "hey123") {
return "Paragraph did not react to change!"
}
}
LiteralDoesNotCreateFalseReactivity() {
register(class File extends Shadow {
$name = "asd"
render = () => {
p(this.name)
p("asd")
}
constructor() {
super()
}
}, randomName("file"))
const file = File()
file.name = "hey123"
if(file.children[1].innerText === "hey123") {
return "Paragraph innertext falsely changed"
}
}
/*
State itself should check if the reactivity is based on an element or a standalone expression
If standalone, handle it
If element, push the info for initReactivity to handle it
*/
TernaryInState() {
register(class File extends Shadow {
$name
render = () => {
p(this.name)
.fontSize(this.name === "asdf" ? 16 : 32)
}
constructor() {
super()
}
}, randomName("file"))
let name = "asdf"
const file = File(name)
if(file.style.fontSize !== "16px") {
return "fail"
}
}
})

3
Test/test.js
View File

@@ -3,9 +3,10 @@ window.testSuites = [];
await import ("./parse.test.js")
await import ("./init.test.js")
await import ("./render.test.js")
await import ("./observedobject.test.js")
await import ("./parserender.test.js")
await import ("./stacks.test.js")
await import ("./state.test.js")
window.randomName = function randomName(prefix) {
const sanitizedPrefix = prefix.toLowerCase().replace(/[^a-z0-9]/g, '');