Lots of changes

.gitignore

@@ -1,3 +1,4 @@
+.idea/
 package-lock.json
 node_modules
 platforms/

.travis.yml

@@ -49,7 +49,7 @@ matrix:
       jdk: oraclejdk8
       before_install: nvm install 8.6.0
       script:
-        - npm run ci.android.build
+        - npm run android.build
         - "curl -u $SAUCE_USER:$SAUCE_KEY -X POST -H 'Content-Type: application/octet-stream' $ANDROID_SAUCE_STORAGE --data-binary @$ANDROID_PACKAGE_FOLDER/$ANDROID_PACKAGE"
     - os: osx
       env:
@@ -60,7 +60,7 @@ matrix:
       node_js: "8"
       jdk: oraclejdk8
       script:
-        - npm run ci.ios.build
+        - npm run ios.build
         - cd $IOS_PACKAGE_FOLDER && zip -r $IOS_PACKAGE nativescriptvueuitests.app/ &> /dev/null
         - echo $SAUCE_USER:$SAUCE_KEY
         - "curl -u $SAUCE_USER:$SAUCE_KEY -X POST -H 'Content-Type: application/octet-stream' $IOS_SAUCE_STORAGE --data-binary @$IOS_PACKAGE_FOLDER/$IOS_PACKAGE"

README.md

@@ -0,0 +1,22 @@
+# NativeScript-Vue UI tests
+This project uses Appium to test Vue UI components, and also serves as a source for the
+component screenshots at [nativescript-vue.org](https://nativescript-vue.org/).
+
+## System requirements
+* Node 7.6 or higher (for async function support).
+* The [Appium](http://appium.io/) client. Just download and install the latest [from GitHub](https://github.com/appium/appium-desktop/releases/latest).
+
+## Running the tests locally
+Start Appium, or you'll receive an error `127.0.0.1` can't be reached.
+
+### Android
+```bash
+npm run android.build
+npm run android.screenshots
+```
+
+### iOS
+```bash
+npm run ios.build
+npm run ios.screenshots
+```

app/app.css

@@ -0,0 +1,24 @@
+.m-5 {
+    margin: 5;
+}
+
+.m-15 {
+    margin: 15;
+}
+
+.m-20 {
+    margin: 20;
+}
+
+.home-list Button {
+    border-width: 1;
+    border-color: #3e495c;
+    border-radius: 4;
+    margin: 6;
+    font-size: 14;
+    text-transform: none;
+    height: 34;
+    padding: 4 8;
+    color: #fff;
+    background-color: #52617a;
+}

app/app.js

@@ -88,31 +88,29 @@ new Vue({
                 component: () => require('./elements/dialogs/Confirm')
             },
             {
-              name: 'LoginDialog',
-              component: () => require('./elements/dialogs/Login')
+                name: 'LoginDialog',
+                component: () => require('./elements/dialogs/Login')
             },
             {
-              name: 'PromptDialog',
-              component: () => require('./elements/dialogs/Prompt')
+                name: 'PromptDialog',
+                component: () => require('./elements/dialogs/Prompt')
             },
         ]
     },
 
 
     methods: {
-        showElement(e) {
-            const element = e.item;
+        showElement(element) {
             this.$navigateTo(element.component())
         }
     },
 
     template: `
         <Page>
-            <ListView for="el in elements" @itemTap="showElement">
-                <v-template>
-                    <Label :text="el.name" style="font-size: 15;" />
-                </v-template>
-            </ListView>
+            <ActionBar title="Home"></ActionBar>
+            <WrapLayout class="m-5 home-list">
+                <Button :text="el.name" v-for="el in elements" @tap="showElement(el)" />
+            </WrapLayout>
         </Page>
     `,
 }).$start();

app/elements/components/ActivityIndicator.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <StackLayout>
+        <StackLayout class="m-20">
             <ActivityIndicator busy="true"/>
         </StackLayout>
     `

app/elements/components/Button.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <StackLayout>
+        <StackLayout class="m-20">
             <Button text="Button"/>
         </StackLayout>
     `

app/elements/components/DatePicker.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <StackLayout>
+        <StackLayout class="m-20">
             <DatePicker/>
         </StackLayout>
     `

app/elements/components/HtmlView.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <StackLayout>
+        <StackLayout class="m-20">
             <HtmlView :html="html"/>
         </StackLayout>
     `,

app/elements/components/Image.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <GridLayout rows="auto">
+        <GridLayout rows="auto" class="m-20">
             <Image src="res://icon" stretch="none"/>
         </GridLayout>
     `

app/elements/components/Label.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <StackLayout>
+        <StackLayout class="m-20">
             <Label text="Label"/>
         </StackLayout>
     `

