vsn 0.1.148 → 1.0.0

package/test/attributes/JSONAttribute.spec.ts

@@ -1,91 +0,0 @@
-import {DOM} from "../../src/DOM";
-
-describe('JSONAttribute', () => {
-    it("vsn-json should work with script/ld-json and an array", (done) => {
-        document.body.innerHTML = `
-            <script type="application/ld+json" vsn-json:t0>
-                [1,2,3,"four"]
-            </script>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            expect(dom.root.scope.get('t0')[0]).toBe(1);
-            expect(dom.root.scope.get('t0')[1]).toBe(2);
-            expect(dom.root.scope.get('t0')[2]).toBe(3);
-            expect(dom.root.scope.get('t0')[3]).toBe("four");
-            done();
-        });
-    });
-
-    it("vsn-json should work with script/ld-json and an object", (done) => {
-        document.body.innerHTML = `
-            <script type="application/ld+json" vsn-json:t1>
-                {
-                    "testing": [1,2,3,"four"],
-                    "test": ["one","two","three",4],
-                    "val": 111
-                }
-            </script>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            expect(dom.root.scope.get('t1').get("testing")[0]).toBe(1);
-            expect(dom.root.scope.get('t1').get("testing")[1]).toBe(2);
-            expect(dom.root.scope.get('t1').get("testing")[2]).toBe(3);
-            expect(dom.root.scope.get('t1').get("testing")[3]).toBe("four");
-            expect(dom.root.scope.get('t1').get("test")[0]).toBe("one");
-            expect(dom.root.scope.get('t1').get("test")[1]).toBe("two");
-            expect(dom.root.scope.get('t1').get("test")[2]).toBe("three");
-            expect(dom.root.scope.get('t1').get("test")[3]).toBe(4);
-            expect(dom.root.scope.get('t1').get("val")).toBe(111);
-            done();
-        });
-    });
-
-    it("vsn-json should work with div and an array", (done) => {
-        document.body.innerHTML = `
-            <div vsn-json:t2="[1,2,3,&quot;four&quot;]"></div>
-        `;
-
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            console.log('scope keys', dom.root.scope.keys);
-            expect(dom.root.scope.get('t2')[0]).toBe(1);
-            expect(dom.root.scope.get('t2')[1]).toBe(2);
-            expect(dom.root.scope.get('t2')[2]).toBe(3);
-            expect(dom.root.scope.get('t2')[3]).toBe("four");
-            done();
-        });
-    });
-
-    it("vsn-json should work with div and an object", (done) => {
-        document.body.innerHTML = `
-            <div vsn-json:t3="{&quot;testing&quot;: [1,2,3,&quot;four&quot;],&quot;test&quot;: [&quot;one&quot;,&quot;two&quot;,&quot;three&quot;,4]}"></div>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            expect(dom.root.scope.get('t3').get("testing")[0]).toBe(1);
-            expect(dom.root.scope.get('t3').get("testing")[1]).toBe(2);
-            expect(dom.root.scope.get('t3').get("testing")[2]).toBe(3);
-            expect(dom.root.scope.get('t3').get("testing")[3]).toBe("four");
-            expect(dom.root.scope.get('t3').get("test")[0]).toBe("one");
-            expect(dom.root.scope.get('t3').get("test")[1]).toBe("two");
-            expect(dom.root.scope.get('t3').get("test")[2]).toBe("three");
-            expect(dom.root.scope.get('t3').get("test")[3]).toBe(4);
-            done();
-        });
-    });
-
-    it("vsn-json should work with a ref path", (done) => {
-        document.body.innerHTML = `
-            <div vsn-name="testing">
-                <div vsn-json:testing.test='{"testing": 123}'></div>
-            </div>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            expect(dom.root.scope.get('testing').get("test").get('testing')).toBe(123);
-            done();
-        });
-    });
-});

package/test/attributes/ListItem.spec.ts

