Update Deps and add FS example

This commit is contained in:
The Jared Wilcurt 2019-10-29 13:20:44 -04:00 committed by GitHub
commit 968a1714e7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 3136 additions and 4069 deletions

View File

@ -1 +1 @@
chrome 77
chrome 78

View File

@ -21,167 +21,18 @@ module.exports = {
},
plugins: [
'jest',
// required to lint *.vue files
'vue'
],
extends: [
'eslint:recommended',
'plugin:vue/recommended',
'plugin:jest/recommended'
'plugin:jest/recommended',
'tjw-base',
'tjw-vue'
],
rules: {
'arrow-parens': ['off'],
'brace-style': [
'no-restricted-syntax': [
'error',
'1tbs',
{
'allowSingleLine': true
}
],
'comma-dangle': ['error', 'never'],
'comma-spacing': [
'error',
{
'before': false,
'after': true
}
],
'comma-style': ['error', 'last'],
'curly': ['error'],
// allow async-await
'generator-star-spacing': ['off'],
// 2 space indentation to match .editorconfig
'indent': [
'error',
2,
{
'SwitchCase': 1
}
],
'keyword-spacing': [
'error',
{
'before': true,
'after': true
}
],
// allow debugger during development
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'no-multi-spaces': ['error'],
'no-restricted-syntax': ['error', 'Property[method="true"]'],
'no-unused-vars': ['error'],
'no-undef': ['error'],
// Only allow let and const, no var
'no-var': ['error'],
'object-curly-spacing': ['error', 'always'],
'one-var': ['error', 'never'],
'quotes': ['error', 'single'],
'semi': ['error', 'always'],
'space-before-blocks': ['error', 'always'],
'space-before-function-paren': ['error', 'always'],
'space-in-parens': ['error', 'never'],
'space-infix-ops': ['error'],
'spaced-comment': ['error', 'always'],
// Vue Linter Options
'vue/attribute-hyphenation': ['error', 'never'],
'vue/attributes-order': [
'error',
{
'order': [
// 'v-for item in items'
'LIST_RENDERING',
// 'v-if', 'v-else-if', 'v-else', 'v-show', 'v-cloak'
'CONDITIONALS',
// 'v-once', 'v-pre'
'RENDER_MODIFIERS',
// 'v-model', 'v-bind', ':property="foo"'
'BINDING',
// 'v-text', 'v-html'
'CONTENT',
// 'is'
'DEFINITION',
// 'id'
'GLOBAL',
// 'customProp="foo"', 'class', 'type', 'value' etc
'OTHER_ATTR',
// '@click="functionCall"', 'v-on="event"'
'EVENTS',
// 'slot', 'key', 'ref'
'UNIQUE'
]
}
],
'vue/html-closing-bracket-newline': [
'error',
{
'singleline': 'never',
'multiline': 'always'
}
],
'vue/html-closing-bracket-spacing': [
'error',
{
'startTag': 'never',
'endTag': 'never',
'selfClosingTag': 'always'
}
],
'vue/html-indent': [
'error',
2,
{
'attribute': 1,
'closeBracket': 0
}
],
'vue/html-self-closing': [
'error',
{
'html': {
'void': 'always',
'normal': 'never',
'component': 'always'
}
}
],
'vue/max-attributes-per-line': [
'error',
{
'singleline': 3,
'multiline': {
'max': 1,
'allowFirstLine': false
}
}
],
'vue/name-property-casing': ['error', 'PascalCase'],
'vue/order-in-components': [
'error',
{
'order': [
'el',
'name',
['template', 'render'],
'parent',
'functional',
['delimiters', 'comments'],
['components', 'directives'],
'extends',
'mixins',
'inheritAttrs',
'model',
['props', 'propsData'],
'data',
'methods',
'computed',
'filters',
'watch',
'LIFECYCLE_HOOKS',
'renderError'
]
}
],
'vue/prop-name-casing': ['error', 'camelCase']
'Property[method="true"]'
]
}
};

9
.travis.yml Normal file
View File

@ -0,0 +1,9 @@
sudo: required
dist: trusty
language: node_js
node_js:
- "10"
install:
- npm install
script:
- npm run validate

View File

