omiax - chore

* Using mock document
* Add example build script

packages/omiax/config/codemod-const.js

@@ -0,0 +1,43 @@
+/* eslint no-console:0 */
+
+/** Find constants (identified by ALL_CAPS_DECLARATIONS), and inline them globally.
+ *	This is safe because Omi *only* uses global constants.
+ */
+export default (file, api) => {
+	let j = api.jscodeshift,
+		code = j(file.source),
+		constants = {},
+		found = 0;
+
+	code
+		.find(j.VariableDeclaration)
+		.filter(decl => {
+			for (let i = decl.value.declarations.length; i--; ) {
+				let node = decl.value.declarations[i],
+					name = node.id && node.id.name,
+					init = node.init;
+				if (name && init && name.match(/^[A-Z0-9_$]+$/g) && !init.regex) {
+					if (init.type === "Literal") {
+						// console.log(`Inlining constant: ${name}=${init.raw}`);
+						found++;
+						constants[name] = init;
+						// remove declaration
+						decl.value.declarations.splice(i, 1);
+						// if it's the last, we'll remove the whole statement
+						return !decl.value.declarations.length;
+					}
+				}
+			}
+			return false;
+		})
+		.remove();
+
+	code
+		.find(j.Identifier)
+		.filter(
+			path => path.value.name && constants.hasOwnProperty(path.value.name)
+		)
+		.replaceWith(path => (found++, constants[path.value.name]));
+
+	return found ? code.toSource({ quote: "single" }) : null;
+};

packages/omiax/config/codemod-let-name.js

@@ -0,0 +1,16 @@
+/**
+ * Restores var names transformed by babel's let block scoping
+ */
+export default (file, api) => {
+	let j = api.jscodeshift;
+	let code = j(file.source);
+
+	// @TODO unsafe, but without it we gain 20b gzipped: https://www.diffchecker.com/bVrOJWTO
+	code
+		.findVariableDeclarators()
+		.filter(d => /^_i/.test(d.value.id.name))
+		.renameTo("i");
+	code.findVariableDeclarators("_key").renameTo("key");
+
+	return code.toSource({ quote: "single" });
+};

packages/omiax/config/codemod-strip-tdz.js

@@ -0,0 +1,62 @@
+/* eslint no-console:0 */
+
+// parent node types that we don't want to remove pointless initializations from (because it breaks hoisting)
+const BLOCKED = ["ForStatement", "WhileStatement"]; // 'IfStatement', 'SwitchStatement'
+
+/** Removes var initialization to `void 0`, which Babel adds for TDZ strictness. */
+export default (file, api) => {
+	let { jscodeshift } = api,
+		found = 0;
+
+	let code = jscodeshift(file.source)
+		.find(jscodeshift.VariableDeclaration)
+		.forEach(handleDeclaration);
+
+	function handleDeclaration(decl) {
+		let p = decl,
+			remove = true;
+
+		while ((p = p.parentPath)) {
+			if (~BLOCKED.indexOf(p.value.type)) {
+				remove = false;
+				break;
+			}
+		}
+
+		decl.value.declarations.filter(isPointless).forEach(node => {
+			if (remove === false) {
+				console.log(
+					`> Skipping removal of undefined init for "${node.id.name}": within ${
+						p.value.type
+					}`
+				);
+			} else {
+				removeNodeInitialization(node);
+			}
+		});
+	}
+
+	function removeNodeInitialization(node) {
+		node.init = null;
+		found++;
+	}
+
+	function isPointless(node) {
+		let { init } = node;
+		if (init) {
+			if (
+				init.type === "UnaryExpression" &&
+				init.operator === "void" &&
+				init.argument.value == 0
+			) {
+				return true;
+			}
+			if (init.type === "Identifier" && init.name === "undefined") {
+				return true;
+			}
+		}
+		return false;
+	}
+
+	return found ? code.toSource({ quote: "single" }) : null;
+};

packages/omiax/config/eslint-config.js