@@ -1,118 +0,0 @@
-import "../../src/Types";
-import "../../src/attributes/_imports";
-import {DOM} from "../../src/DOM";
-import {ListItem} from "../../src/attributes/ListItem";
-import {Registry} from "../../src/Registry";
-import {List} from "../../src/attributes/List";
-import {Model} from "../../src/Model";
-import {property} from "../../src/Scope/properties/Property";
-
-@Registry.controller('ListItemController')
-class ListItemController{
-    items: ListItemSpecTestItem[] = [];
-
-    do() {}
-}
-
-@Registry.model('ListItemSpecTestItem')
-class ListItemSpecTestItem extends Model {
-    @property()
-    test: number = null;
-
-    @property()
-    v: number;
-}
-
-describe('ListItem', () => {
-    it("vsn-list-item should find it's parent list or complain", async () => {
-        document.body.innerHTML = `
-            <ul  id="test"><li vsn-list-item:item id="test-item"></li></ul>
-        `;
-        let errorThrown: boolean = false;
-        try {
-            const dom = new DOM(document.body, false);
-            await dom.buildFrom(document.body);
-        } catch (e) {
-            expect(e.message).toBe(ListItem.ERROR_NO_PARENT);
-            errorThrown = true;
-        }
-        expect(errorThrown).toBeTrue();
-    });
-
-    it("vsn-list-item should find it's parent list", (done) => {
-        document.body.innerHTML = `
-            <ul vsn-list:list list-item-model="ListItemSpecTestItem" id="test"><li vsn-list-item id="test-item"></li></ul>
-        `;
-
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const list = await dom.getTagForElement(document.getElementById('test'));
-            const listItem = await dom.getTagForElement(document.getElementById('test-item'));
-            const listItemAttr: ListItem = await listItem.getAttribute('vsn-list-item') as ListItem;
-
-            expect(listItemAttr.list).toBe(list);
-            done();
-        });
-    });
-
-    it("should properly wrap list item class", (done) => {
-        document.body.innerHTML = `
-            <div vsn-controller:controller="ListItemController">
-                <ul vsn-list:controller.items list-item-model="ListItemSpecTestItem" id="test">
-                    <li vsn-template vsn-list-item:item></li>
-                </ul>
-            </div>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const list = await dom.getTagForElement(document.getElementById('test'));
-            const controller: ListItemController = list.scope.get('controller').wrapped;
-            const listAttr: List = await list.getAttribute('vsn-list') as List;
-
-            list.on('add', () => {
-                const listItem = listAttr.tags[0];
-
-                expect(listItem.scope.get('item').data instanceof ListItemSpecTestItem).toBeTrue();
-                expect(controller.items.length).toBe(1);
-                expect(controller.items[0] instanceof ListItemSpecTestItem).toBeTrue();
-
-                done();
-            });
-
-            listAttr.items.length = 0;
-            listAttr.items.push(new ListItemSpecTestItem({
-                test: 1,
-                v: 555
-            }));
-        });
-    });
-
-    it("vsn-list-item should work with vsn-set", (done) => {
-        document.body.innerHTML = `
-            <ul vsn-list:list list-item-model="ListItemSpecTestItem" id="test"><li vsn-list-item id="test-item" vsn-set:item.testing|integer="1"></li></ul>
-        `;
-
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const listItem = await dom.getTagForElement(document.getElementById('test-item'));
-            expect(listItem.scope.get('item').get('testing')).toBe(1);
-            done();
-        });
-    });
-
-    it("vsn-list-item should work with vsn-exec", (done) => {
-        document.body.innerHTML = `
-            <ul vsn-list:list list-item-model="ListItemSpecTestItem" id="test">
-                <li vsn-list-item id="test-item" vsn-exec="item.test = 1"></li>
-            </ul>
-        `;
-
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const listItem = await dom.getTagForElement(document.getElementById('test-item'));
-            console.log('test keys', listItem.scope.keys);
-            expect(listItem.scope.get('test')).toBe(1);
-            done();
-        });
-    });
-});

package/test/attributes/ScopeAttribute.spec.ts

@@ -1,35 +0,0 @@
-import {DOM} from "../../src/DOM";
-import "../../src/Types";
-import "../../src/attributes/_imports";
-
-
-describe('ScopeAttribute', () => {
-    it("vsn-scope should set simple values correctly", (done) => {
-        document.body.innerHTML = `
-            <div vsn-scope="{'asd':123, 'sdf': 'asd'}">
-                <span vsn-bind="asd"></span>
-            </div>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const element = (await dom.exec('?(div)'))[0];
-            expect(element.scope.get('asd')).toBe(123);
-            expect(element.scope.get('sdf')).toBe('asd');
-            const span = (await element.exec('?>(:first-child)'))[0];
-            expect(span.element.innerText).toBe('123');
-            done();
-        });
-    });
-
-    it("vsn-scope should allow empty value to create a scope", (done) => {
-        document.body.innerHTML = `
-            <div vsn-scope></div>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const element = (await dom.exec('?(div)'))[0];
-            expect(element.uniqueScope).toBe(true);
-            done();
-        });
-    });
-});

package/test/attributes/ServiceAttribute.spec.ts

@@ -1,41 +0,0 @@
-import {DOM} from "../../src/DOM";
-import "../../src/Types";
-import "../../src/attributes/_imports";
-import {Registry} from "../../src/Registry";
-import {Service} from "../../src/Service";
-import {property} from "../../src/Scope/properties/Property";
-
-
-@Registry.service('TestService')
-class TestService extends Service {
-    @property()
-    public test: string;
-
-    constructor() {
-        super();
-    }
-
-}
-
-
-describe('ServiceAttribute', () => {
-    it("vsn-services to just work", (done) => {
-        document.body.innerHTML = `
-            <div vsn-service:test1="TestService" id="test"></div>
-            <div vsn-service:test2="TestService" vsn-set:test2.test="testing" id="test2"></div>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const service1 = await dom.exec('test1');
-            const service2 = await dom.exec('test2');
-            expect(service1).toBeInstanceOf(TestService);
-            expect(service1).toBe(service2);
-            expect(TestService.instance).toBe(service1);
-            expect(TestService.instance.test).toBe('testing');
-            expect(await dom.exec('test1.test')).toBe('testing');
-            await dom.exec('test2.test = "testing2"');
-            expect(TestService.instance.test).toBe('testing2');
-            done();
-        });
-    });
-});

