2020-02-03 10:24:25 +01:00
|
|
|
import { JSDOM } from "jsdom"
|
|
|
|
|
import { loadBudibase } from "../src/index"
|
|
|
|
|
|
2020-02-21 16:20:00 +01:00
|
|
|
export const load = async (page, screens, url, appRootPath) => {
|
|
|
|
|
screens = screens || []
|
|
|
|
|
url = url || "/"
|
|
|
|
|
appRootPath = appRootPath || ""
|
2020-02-10 16:51:09 +01:00
|
|
|
const dom = new JSDOM("<!DOCTYPE html><html><body></body><html>", {
|
|
|
|
|
url: `http://test${url}`,
|
|
|
|
|
})
|
|
|
|
|
autoAssignIds(page.props)
|
|
|
|
|
for (let s of screens) {
|
|
|
|
|
autoAssignIds(s.props)
|
|
|
|
|
}
|
|
|
|
|
setAppDef(dom.window, page, screens)
|
2020-05-29 15:06:10 +02:00
|
|
|
addWindowGlobals(dom.window, page, screens, appRootPath, {
|
2020-02-12 13:45:24 +01:00
|
|
|
hierarchy: {},
|
|
|
|
|
actions: [],
|
|
|
|
|
triggers: [],
|
|
|
|
|
})
|
2020-02-18 13:29:38 +01:00
|
|
|
setComponentCodeMeta(page, screens)
|
2020-02-03 10:24:25 +01:00
|
|
|
const app = await loadBudibase({
|
|
|
|
|
componentLibraries: allLibs(dom.window),
|
|
|
|
|
window: dom.window,
|
|
|
|
|
localStorage: createLocalStorage(),
|
|
|
|
|
})
|
|
|
|
|
return { dom, app }
|
2020-01-24 14:18:31 +01:00
|
|
|
}
|
|
|
|
|
|
2020-05-29 15:06:10 +02:00
|
|
|
const addWindowGlobals = (window, page, screens, appRootPath) => {
|
2020-02-12 13:45:24 +01:00
|
|
|
window["##BUDIBASE_FRONTEND_DEFINITION##"] = {
|
|
|
|
|
page,
|
|
|
|
|
screens,
|
2020-02-21 16:20:00 +01:00
|
|
|
appRootPath,
|
2020-02-12 13:45:24 +01:00
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2020-02-10 16:51:09 +01:00
|
|
|
export const makePage = props => ({ props })
|
|
|
|
|
export const makeScreen = (route, props) => ({ props, route })
|
|
|
|
|
|
|
|
|
|
export const timeout = ms => new Promise(resolve => setTimeout(resolve, ms))
|
|
|
|
|
|
|
|
|
|
export const walkComponentTree = (node, action) => {
|
|
|
|
|
action(node)
|
|
|
|
|
|
2020-02-18 13:29:38 +01:00
|
|
|
// works for nodes or props
|
|
|
|
|
const children = node.children || node._children
|
|
|
|
|
|
|
|
|
|
if (children) {
|
|
|
|
|
for (let child of children) {
|
2020-02-10 16:51:09 +01:00
|
|
|
walkComponentTree(child, action)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2020-02-03 10:24:25 +01:00
|
|
|
// this happens for real by the builder...
|
2020-01-28 15:14:53 +01:00
|
|
|
// ..this only assigns _ids when missing
|
2020-02-03 10:24:25 +01:00
|
|
|
const autoAssignIds = (props, count = 0) => {
|
|
|
|
|
if (!props._id) {
|
|
|
|
|
props._id = `auto_id_${count}`
|
|
|
|
|
}
|
|
|
|
|
if (props._children) {
|
|
|
|
|
for (let child of props._children) {
|
|
|
|
|
count += 1
|
|
|
|
|
autoAssignIds(child, count)
|
2020-01-28 15:14:53 +01:00
|
|
|
}
|
2020-02-03 10:24:25 +01:00
|
|
|
}
|
|
|
|
|
}
|
2020-01-28 15:14:53 +01:00
|
|
|
|
2020-02-18 13:29:38 +01:00
|
|
|
// any component with an id that include "based_on_store" is
|
|
|
|
|
// assumed to have code that depends on store value
|
|
|
|
|
const setComponentCodeMeta = (page, screens) => {
|
|
|
|
|
const setComponentCodeMeta_single = props => {
|
|
|
|
|
walkComponentTree(props, c => {
|
|
|
|
|
if (c._id.indexOf("based_on_store") >= 0) {
|
|
|
|
|
c._codeMeta = { dependsOnStore: true }
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
setComponentCodeMeta_single(page.props)
|
|
|
|
|
for (let s of screens || []) {
|
|
|
|
|
setComponentCodeMeta_single(s.props)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2020-02-10 16:51:09 +01:00
|
|
|
const setAppDef = (window, page, screens) => {
|
2020-02-10 22:35:51 +01:00
|
|
|
window["##BUDIBASE_FRONTEND_DEFINITION##"] = {
|
2020-02-03 10:24:25 +01:00
|
|
|
componentLibraries: [],
|
2020-02-10 16:51:09 +01:00
|
|
|
page,
|
|
|
|
|
screens,
|
2020-02-03 10:24:25 +01:00
|
|
|
appRootPath: "",
|
|
|
|
|
}
|
2020-01-24 14:18:31 +01:00
|
|
|
}
|
|
|
|
|
|
2020-02-03 10:24:25 +01:00
|
|
|
const allLibs = window => ({
|
|
|
|
|
testlib: maketestlib(window),
|
|
|
|
|
})
|
2020-01-24 14:18:31 +01:00
|
|
|
|
|
|
|
|
const createLocalStorage = () => {
|
2020-02-03 10:24:25 +01:00
|
|
|
const data = {}
|
|
|
|
|
return {
|
|
|
|
|
getItem: key => data[key],
|
|
|
|
|
setItem: (key, value) => (data[key] = value),
|
|
|
|
|
}
|
2020-01-24 14:18:31 +01:00
|
|
|
}
|
|
|
|
|
|
2020-02-03 10:24:25 +01:00
|
|
|
const maketestlib = window => ({
|
|
|
|
|
div: function(opts) {
|
|
|
|
|
const node = window.document.createElement("DIV")
|
|
|
|
|
const defaultChild = window.document.createElement("DIV")
|
|
|
|
|
defaultChild.className = "default-child"
|
|
|
|
|
node.appendChild(defaultChild)
|
|
|
|
|
|
|
|
|
|
let currentProps = { ...opts.props }
|
|
|
|
|
let childNodes = []
|
|
|
|
|
|
|
|
|
|
const set = props => {
|
|
|
|
|
currentProps = Object.assign(currentProps, props)
|
|
|
|
|
node.className = currentProps.className || ""
|
|
|
|
|
if (currentProps._children && currentProps._children.length > 0) {
|
|
|
|
|
if (currentProps.append) {
|
|
|
|
|
for (let c of childNodes) {
|
|
|
|
|
node.removeChild(c)
|
|
|
|
|
}
|
2020-02-14 12:51:45 +01:00
|
|
|
const components = currentProps._bb.attachChildren(node, {
|
|
|
|
|
hydrate: false,
|
|
|
|
|
})
|
2020-02-03 10:24:25 +01:00
|
|
|
childNodes = components.map(c => c.component._element)
|
|
|
|
|
} else {
|
2020-02-14 12:51:45 +01:00
|
|
|
currentProps._bb.attachChildren(node)
|
2020-01-24 14:18:31 +01:00
|
|
|
}
|
2020-02-03 10:24:25 +01:00
|
|
|
}
|
2020-01-24 14:18:31 +01:00
|
|
|
}
|
|
|
|
|
|
2020-02-10 16:51:09 +01:00
|
|
|
this.$destroy = () => opts.target.removeChild(node)
|
|
|
|
|
|
2020-02-03 10:24:25 +01:00
|
|
|
this.$set = set
|
|
|
|
|
this._element = node
|
|
|
|
|
set(opts.props)
|
|
|
|
|
opts.target.appendChild(node)
|
|
|
|
|
},
|
2020-01-28 15:14:53 +01:00
|
|
|
|
2020-02-03 10:24:25 +01:00
|
|
|
h1: function(opts) {
|
|
|
|
|
const node = window.document.createElement("H1")
|
2020-01-24 14:18:31 +01:00
|
|
|
|
2020-02-03 10:24:25 +01:00
|
|
|
let currentProps = { ...opts.props }
|
2020-01-28 15:14:53 +01:00
|
|
|
|
2020-02-03 10:24:25 +01:00
|
|
|
const set = props => {
|
|
|
|
|
currentProps = Object.assign(currentProps, props)
|
|
|
|
|
if (currentProps.text) {
|
|
|
|
|
node.innerText = currentProps.text
|
|
|
|
|
}
|
2020-01-28 15:14:53 +01:00
|
|
|
}
|
2020-01-24 14:18:31 +01:00
|
|
|
|
2020-02-10 16:51:09 +01:00
|
|
|
this.$destroy = () => opts.target.removeChild(node)
|
|
|
|
|
|
2020-02-03 10:24:25 +01:00
|
|
|
this.$set = set
|
|
|
|
|
this._element = node
|
|
|
|
|
set(opts.props)
|
|
|
|
|
opts.target.appendChild(node)
|
|
|
|
|
},
|
2020-02-18 13:29:38 +01:00
|
|
|
|
|
|
|
|
button: function(opts) {
|
|
|
|
|
const node = window.document.createElement("BUTTON")
|
|
|
|
|
|
|
|
|
|
let currentProps = { ...opts.props }
|
|
|
|
|
|
|
|
|
|
const set = props => {
|
|
|
|
|
currentProps = Object.assign(currentProps, props)
|
|
|
|
|
if (currentProps.onClick) {
|
|
|
|
|
node.addEventListener("click", () => {
|
|
|
|
|
const testText = currentProps.testText || "hello"
|
|
|
|
|
currentProps._bb.call(props.onClick, { testText })
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.$destroy = () => opts.target.removeChild(node)
|
|
|
|
|
|
|
|
|
|
this.$set = set
|
|
|
|
|
this._element = node
|
|
|
|
|
set(opts.props)
|
|
|
|
|
opts.target.appendChild(node)
|
|
|
|
|
},
|
2020-05-29 15:06:10 +02:00
|
|
|
})
|