@@ -0,0 +1,66 @@
+module.exports = {
+	parser: "babel-eslint",
+	// extends: "eslint:recommended",
+	// plugins: ["react"],
+	"extends": ["prettier"],
+    "plugins": ["prettier"],
+	env: {
+		browser: true,
+		mocha: true,
+		node: true,
+		es6: true
+	},
+	parserOptions: {
+		ecmaFeatures: {
+			modules: true,
+			jsx: true
+		}
+	},
+	globals: {
+		sinon: true,
+		expect: true
+	},
+	rules: {
+		"prettier/prettier": "error",
+		"no-unused-vars": [1, { varsIgnorePattern: "^h$" }],
+		"no-cond-assign": 1,
+		"no-empty": 0,
+		"no-console": 1,
+		semi: [1, "never"],
+		camelcase: 0,
+		"comma-style": 2,
+		"comma-dangle": [2, "never"],
+		indent: ["error", 2],
+		"no-mixed-spaces-and-tabs": [2, "smart-tabs"],
+		"no-trailing-spaces": [2, { skipBlankLines: true }],
+		"max-nested-callbacks": [2, 3],
+		"no-eval": 2,
+		"no-implied-eval": 2,
+		"no-new-func": 2,
+		"guard-for-in": 0,
+		eqeqeq: 0,
+		"no-else-return": 2,
+		"no-redeclare": 2,
+		"no-dupe-keys": 2,
+		radix: 2,
+		strict: [2, "never"],
+		"no-shadow": 0,
+		"callback-return": [1, ["callback", "cb", "next", "done"]],
+		"no-delete-var": 2,
+		"no-undef-init": 2,
+		"no-shadow-restricted-names": 2,
+		"handle-callback-err": 0,
+		"no-lonely-if": 2,
+		"keyword-spacing": 2,
+		"constructor-super": 2,
+		"no-this-before-super": 2,
+		"no-dupe-class-members": 2,
+		"no-const-assign": 2,
+		"prefer-spread": 2,
+		"no-useless-concat": 2,
+		"no-var": 2,
+		"object-shorthand": 2,
+		"prefer-arrow-callback": 2,
+		"quotes": [1, "single"]
+	}
+};

packages/omiax/config/properties.json

@@ -0,0 +1,51 @@
+{
+  "props": {
+    "cname": 42,
+    "props": {
+      "$_dirty": "__d",
+      "$_disable": "__x",
+      "$_listeners": "__l",
+      "$_renderCallbacks": "__h",
+      "$__key": "__k",
+      "$__ref": "__r",
+      "$normalizedNodeName": "__n",
+      "$nextBase": "__b",
+      "$prevContext": "__c",
+      "$prevProps": "__p",
+      "$prevState": "__s",
+      "$_parentComponent": "__u",
+      "$_componentConstructor": "_componentConstructor",
+      "$__html": "__html",
+      "$_component": "_component",
+      "$__omiattr_": "__omiattr_",
+      "$_preStyle": "r",
+      "$_id": "s",
+      "$__preactattr_": "t",
+      "$__config__": "v",
+      "$_isMockDocument": "w",
+      "$__omiSsrData": "x",
+      "$_vd": "y",
+      "$_css": "z",
+      "$_proxifyObjectTreeRecursively": "A",
+      "$_isInstalled": "B",
+      "$_useId": "C",
+      "$_useMap": "D",
+      "$___touchX": "F",
+      "$___touchY": "G",
+      "$___scrollTop": "H",
+      "$__elementId": "I",
+      "$_willUpdate": "J",
+      "$_preCss": "K",
+      "$_host": "L",
+      "$_updatePath": "M",
+      "$_customStyleElement": "N",
+      "$_customStyleContent": "O",
+      "$__hasChildren": "P",
+      "$__prevProps": "Q"
+    }
+  },
+  "vars": {
+    "cname": -1,
+    "props": {}
+  }
+}

packages/omiax/config/rollup.config.esm.js

@@ -0,0 +1,10 @@
+import config from "./rollup.config";
+
+// ES output
+config.output.format = "es";
+config.output.file = "dist/omi.esm.js";
+
+// remove memory() plugin
+config.plugins.splice(0, 1);
+
+export default config;

packages/omiax/config/rollup.config.js

@@ -0,0 +1,58 @@
+import nodeResolve from "rollup-plugin-node-resolve";
+import babel from "rollup-plugin-babel";
+import memory from "rollup-plugin-memory";
+
+const license = require("rollup-plugin-license");
+const pkg = require("../package.json");
+const licensePlugin = license({
+	banner:
+		" omi v" +
+		pkg.version +
+		"  http://omijs.org\r\nOmi === Preact + Scoped CSS + Store System + Native Support in 3kb javascript.\r\nBy dntzhang https://github.com/dntzhang \r\n Github: https://github.com/Tencent/omi\r\n MIT Licensed."
+});
+
+export default {
+	input: "src/omi.js",
+	output: {
+		format: "iife",
+		file: "dist/omi.dev.js",
+		name: "omi",
+		sourcemap: true,
+		strict: true
+	},
+	plugins: [
+		memory({
+			path: "src/omi.js",
+			contents: `
+				import Omi from './omi';
+				if (typeof module!='undefined') module.exports = Omi;
+				else self.Omi = Omi;
+			`
+		}),
+		nodeResolve({
+			main: true
+		}),
+		babel({
+			sourceMap: true,
+			exclude: "node_modules/**",
+			babelrc: false,
+			presets: [
+				[
+					"env",
+					{
+						modules: false,
+						loose: true,
+						exclude: ["transform-es2015-typeof-symbol"],
+						targets: {
+							browsers: ["last 2 versions", "IE >= 9"]
+						}
+					}
+				]
+			],
+			plugins: [
+				"transform-class-properties"
+			]
+		}),
+		licensePlugin
+	]
+};