package/test/attributes/SetAttribute.spec.ts

@@ -1,55 +0,0 @@
-import {DOM} from "../../src/DOM";
-import "../../src/Types";
-import "../../src/attributes/_imports";
-
-
-describe('Bind', () => {
-    it("vsn-set to work with a value", (done) => {
-        document.body.innerHTML = `
-            <span id="test" vsn-name="test" vsn-set:val="hello world">testing</span>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const tag = await dom.getTagForElement(document.getElementById('test'));
-            expect(tag).toBeTruthy();
-            expect(tag.scope.get('val')).toBe('hello world');
-            done();
-        });
-    });
-
-    it("vsn-set to work with nested scopes", (done) => {
-        document.body.innerHTML = `
-            <span id="test" vsn-name="test">
-                <span id="test-inner-0" vsn-name="testInner0" vsn-set:test.val="hello world"></span>
-                <span id="test-inner-1" vsn-name="testInner1" vsn-set:val="hi mom"></span>
-            </span>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const tag = await dom.getTagForElement(document.getElementById('test'));
-            const inner1 = await dom.getTagForElement(document.getElementById('test-inner-1'));
-            expect(tag).toBeTruthy();
-            expect(tag.scope.get('val')).toBe('hello world');
-            expect(inner1.scope.get('val')).toBe('hi mom');
-            done();
-        });
-    })
-
-    it("vsn-set to work with a typed value", (done) => {
-        document.body.innerHTML = `
-            <span id="test-int" vsn-set:int|integer="142.3">testing</span>
-            <span id="test-float" vsn-set:float|float="142.3">testing</span>
-            <span id="test-bool" vsn-set:bool|boolean="false">testing</span>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const intTag = await dom.getTagForElement(document.getElementById('test-int'));
-            const floatTag = await dom.getTagForElement(document.getElementById('test-float'));
-            const boolTag = await dom.getTagForElement(document.getElementById('test-bool'));
-            expect(intTag.scope.get('int')).toBe(142);
-            expect(floatTag.scope.get('float')).toBe(142.3);
-            expect(boolTag.scope.get('bool')).toBe(false);
-            done();
-        });
-    });
-});

package/test/attributes/Styles.spec.ts

@@ -1,43 +0,0 @@
-import {DOM} from "../../src/DOM";
-import "../../src/Types";
-import "../../src/attributes/_imports";
-
-
-describe('Styles', () => {
-    it("vsn-styles to just work", (done) => {
-        document.body.innerHTML = `
-            <div vsn-name="testing">
-                <span id="styling" vsn-styles="testing.styles" style="margin-top: 50px;">testing</span>
-                <span id="styling-dupe" vsn-styles="testing.styles" style="margin-top: 50px;">testing 2</span>
-            </div>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            const ele1 = (await dom.get('#styling'))[0];
-            const ele2 = (await dom.get('#styling-dupe'))[0];
-            const scope = ele1.scope;
-            const container = scope.get('testing');
-            const styles = container.get('styles');
-            expect(container).toBeTruthy();
-            expect(styles).toBeTruthy();
-            expect(ele1.element.style.marginTop).toBe('50px');
-            expect(ele2.element.style.marginTop).toBe('50px');
-            styles.set('$marginTop', '-50px');
-            expect(ele1.element.style.marginTop).toBe('-50px');
-            expect(ele2.element.style.marginTop).toBe('-50px');
-            done();
-        });
-    });
-
-    it("$ operator should work", (done) => {
-        document.body.innerHTML = `
-            <span id="styling">testing</span>
-        `;
-        const dom = new DOM(document.body);
-        dom.once('built', async () => {
-            await dom.exec('?(#styling).$marginTop = "50px"');
-            expect((await dom.get('#styling'))[0].element.style.marginTop).toBe('50px');
-            done();
-        });
-    });
-});

