Add test app

C451 · C451 · commit e746732a9c03 · 2019-04-23T18:07:38.000+03:00
diff --git a/package.json b/package.json
@@ -4,7 +4,7 @@
   "description": "Hackable charting lib for traders",
   "main": "./dist/trading-vue.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "webpack-dev-server --config webpack/test.config.js --mode development --progress --hot",
     "dev": "webpack-dev-server --config webpack/dev.config.js --mode development --progress --hot",
     "build": "webpack  --config webpack/build.config.js --mode production --progress"
   },
diff --git a/test/Test.vue b/test/Test.vue
@@ -0,0 +1,58 @@
+<template>
+<trading-vue :data="chart" :width="this.width" :height="this.height"
+        :color-back="colors.colorBack"
+        :color-grid="colors.colorGrid"
+        :color-text="colors.colorText">
+</trading-vue>
+</template>
+
+<script>
+import TradingVue from '../src/TradingVue.vue'
+import Data from '../data/data.json'
+import Utils from '../src/stuff/utils.js'
+
+export default {
+    name: 'app',
+    components: {
+        TradingVue
+    },
+    methods: {
+        onResize(event) {
+            this.width = window.innerWidth
+            this.height = window.innerHeight
+        }
+    },
+    mounted() {
+        window.addEventListener('resize', this.onResize)
+        setTimeout(() => {
+            // Async data setup
+            this.$set(this, 'chart', Data)
+        }, 0)
+    },
+    beforeDestroy() {
+        window.removeEventListener('resize', this.onResize)
+    },
+    data() {
+        return {
+            chart: {}, // Data will be here,
+            width: window.innerWidth,
+            height: window.innerHeight,
+            colors: {
+                colorBack: '#fff',
+                colorGrid: '#eee',
+                colorText: '#333',
+            }
+        };
+    }
+};
+</script>
+
+<style>
+html,
+body {
+    background-color: #000;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+}
+</style>
diff --git a/test/index.html b/test/index.html
@@ -0,0 +1,19 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>TradingVue.js Tests</title>
+    <style>
+    </style>
+</head>
+
+<body>
+    <!-- Our vue app will be mounted on this DOM element -->
+    <div id="app"></div>
+    <!-- Bundle will be injected below -->
+</body>
+
+</html>
diff --git a/test/index.js b/test/index.js
@@ -0,0 +1,8 @@
+import Vue from 'vue';
+
+import App from './Test.vue';
+
+new Vue({
+  el: '#app',
+  render: h => h(App)
+});
diff --git a/webpack/test.config.js b/webpack/test.config.js
@@ -0,0 +1,32 @@
+const VueLoaderPlugin = require('vue-loader/lib/plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+
+module.exports = {
+    entry: './test/index.js',
+    module: {
+        rules: [{
+                test: /\.vue$/,
+                exclude: /node_modules/,
+                loader: 'vue-loader'
+            },
+            {
+                test: /\.js$/,
+                exclude: /node_modules/,
+                loader: 'babel-loader'
+            },
+            {
+                test: /\.css$/,
+                use: [
+                    'vue-style-loader',
+                    'css-loader'
+                ]
+            },
+        ]
+    },
+    plugins: [
+        new VueLoaderPlugin(),
+        new HtmlWebpackPlugin({
+            template: './test/index.html'
+        })
+    ],
+}