packages/omiax/config/rollup.example.js

@@ -0,0 +1,56 @@
+import nodeResolve from "rollup-plugin-node-resolve";
+import babel from "rollup-plugin-babel";
+import memory from "rollup-plugin-memory";
+import commonjs from "rollup-plugin-commonjs";
+
+var ENV = process.env.npm_lifecycle_event;
+
+export default {
+	input: "examples/" + ENV + "/main.js",
+	output: {
+		format: "iife",
+		file: "examples/" + ENV + "/b.js",
+		name: "omi",
+		sourcemap: true,
+		strict: true
+	},
+	plugins: [
+		memory({
+			path: "src/omi.js",
+			contents: `
+				import Omi from './omi';
+				if (typeof module!='undefined') module.exports = Omi;
+				else self.Omi = Omi;
+			`
+		}),
+		nodeResolve({
+			main: true
+		}),
+		commonjs({
+				include: 'node_modules/**'
+		}),
+		babel({
+			sourceMap: true,
+			exclude: "node_modules/**",
+			babelrc: false,
+			presets: [
+				[
+					"env",
+					{
+						modules: false,
+						loose: true,
+						exclude: ["transform-es2015-typeof-symbol"],
+						targets: {
+							browsers: ["last 2 versions", "IE >= 9"]
+						}
+					}
+				]
+			],
+			plugins: [
+				"transform-decorators-legacy",
+				"transform-class-properties",
+				["transform-react-jsx", { pragma: "Omi.h" }]
+			]
+		})
+	]
+};

packages/omiax/examples/simple/index.html

@@ -0,0 +1,10 @@
+<html>
+
+<head></head>
+
+<body>
+
+	<script src="b.js"></script>
+</body>
+
+</html>

packages/omiax/examples/simple/main.js

@@ -0,0 +1,29 @@
+import { define, WeElement, render } from '../../src/index'
+
+define('my-counter', class extends WeElement {
+  count = 1
+
+  sub = () => {
+    this.count--
+    this.update()
+  }
+
+  add = () => {
+    this.count++
+    this.update()
+  }
+
+  render() {
+    return (
+      <div>
+        <button onClick={this.sub}>-</button>
+        <span style={{
+          color: 'red'
+        }}>{this.count}</span>
+        <button onClick={this.add}>+</button>
+      </div>
+    )
+  }
+})
+
+render(<my-counter />, 'body')

packages/omiax/package.json

@@ -4,13 +4,77 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "simple": "rollup -c config/rollup.example.js --watch"
   },
   "keywords": [
     "omi",
     "cax",
     "omiax"
   ],