@ -1,13 +1,15 @@
# nw-vue-cli-example
NW.js + Vue-CLI 3 example
[![Build Status](https://travis-ci.org/nwutils/nw-vue-cli-example.svg?branch=master)](https://travis-ci.org/nwutils/nw-vue-cli-example)
NW.js + Vue-CLI 4 example
![A screenshot of the default app running on Windows](screenshot.png)
* NW.js
* Vue-CLI 3
* Vue-CLI 4
* Vue 2
* Vue-DevTools
* Vue-DevTools (latest)
* Babel
* ESLint
* Jest (100% test coverage)

6781
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -1,6 +1,6 @@
{
"name": "nw-vue",
"version": "1.0.0",
"version": "1.1.0",
"main": "http://localhost:8964",
"node-remote": "http://localhost:8964",
"node-main": "",
@ -21,26 +21,27 @@
"build:nw": "build --concurrent --tasks win-x86,linux-x86,linux-x64,mac-x64 --mirror https://dl.nwjs.io/ .",
"build:win": "npm run build:win:clean && npm run build:vue && build --tasks win-x86 --mirror https://dl.nwjs.io/ .",
"build:lin": "npm run build:lin:clean && npm run build:vue && build --tasks linux-x64 --mirror https://dl.nwjs.io/ .",
"build:win:clean": "rimraf ./dist-vue ./dist/nw-vue-1.0.0-win-x86 ./dist/nw-vue-1.0.0-win-x86.zip ./dist/nw-vue-1.0.0-win-x86.7z ./dist/nw-vue-1.0.0-win-x86-Setup.exe",
"build:lin:clean": "rimraf ./dist-vue ./dist/nw-vue-1.0.0-linux-x64 ./dist/nw-vue-1.0.0-linux-x64.zip",
"run:win": "dist\\nw-vue-1.0.0-win-x86\\nw-vue.exe",
"run:lin": "./dist/nw-vue-1.0.0-linux-x64/nw-vue",
"build:win:clean": "rimraf ./dist-vue ./dist/nw-vue-1.1.0-win-x86 ./dist/nw-vue-1.1.0-win-x86.zip ./dist/nw-vue-1.1.0-win-x86.7z ./dist/nw-vue-1.1.0-win-x86-Setup.exe",
"build:lin:clean": "rimraf ./dist-vue ./dist/nw-vue-1.1.0-linux-x64 ./dist/nw-vue-1.1.0-linux-x64.zip",
"run:win": "dist\\nw-vue-1.1.0-win-x86\\nw-vue.exe",
"run:lin": "./dist/nw-vue-1.1.0-linux-x64/nw-vue",
"regression": "rd /s /q node_modules & rd /s /q node_modules & rd /s /q node_modules & npm install && npm run lint && npm test && npm run build:win && npm run run:win",
"lint": "vue-cli-service lint --no-fix",
"fix": "vue-cli-service lint --fix",
"test": "npm run test:unit",
"test:e2e": "vue-cli-service test:e2e",
"test:unit": "jest --config jest.config.js --coverage --runInBand"
"test:unit": "jest --config jest.config.js --coverage --runInBand",
"validate": "npm run lint && npm run test:unit && npm run build:vue"
},
"dependencies": {
"express": "^4.17.1"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.11.0",
"@vue/cli-plugin-e2e-nightwatch": "^3.11.0",
"@vue/cli-plugin-eslint": "^3.11.0",
"@vue/cli-plugin-unit-jest": "^3.11.0",
"@vue/cli-service": "^3.11.0",
"@vue/cli-plugin-babel": "^4.0.5",
"@vue/cli-plugin-e2e-nightwatch": "^4.0.5",
"@vue/cli-plugin-eslint": "^4.0.5",
"@vue/cli-plugin-unit-jest": "^4.0.5",
"@vue/cli-service": "^4.0.5",
"@vue/test-utils": "1.0.0-beta.29",
"babel-core": "7.0.0-bridge.0",
"babel-eslint": "^10.0.3",
@ -50,15 +51,18 @@
"babel-preset-env": "^1.7.0",
"babel-preset-stage-2": "^6.24.1",
"babel-preset-vue-app": "^2.0.0",
"concurrently": "^4.1.2",
"core-js": "^2.6.5",
"eslint": "^6.4.0",
"eslint-plugin-jest": "^22.17.0",
"concurrently": "^5.0.0",
"core-js": "^3.3.5",
"eslint": "^6.6.0",
"eslint-config-tjw-base": "^1.0.0",
"eslint-config-tjw-vue": "^1.0.0",
"eslint-plugin-jest": "^23.0.2",
"eslint-plugin-vue": "^5.2.3",
"jest": "^24.9.0",
"jest-environment-jsdom": "^24.9.0",
"jest-environment-jsdom-global": "^1.2.0",
"jest-transform-stub": "^2.0.0",
"nw": "0.41.1-sdk",
"nw": "0.42.0-sdk",
"nw-vue-devtools": "^1.3.0",
"nwjs-builder-phoenix": "^1.15.0",
"nwjs-types": "^1.0.0",
@ -70,7 +74,7 @@
},
"chromium-args": "--load-extension='./node_modules/nw-vue-devtools/extension'",
"build": {
"nwVersion": "v0.41.1",
"nwVersion": "v0.42.0",
"nwFlavor": "normal",
"targets": [
"zip",

View File

@ -0,0 +1,85 @@
<template>
<div>
<div v-if="error">
There was an error attempting to read from the file system.
</div>
<button
data-test="fs-example-button"
@click="getCurrentDirectory"
>
<template v-if="!error">
Click for File System example
</template>
<template v-else>
Try again for File System example
</template>
</button>
<template v-if="contents">
<p>
The contents of the current working directory:
</p>
<div class="contents">
<div
v-for="(file, fileIndex) in contents"
class="file"
:key="'file' + fileIndex"
>
{{ file }}
</div>
</div>
</template>
</div>
</template>
<script>
export default {
name: 'FsExample',
data: function () {
return {
contents: null,
error: false
};
},
methods: {
getCurrentDirectory: function () {
const fs = window.nw.require('fs');
try {
this.contents = fs.readdirSync('.');
this.error = false;
} catch (err) {
this.error = true;
}
}
},
computed: {}
};
</script>
<style scoped>
button {
background: linear-gradient(0deg, #2EB277, #65E6AC);
border-width: 3.4px;
border-color: #35495E;
border-radius: 8px;
margin: 22px 0px 6px 0px;
padding: 11px 17px;
color: #050709;
font-family: 'Trebuchet MS', Verdana, sans-serif;
font-size: 16px;
font-weight: bold;
}
.contents {
display: flex;
flex-flow: wrap;
}
.file {
flex-grow: 1;
min-width: 200px;
background: #DDD;
margin: 5px;
padding: 11px;
}
</style>

View File

@ -37,17 +37,23 @@
<h3>Ecosystem</h3>
<LinkList :links="ecosystemLinks" />
<hr />
<FsExample />
</div>
</template>
<script>
import Vue from 'vue';
import FsExample from '@/components/FsExample.vue';
import LinkList from '@/components/LinkList.vue';
export default {
name: 'HelloWorld',
components: {
FsExample,
LinkList
},
props: {
@ -157,7 +163,7 @@ export default {
},
computed: {
devMode: function () {
return window.process.env.NODE_ENV === 'development';
return window.process.versions['nw-flavor'] === 'sdk';
},
versions: function () {
return window.process.versions;

View File

@ -0,0 +1,41 @@
import { shallowMount } from '@vue/test-utils';
import FsExample from '@/components/FsExample.vue';
describe('FsExample.vue', () => {
test('Render default contents', () => {
const wrapper = shallowMount(FsExample);
expect(wrapper.html())
.toMatchSnapshot();
});
test('Click button', () => {
const wrapper = shallowMount(FsExample);
let domButton = wrapper.find('[data-test="fs-example-button"]');
domButton.trigger('click');
expect(window.nw.require)
.toHaveBeenCalledWith('fs');
expect(wrapper.html())
.toMatchSnapshot();
});
test('Error state', () => {
window.nw.require.mockImplementation((module) => {
if (module === 'fs') {
return new Error();
}
});
const wrapper = shallowMount(FsExample);
let domButton = wrapper.find('[data-test="fs-example-button"]');
domButton.trigger('click');
expect(window.nw.require)
.toHaveBeenCalledWith('fs');
expect(wrapper.html())
.toMatchSnapshot();
});
});

View File

@ -0,0 +1,43 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`FsExample.vue Click button 1`] = `
<div>
<!---->
<button>
Click for File System example
</button>
<p>
The contents of the current working directory:
</p>
<div class="contents">
<div class="file">
example-file-1.ext
</div>
<div class="file">
example-file-2.ext
</div>
</div>
</div>
`;
exports[`FsExample.vue Error state 1`] = `
<div>
<div>
There was an error attempting to read from the file system.
</div>
<button>
Try again for File System example
</button>
<!---->
</div>
`;
exports[`FsExample.vue Render default contents 1`] = `
<div>
<!---->
<button>
Click for File System example
</button>
<!---->
</div>
`;

View File

@ -24,10 +24,10 @@ exports[`HelloWorld.vue Render default contents 1`] = `
<h3>
You are using
Vue.js (v2.6.10),
NW.js (v0.41.1-sdk),
Node.js (v12.9.1),
NW.js (v0.42.0-sdk),
Node.js (v12.12.0),
and
Chromium (v77.0.3865.75).
Chromium (v78.0.3904.70).
</h3>
<button>
Show
@ -141,5 +141,13 @@ exports[`HelloWorld.vue Render default contents 1`] = `
</a>
</li>
</ul>
<hr>
<div>
<!---->
<button>
Click for File System example
</button>
<!---->
</div>
</div>
`;

View File

@ -26,13 +26,22 @@ global.beforeEach(() => {
NODE_ENV: 'development'
},
versions: {
chromium: '77.0.3865.75',
nw: '0.41.1',
chromium: '78.0.3904.70',
nw: '0.42.0',
'nw-flavor': 'sdk',
node: '12.9.1'
node: '12.12.0'
}
};
window.nw = {
require: jest.fn((module) => {
if (module === 'fs') {
return {
readdirSync: jest.fn(() => {
return ['example-file-1.ext', 'example-file-2.ext'];
})
};
}
}),
Shell: {
openExternal: jest.fn()
},