app/elements/components/ListPicker.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <StackLayout>
+        <StackLayout class="m-20">
             <ListPicker :items="items"></ListPicker>
         </StackLayout>
     `,

app/elements/components/ListView.js

@@ -2,7 +2,7 @@ module.exports = {
     template: `
         <ListView for="item in items">
             <v-template>
-                <Label :text="item.text"/>
+                <Label :text="item.text" class="m-15"/>
             </v-template>
         </ListView>
     `,

app/elements/components/Progress.js

@@ -1,7 +1,7 @@
 module.exports = {
     template: `
         <StackLayout>
-            <Progress value="50"/>
+            <Progress value="20" maxValue="50"/>
         </StackLayout>
     `
 };

app/elements/components/SegmentedBar.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <StackLayout>
+        <StackLayout class="m-20">
             <SegmentedBar>
                 <SegmentedBarItem title="First" />
                 <SegmentedBarItem title="Second" />

app/elements/components/Slider.js

@@ -1,7 +1,7 @@
 module.exports = {
     template: `
-        <StackLayout>
-            <Slider value="50"/>
+        <StackLayout class="m-20">
+            <Slider value="60"/>
         </StackLayout>
     `
 };

app/elements/components/Switch.js

@@ -1,7 +1,7 @@
 module.exports = {
     template: `
-        <StackLayout>
-            <Switch />
+        <StackLayout class="m-20">
+            <Switch checked="true"/>
         </StackLayout>
     `
 };

app/elements/components/TextField.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <StackLayout>
+        <StackLayout class="m-20">
             <TextField text="TextField" />
         </StackLayout>
     `

app/elements/components/TextView.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <StackLayout>
+        <StackLayout class="m-20">
             <TextView text="TextView\nHas\nMultiple\nLines" />
         </StackLayout>
     `

app/elements/components/TimePicker.js

@@ -1,6 +1,6 @@
 module.exports = {
     template: `
-        <StackLayout>
+        <StackLayout class="m-20">
             <TimePicker />
         </StackLayout>
     `

app/elements/dialogs/Action.js

@@ -1,7 +1,7 @@
-const dialogs = require('ui/dialogs');
+const dialogs = require('tns-core-modules/ui/dialogs');
 
 module.exports = {
-  mounted() {
-    dialogs.action('Choose one!', 'Or cancel...', ['cheese', 'wine'])
-  }
+    mounted() {
+        setTimeout(() => dialogs.action('Choose one!', 'Or cancel...', ['cheese', 'wine']))
+    }
 };

app/elements/dialogs/Alert.js

@@ -1,7 +1,7 @@
-const dialogs = require('ui/dialogs');
+const dialogs = require('tns-core-modules/ui/dialogs');
 
 module.exports = {
-  mounted() {
-    dialogs.alert('Hello!')
-  }
+    mounted() {
+        setTimeout(() => dialogs.alert('Hello!'))
+    }
 };

app/elements/dialogs/Confirm.js

@@ -1,7 +1,7 @@
-const dialogs = require('ui/dialogs');
+const dialogs = require('tns-core-modules/ui/dialogs');
 
 module.exports = {
-  mounted() {
-    dialogs.confirm('Are you ready?')
-  }
+    mounted() {
+        setTimeout(() => dialogs.confirm('Are you ready?'))
+    }
 };

app/elements/dialogs/Login.js

@@ -1,7 +1,7 @@
-const dialogs = require('ui/dialogs');
+const dialogs = require('tns-core-modules/ui/dialogs');
 
 module.exports = {
-  mounted() {
-    dialogs.login('Please log in', 'Username', 'Password')
-  }
+    mounted() {
+        setTimeout(() => dialogs.login('Please log in', 'Username', 'Password'))
+    }
 };

app/elements/dialogs/Prompt.js

@@ -1,7 +1,7 @@
-const dialogs = require('ui/dialogs');
+const dialogs = require('tns-core-modules/ui/dialogs');
 
 module.exports = {
-  mounted() {
-    dialogs.prompt('How are you?', 'Amazing!')
-  }
+    mounted() {
+        setTimeout(() => dialogs.prompt('How are you?', 'Amazing!'))
+    }
 };

appium.capabilities.json

@@ -1,17 +1,17 @@
 {
   "android23": {
-    "browserName": "",
     "platformName": "Android",
     "platformVersion": "6.0",
     "deviceName": "Android Emulator",
     "noReset": false,
-    "app": ""
+    "appPackage": "org.nativescript.nativescriptvueuitests",
+    "appActivity": "com.tns.NativeScriptActivity"
   },
   "ios-simulator103iPhone6": {
-    "browserName": "",
     "platformName": "iOS",
     "platformVersion": "10.3",
-    "deviceName": "iPhone 6 Simulator",
+    "deviceName": "iPhone Simulator",
+    "bundleId": "org.nativescript.nativescriptvueuitests",
     "app": ""
   }
 }