+  "devDependencies": {
+    "@types/chai": "^4.1.2",
+    "@types/mocha": "^5.0.0",
+    "@types/node": "^9.4.7",
+    "babel-cli": "^6.24.1",
+    "babel-core": "^6.24.1",
+    "babel-eslint": "^8.2.2",
+    "babel-loader": "^7.0.0",
+    "babel-plugin-transform-class-properties": "^6.24.1",
+    "babel-plugin-transform-decorators-legacy": "^1.3.5",
+    "babel-plugin-transform-object-rest-spread": "^6.23.0",
+    "babel-plugin-transform-react-jsx": "^6.24.1",
+    "babel-preset-env": "^1.6.1",
+    "bundlesize": "^0.17.0",
+    "chai": "^4.1.2",
+    "copyfiles": "^2.0.0",
+    "core-js": "^2.4.1",
+    "coveralls": "^3.0.0",
+    "cross-env": "^5.1.4",
+    "diff": "^3.0.0",
+    "eslint": "^4.18.2",
+    "eslint-config-prettier": "^3.1.0",
+    "eslint-plugin-prettier": "^3.0.0",
+    "eslint-plugin-react": "^7.7.0",
+    "flow-bin": "^0.67.1",
+    "gzip-size-cli": "^2.0.0",
+    "htm": "^2.1.1",
+    "istanbul-instrumenter-loader": "^3.0.0",
+    "jest": "^23.6.0",
+    "jscodeshift": "^0.5.0",
+    "karma": "^2.0.0",
+    "karma-babel-preprocessor": "^7.0.0",
+    "karma-chai-sinon": "^0.1.5",
+    "karma-chrome-launcher": "^2.0.0",
+    "karma-coverage": "^1.0.0",
+    "karma-mocha": "^1.1.1",
+    "karma-mocha-reporter": "^2.0.4",
+    "karma-sauce-launcher": "^1.2.0",
+    "karma-sinon": "^1.0.5",
+    "karma-source-map-support": "^1.2.0",
+    "karma-sourcemap-loader": "^0.3.6",
+    "karma-webpack": "^3.0.0",
+    "mappingjs": "latest",
+    "mobx": "^4.5.1",
+    "mocha": "^5.0.4",
+    "npm-run-all": "^4.0.0",
+    "omi-mobx": "^0.2.2",
+    "omi-tap": "^2.0.2",
+    "omi-transform": "^2.0.2",
+    "prettier": "^1.14.3",
+    "rimraf": "^2.5.3",
+    "rollup": "^0.57.1",
+    "rollup-plugin-babel": "^3.0.2",
+    "rollup-plugin-commonjs": "^9.2.0",
+    "rollup-plugin-license": "^0.6.0",
+    "rollup-plugin-memory": "^3.0.0",
+    "rollup-plugin-node-resolve": "^3.0.0",
+    "sinon": "^4.4.2",
+    "sinon-chai": "^3.0.0",
+    "typescript": "^2.8.1",
+    "to2to": "^1.0.2",
+    "uglify-js": "^2.7.5",
+    "webpack": "^4.3.0"
+  },
   "author": "dntzhang",
   "license": "MIT"
 }

packages/omiax/src/index.js

@@ -0,0 +1,5 @@
+import { define, WeElement, tag, render} from './omi/omi.js'
+
+export {
+  define, WeElement, tag, render
+}

packages/omiax/src/omi/mock/document.js

@@ -0,0 +1,59 @@
+import Element from './element'
+import TextNode from './text-node'
+import { addDoc, removeDoc } from './util'
+
+
+export default class Document {
+  constructor(id) {
+    this.id = id
+    addDoc(id, this)
+    this.nodeMap = {}
+    this._isMockDocument = true
+  }
+
+  // createBody(type, props) {
+  //   if (!this.body) {
+  //     const el = new Element(type, props)
+  //     el.didMount = true
+  //     el.ownerDocument = this
+  //     el.docId = this.id
+  //     el.style.alignItems = 'flex-start'
+  //     this.body = el
+  //   }
+
+  //   return this.body
+  // }
+
+  createElement(tagName, props) {
+    let el = new Element(tagName, props)
+    el.ownerDocument = this
+    el.docId = this.id
+    return el
+	}
+
+	createTextNode(txt){
+		const node = new TextNode(txt)
+		node.docId = this.id
+		return node
+	}
+
+  destroy() {
+    delete this.listener
+    delete this.nodeMap
+    removeDoc(this.id)
+  }
+
+  addEventListener(ref, type) {
+    //document.addEvent(this.id, ref, type)
+  }
+
+  removeEventListener(ref, type) {
+    //document.removeEvent(this.id, ref, type)
+  }
+
+
+  scrollTo(ref, x, y, animated) {
+    document.scrollTo(this.id, ref, x, y, animated)
+  }
+
+}

packages/omiax/src/omi/mock/element.js