package/test/globals.js

@@ -1,2 +0,0 @@
-var DO_BENCHMARK = false;
-var IN_DEVELOPMENT = true;

package/tsconfig.base.json

@@ -1,17 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es5",
-    "module": "commonjs",
-    "lib": [ "es6", "dom"],
-    "declaration": true,
-    "sourceMap": true,
-    "rootDir": "./src",
-    "outDir": "./dist",
-    "strict": false,
-    "experimentalDecorators": true,
-    "downlevelIteration": true
-  },
-  "exclude": [
-    "node_modules"
-  ]
-}

package/tsconfig.json

@@ -1,6 +0,0 @@
-{
-  "extends": "./tsconfig.base.json",
-  "exclude": [
-    "./test"
-  ]
- }

package/tsconfig.test.json

@@ -1,7 +0,0 @@
-{
-  "extends": "./tsconfig.base.json",
-  "include": [
-    "./src",
-    "./test"
-  ]
- }

package/types/vsn-component.d.ts

@@ -1,5 +0,0 @@
-
-declare module "*.vsn" {
-  const content: string;
-  export default content;
-}

package/webpack.config.js

@@ -1,48 +0,0 @@
-const path = require('path');
-const webpack = require("webpack");
-const TerserPlugin = require("terser-webpack-plugin");
-
-const defaultConfiguration = {
-  entry: {
-    'vsn': './src/vsn.ts',
-    'demo': './src/demo.ts',
-  },
-  module: {
-    rules: [
-      {
-        test: /\.tsx?$/,
-        use: 'ts-loader',
-        exclude: /node_modules/,
-      },
-    ],
-  },
-  resolve: {
-    extensions: ['.tsx', '.ts', '.js'],
-  },
-  plugins: [],
-  output: {
-    filename: '[name].min.js',
-    path: path.resolve(__dirname, 'dist'),
-  },
-  optimization: {
-    minimizer: [new TerserPlugin({
-    terserOptions: {
-      format: {
-        preamble: `/* Copyright ${new Date().getUTCFullYear()}, VSNjs. ${require('./package.json').name} ${require('./package.json').version} (${new Date().toUTCString()}) */if (window) window['VSN_VERSION']='${require('./package.json').version}';`
-      }
-    }
-  })],
-  }
-};
-
-function buildConfig(env) {
-  console.log(env);
-  defaultConfiguration.plugins.push(new webpack.DefinePlugin({
-    BUILD: JSON.stringify(env.BUILD),
-    IN_DEVELOPMENT: JSON.stringify(env.BUILD === 'development'),
-    DO_BENCHMARK: JSON.stringify([1, '1', 'True', 'true'].indexOf(env.BENCHMARK) > -1),
-  }));
-  return require("./webpack." + env.BUILD + ".js")(env, defaultConfiguration);
-}
-
-module.exports = buildConfig;

package/webpack.development.js

@@ -1,6 +0,0 @@
-const webpack = require("webpack");
-
-module.exports = function(env, config) {
-  config.mode = 'development';
-  return config;
-}

package/webpack.production.js

@@ -1,5 +0,0 @@
-
-module.exports = function(env, config) {
-  config.mode = 'production';
-  return config;
-}