@@ -0,0 +1,274 @@
+import {
+	getDoc,
+	uniqueId,
+	linkParent,
+	insertIndex,
+	moveIndex,
+	removeIndex
+} from './util'
+
+const displayMap = {
+	div: 'block',
+	span: 'inline-block'
+}
+
+function registerNode(docId, node) {
+	const doc = getDoc(docId)
+	doc.nodeMap[node.nodeId] = node
+}
+
+export default class Element {
+	constructor(type) {
+		this.nodeType = 1
+		this.nodeId = uniqueId()
+		this.ref = this.nodeId
+		this.type = type
+		this.attributes = {}
+		this.style = {
+			display: displayMap[type]
+		}
+		this.classStyle = {}
+		this.event = {}
+		this.childNodes = []
+
+		this.nodeName = this.type
+
+		this.parentNode = null
+		this.nextSibling = null
+		this.previousSibling = null
+		this.firstChild = null
+	}
+
+	appendChild(node) {
+		if (!node.parentNode) {
+			linkParent(node, this)
+			insertIndex(node, this.childNodes, this.childNodes.length, true)
+
+			if (this.docId != undefined) {
+				registerNode(this.docId, node)
+			}
+
+
+			//this.ownerDocument.addElement(this.ref, node.toJSON(), -1)
+
+		} else {
+			node.parentNode.removeChild(node)
+
+			this.appendChild(node)
+
+			return
+		}
+
+		this.firstChild = this.childNodes[0]
+
+
+	}
+
+	insertBefore(node, before) {
+		if (!node.parentNode) {
+			linkParent(node, this)
+			const index = insertIndex(
+				node,
+				this.childNodes,
+				this.childNodes.indexOf(before),
+				true
+			)
+			if (this.docId != undefined) {
+				registerNode(this.docId, node)
+			}
+
+
+			//this.ownerDocument.addElement(this.ref, node.toJSON(), index)
+
+		} else {
+			node.parentNode.removeChild(node)
+			this.insertBefore(node, before)
+			return
+		}
+
+		this.firstChild = this.childNodes[0]
+	}
+
+	insertAfter(node, after) {
+		if (node.parentNode && node.parentNode !== this) {
+			return
+		}
+		if (
+			node === after ||
+			(node.previousSibling && node.previousSibling === after)
+		) {
+			return
+		}
+		if (!node.parentNode) {
+			linkParent(node, this)
+			const index = insertIndex(
+				node,
+				this.childNodes,
+				this.childNodes.indexOf(after) + 1,
+				true
+			)
+
+			if (this.docId != undefined) {
+				registerNode(this.docId, node)
+			}
+
+			//this.ownerDocument.addElement(this.ref, node.toJSON(), index)
+
+		} else {
+			const index = moveIndex(
+				node,
+				this.childNodes,
+				this.childNodes.indexOf(after) + 1
+			)
+
+			//this.ownerDocument.moveElement(node.ref, this.ref, index)
+
+		}
+
+		this.firstChild = this.childNodes[0]
+	}
+
+	removeChild(node) {
+		if (node.parentNode) {
+			removeIndex(node, this.childNodes, true)
+
+
+			this.ownerDocument.removeElement(node.ref)
+
+		}
+
+		node.parentNode = null
+
+
+
+		this.firstChild = this.childNodes[0]
+	}
+
+	setAttribute(key, value, silent) {
+		if (this.attributes[key] === value && silent !== false) {
+			return
+		}
+		this.attributes[key] = value
+		if (!silent) {
+			const result = {}
+			result[key] = value
+
+			this.ownerDocument.setAttr(this.ref, result)
+
+		}
+	}
+
+	removeAttribute(key) {
+		if (this.attributes[key]) {
+			delete this.attributes[key]
+		}
+	}
+
+	setStyle(key, value, silent) {
+		if (this.style[key] === value && silent !== false) {
+			return
+		}
+		this.style[key] = value
+		if (!silent && this.ownerDocument) {
+			const result = {}
+			result[key] = value
+
+			this.ownerDocument.setStyles(this.ref, result)
+
+		}
+	}
+
+	setStyles(styles) {
+		Object.assign(this.style, styles)
+		if (this.ownerDocument) {
+
+			this.ownerDocument.setStyles(this.ref, styles)
+
+		}
+	}
+
+	setClassStyle(classStyle) {
+		for (const key in this.classStyle) {
+			this.classStyle[key] = ''
+		}
+
+		Object.assign(this.classStyle, classStyle)
+
+
+		this.ownerDocument.setStyles(this.ref, this.toStyle())
+
+	}
+
+	addEventListener(type, handler) {
+		if (!this.event[type]) {
+			this.event[type] = handler
+
+			//this.ownerDocument.addEvent(this.ref, type)
+		}
+	}
+
+	removeEventListener(type) {
+		if (this.event[type]) {
+			delete this.event[type]
+			let doc = getDoc(this.docId)
+			doc.nodeMap[this.ref] &&
+				doc.nodeMap[this.ref].event &&
+				doc.nodeMap[this.ref].event[type]
+				? (doc.nodeMap[this.ref].event[type] = null)
+				: ''
+
+			this.ownerDocument.removeEvent(this.ref, type)
+		}
+	}
+
+	fireEvent(type, e) {
+		const handler = this.event[type]
+		if (handler) {
+			return handler.call(this, e)
+		}
+	}
+
+	toStyle() {
+		return Object.assign({}, this.classStyle, this.style)
+	}
+
+	getComputedStyle() { }
+
+	toJSON() {
+		let result = {
+			id: this.ref,
+			type: this.type,
+			docId: this.docId || -10000,
+			attributes: this.attributes ? this.attributes : {}
+		}
+		result.attributes.style = this.toStyle()
+
+		const event = Object.keys(this.event)
+		if (event.length) {
+			result.event = event
+		}
+
+		if (this.childNodes.length) {
+			result.children = this.childNodes.map(child => child.toJSON())
+		}
+		return result
+	}
+
+	replaceChild(newChild, oldChild) {
+		this.insertBefore(newChild, oldChild)
+		this.removeChild(oldChild)
+	}
+
+	destroy() {
+		const doc = getDoc(this.docId)
+
+		if (doc) {
+			delete doc.nodeMap[this.nodeId]
+		}
+
+		this.parentNode = null
+		this.childNodes.forEach(child => {
+			child.destroy()
+		})
+	}
+}

packages/omiax/src/omi/mock/index.js

@@ -0,0 +1,6 @@
+import Document from './document'
+
+
+export default {
+	document: new Document(0)
+}

packages/omiax/src/omi/mock/text-node.js

@@ -0,0 +1,88 @@
+import {
+	getDoc,
+	uniqueId
+} from './util'
+
+
+function registerNode(docId, node) {
+	const doc = getDoc(docId)
+	doc.nodeMap[node.nodeId] = node
+}
+
+export default class TextNode {
+	constructor(nodeValue) {
+		this.nodeType = 3
+		this.nodeId = uniqueId()
+		this.ref = this.nodeId
+		this.attributes = {}
+		this.style = {
+			display: 'inline'
+		}
+		this.classStyle = {}
+		this.event = {}
+		this.nodeValue = nodeValue
+		this.parentNode = null
+		this.nextSibling = null
+		this.previousSibling = null
+		this.firstChild = null
+		this.type = 'text'
+	}
+
+	setAttribute(key, value, silent) {
+		if (this.attributes[key] === value && silent !== false) {
+			return
+		}
+		this.attributes[key] = value
+		if (!silent) {
+			const result = {}
+			result[key] = value
+
+			this.ownerDocument.setAttr(this.ref, result)
+
+		}
+	}
+
+	removeAttribute(key) {
+		if (this.attributes[key]) {
+			delete this.attributes[key]
+		}
+	}
+
+	toStyle() {
+		return Object.assign({}, this.classStyle, this.style)
+	}
+
+	splitText() {
+
+	}
+
+	getComputedStyle() { }
+
+	toJSON() {
+		let result = {
+			id: this.ref,
+			type: this.type,
+			docId: this.docId || -10000,
+			attributes: this.attributes ? this.attributes : {}
+		}
+		result.attributes.style = this.toStyle()
+
+		const event = Object.keys(this.event)
+		if (event.length) {
+			result.event = event
+		}
+
+		return result
+	}
+
+	destroy() {
+		const doc = getDoc(this.docId)
+
+		if (doc) {
+			delete doc.nodeMap[this.nodeId]
+		}
+
+		this.parentNode = null
+
+	}
+}

packages/omiax/src/omi/mock/util.js

@@ -112,8 +112,9 @@ export function linkParent(node, parent) {
     node.ownerDocument = parent.ownerDocument
     node.ownerDocument.nodeMap[node.nodeId] = node
     node.depth = parent.depth + 1
-  }
-  node.childNodes.forEach(child => {
+	}
+
+  node.childNodes && node.childNodes.forEach(child => {
     linkParent(child, node)
   })
 }

packages/omiax/src/omi/native/document.js

@@ -1,97 +0,0 @@
-import Element from './element'
-import { addDoc, removeDoc } from './util'
-
-//get document module from global bridge
-const { document } = global.bridge
-
-export default class Document {
-  constructor(id) {
-    this.id = id
-    addDoc(id, this)
-    this.nodeMap = {}
-    this._isMockDocument = true
-    this.keyframes = {}
-  }
-
-  createBody(type, props) {
-    if (!this.body) {
-      const el = new Element(type, props)
-      el.didMount = true
-      el.ownerDocument = this
-      el.docId = this.id
-      el.style.alignItems = 'flex-start'
-      this.body = el
-    }
-
-    return this.body
-  }
-
-  createElement(tagName, props) {
-    let el = new Element(tagName, props)
-    el.ownerDocument = this
-    el.docId = this.id
-    return el
-  }
-
-  destroy() {
-    delete this.listener
-    delete this.nodeMap
-    removeDoc(this.id)
-  }
-
-  createFinish() {
-    document.createFinish(this.id, this.body.toJSON())
-  }
-
-  updateFinish() {
-    document.updateFinish(this.id)
-  }
-
-  addElement(ref, element, index) {
-    document.addElement(this.id, ref, element, index)
-  }
-
-  moveElement(ref, parentRef, index) {
-    document.moveElement(this.id, ref, parentRef, index)
-  }
-
-  removeElement(ref) {
-    document.removeElement(this.id, ref)
-  }
-
-  setStyles(ref, result) {
-    document.setStyles(this.id, ref, result)
-  }
-
-  setAttr(ref, result) {
-    document.setAttr(this.id, ref, result)
-  }
-
-  removeAttr(ref, key) {
-    document.removeAttr(this.id, ref, key)
-  }
-
-  addEvent(ref, type) {
-    document.addEvent(this.id, ref, type)
-  }
-
-  removeEvent(ref, type) {
-    document.removeEvent(this.id, ref, type)
-  }
-
-  addKeyframe(frame) {
-    document.addKeyframe(this.id, frame)
-  }
-
-  addKeyframeMap(frames) {
-    document.addKeyframeMap(this.id, frames)
-  }
-
-  scrollTo(ref, x, y, animated) {
-    document.scrollTo(this.id, ref, x, y, animated)
-  }
-
-  getComputedStyle(ref, func) {
-    document.getComputedStyle(this.id, ref, func)
-  }
-}

packages/omiax/src/omi/native/element.js

@@ -1,289 +0,0 @@
-import {
-  getDoc,
-  uniqueId,
-  linkParent,
-  insertIndex,
-  moveIndex,
-  removeIndex
-} from './util'
-
-import { getSendBridgeFlag } from './util'
-
-const sendBridgeFlag = getSendBridgeFlag()
-
-function registerNode(docId, node) {
-  const doc = getDoc(docId)
-  doc.nodeMap[node.nodeId] = node
-}
-
-export default class Element {
-  constructor(type) {
-    this.nodeType = 1
-    this.nodeId = uniqueId()
-    this.ref = this.nodeId
-    this.type = type
-    this.attributes = {}
-    this.style = {}
-    this.classStyle = {}
-    this.event = {}
-    this.childNodes = []
-
-    this.nodeName = this.type
-    this.didMount = false
-    this.parentNode = null
-    this.nextSibling = null
-    this.previousSibling = null
-    this.firstChild = null
-  }
-
-  appendChild(node) {
-    if (!node.parentNode) {
-      linkParent(node, this)
-      insertIndex(node, this.childNodes, this.childNodes.length, true)
-
-      if (this.docId != undefined) {
-        registerNode(this.docId, node)
-      }
-
-      if (this.didMount && sendBridgeFlag[this.docId]) {
-        this.ownerDocument.addElement(this.ref, node.toJSON(), -1)
-      }
-    } else {
-      node.parentNode.removeChild(node)
-
-      this.appendChild(node)
-
-      return
-    }
-
-    this.firstChild = this.childNodes[0]
-
-    if (this.didMount) {
-      this._setDidMount(node, true)
-    }
-  }
-
-  _setDidMount(node, mount) {
-    node.didMount = mount
-    node.childNodes.forEach(child => {
-      this._setDidMount(child, mount)
-    })
-  }
-
-  insertBefore(node, before) {
-    if (!node.parentNode) {
-      linkParent(node, this)
-      const index = insertIndex(
-        node,
-        this.childNodes,
-        this.childNodes.indexOf(before),
-        true
-      )
-      if (this.docId != undefined) {
-        registerNode(this.docId, node)
-      }
-
-      if (this.didMount && sendBridgeFlag[this.docId]) {
-        this.ownerDocument.addElement(this.ref, node.toJSON(), index)
-      }
-    } else {
-      node.parentNode.removeChild(node)
-      this.insertBefore(node, before)
-      return
-    }
-    if (this.didMount) {
-      this._setDidMount(node, true)
-    }
-    this.firstChild = this.childNodes[0]
-  }
-
-  insertAfter(node, after) {
-    if (node.parentNode && node.parentNode !== this) {
-      return
-    }
-    if (
-      node === after ||
-      (node.previousSibling && node.previousSibling === after)
-    ) {
-      return
-    }
-    if (!node.parentNode) {
-      linkParent(node, this)
-      const index = insertIndex(
-        node,
-        this.childNodes,
-        this.childNodes.indexOf(after) + 1,
-        true
-      )
-
-      if (this.docId != undefined) {
-        registerNode(this.docId, node)
-      }
-
-      if (this.didMount && sendBridgeFlag[this.docId]) {
-        this.ownerDocument.addElement(this.ref, node.toJSON(), index)
-      }
-    } else {
-      const index = moveIndex(
-        node,
-        this.childNodes,
-        this.childNodes.indexOf(after) + 1
-      )
-
-      if (this.didMount) {
-        this.ownerDocument.moveElement(node.ref, this.ref, index)
-      }
-    }
-    if (this.didMount) {
-      this._setDidMount(node, true)
-    }
-    this.firstChild = this.childNodes[0]
-  }
-
-  removeChild(node) {
-    if (node.parentNode) {
-      removeIndex(node, this.childNodes, true)
-
-      if (this.didMount && sendBridgeFlag[this.docId]) {
-        this.ownerDocument.removeElement(node.ref)
-      }
-    }
-
-    node.parentNode = null
-
-    this._setDidMount(node, false)
-
-    this.firstChild = this.childNodes[0]
-  }
-
-  setAttribute(key, value, silent) {
-    if (this.attributes[key] === value && silent !== false) {
-      return
-    }
-    this.attributes[key] = value
-    if (!silent) {
-      const result = {}
-      result[key] = value
-      if (this.didMount && sendBridgeFlag[this.docId]) {
-        this.ownerDocument.setAttr(this.ref, result)
-      }
-    }
-  }
-
-  removeAttribute(key) {
-    if (this.attributes[key]) {
-      delete this.attributes[key]
-    }
-  }
-
-  setStyle(key, value, silent) {
-    if (this.style[key] === value && silent !== false) {
-      return
-    }
-    this.style[key] = value
-    if (!silent && this.ownerDocument) {
-      const result = {}
-      result[key] = value
-      if (this.didMount && sendBridgeFlag[this.docId]) {
-        this.ownerDocument.setStyles(this.ref, result)
-      }
-    }
-  }
-
-  setStyles(styles) {
-    Object.assign(this.style, styles)
-    if (this.ownerDocument) {
-      if (this.didMount && sendBridgeFlag[this.docId]) {
-        this.ownerDocument.setStyles(this.ref, styles)
-      }
-    }
-  }
-
-  setClassStyle(classStyle) {
-    for (const key in this.classStyle) {
-      this.classStyle[key] = ''
-    }
-
-    Object.assign(this.classStyle, classStyle)
-
-    if (this.didMount && sendBridgeFlag[this.docId]) {
-      this.ownerDocument.setStyles(this.ref, this.toStyle())
-    }
-  }
-
-  addEventListener(type, handler) {
-    if (!this.event[type]) {
-      this.event[type] = handler
-
-      sendBridgeFlag[this.docId] &&
-        this.didMount &&
-        this.ownerDocument.addEvent(this.ref, type)
-    }
-  }
-
-  removeEventListener(type) {
-    if (this.event[type]) {
-      delete this.event[type]
-      let doc = getDoc(this.docId)
-      doc.nodeMap[this.ref] &&
-      doc.nodeMap[this.ref].event &&
-      doc.nodeMap[this.ref].event[type]
-        ? (doc.nodeMap[this.ref].event[type] = null)
-        : ''
-      sendBridgeFlag[this.docId] &&
-        this.didMount &&
-        this.ownerDocument.removeEvent(this.ref, type)
-    }
-  }
-
-  fireEvent(type, e) {
-    const handler = this.event[type]
-    if (handler) {
-      return handler.call(this, e)
-    }
-  }
-
-  toStyle() {
-    return Object.assign({}, this.classStyle, this.style)
-  }
-
-  getComputedStyle() {}
-
-  toJSON() {
-    let result = {
-      id: this.ref,
-      type: this.type,
-      docId: this.docId || -10000,
-      attributes: this.attributes ? this.attributes : {}
-    }
-    result.attributes.style = this.toStyle()
-
-    const event = Object.keys(this.event)
-    if (event.length) {
-      result.event = event
-    }
-
-    if (this.childNodes.length) {
-      result.children = this.childNodes.map(child => child.toJSON())
-    }
-    return result
-  }
-
-  replaceChild(newChild, oldChild) {
-    this.insertBefore(newChild, oldChild)
-    this.removeChild(oldChild)
-  }
-
-  destroy() {
-    const doc = getDoc(this.docId)
-
-    if (doc) {
-      delete doc.nodeMap[this.nodeId]
-    }
-
-    this.parentNode = null
-    this.childNodes.forEach(child => {
-      child.destroy()
-    })
-  }
-}

packages/omiax/src/omi/options.js

@@ -1,3 +1,5 @@
+import mock from './mock/index'
+
 function getGlobal() {
   if (
     typeof global !== 'object' ||
@@ -27,8 +29,9 @@ export default {
   scopedStyle: true,
   mapping: {},
   isWeb: true,
-  staticStyleMapping: {},
-  doc: typeof document === 'object' ? document : null,
+	staticStyleMapping: {},
+	doc: mock.document,
+  //doc: typeof document === 'object' ? document : null,
   root: getGlobal(),
   //styleCache :[{ctor:ctor,ctorName:ctorName,style:style}]
   styleCache: []