Prettify codebase

This commit is contained in:
crstin 2020-06-25 23:31:51 +02:00
parent 236ab22e12
commit 818382bd13
17 changed files with 102 additions and 94 deletions

View File

@ -3,23 +3,23 @@ module.exports = {
env: { env: {
node: true node: true
}, },
extends: ["plugin:vue/essential", "eslint:recommended", "@vue/prettier"], extends: ['plugin:vue/essential', 'eslint:recommended', '@vue/prettier'],
parserOptions: { parserOptions: {
parser: "babel-eslint" parser: 'babel-eslint'
}, },
rules: { rules: {
"no-console": process.env.NODE_ENV === "production" ? "warn" : "off", 'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
"no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off" 'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
}, },
overrides: [ overrides: [
{ {
files: [ files: [
"**/__tests__/*.{j,t}s?(x)", '**/__tests__/*.{j,t}s?(x)',
"**/tests/unit/**/*.spec.{j,t}s?(x)" '**/tests/unit/**/*.spec.{j,t}s?(x)'
], ],
env: { env: {
jest: true jest: true
} }
} }
] ]
}; }

6
.prettierrc Normal file
View File

@ -0,0 +1,6 @@
{
"semi": false,
"arrowParens": "always",
"singleQuote": true,
"trailingComma": none
}

View File

@ -1,3 +1,3 @@
module.exports = { module.exports = {
presets: ["@vue/cli-plugin-babel/preset"] presets: ['@vue/cli-plugin-babel/preset']
}; }

View File

@ -1,3 +1,3 @@
module.exports = { module.exports = {
preset: "@vue/cli-plugin-unit-jest" preset: '@vue/cli-plugin-unit-jest'
}; }

View File

@ -6,14 +6,14 @@
</template> </template>
<script> <script>
import HelloWorld from "./components/HelloWorld.vue"; import HelloWorld from './components/HelloWorld.vue'
export default { export default {
name: "App", name: 'App',
components: { components: {
HelloWorld HelloWorld
} }
}; }
</script> </script>
<style lang="scss"> <style lang="scss">

View File

@ -104,11 +104,11 @@
<script> <script>
export default { export default {
name: "HelloWorld", name: 'HelloWorld',
props: { props: {
msg: String msg: String
} }
}; }
</script> </script>
<!-- Add "scoped" attribute to limit CSS to this component only --> <!-- Add "scoped" attribute to limit CSS to this component only -->

View File

@ -1,8 +1,8 @@
import Vue from "vue"; import Vue from 'vue'
import App from "./App.vue"; import App from './App.vue'
Vue.config.productionTip = false; Vue.config.productionTip = false
new Vue({ new Vue({
render: h => h(App) render: (h) => h(App)
}).$mount("#app"); }).$mount('#app')

View File

@ -1,5 +1,5 @@
module.exports = { module.exports = {
rules: { rules: {
"no-unused-expressions": "off" 'no-unused-expressions': 'off'
}
} }
};

View File

@ -13,22 +13,22 @@
*/ */
exports.assertion = function elementCount(selectorOrObject, count) { exports.assertion = function elementCount(selectorOrObject, count) {
let selector; let selector
// when called from a page object element or section // when called from a page object element or section
if (typeof selectorOrObject === "object" && selectorOrObject.selector) { if (typeof selectorOrObject === 'object' && selectorOrObject.selector) {
// eslint-disable-next-line prefer-destructuring // eslint-disable-next-line prefer-destructuring
selector = selectorOrObject.selector; selector = selectorOrObject.selector
} else { } else {
selector = selectorOrObject; selector = selectorOrObject
} }
this.message = `Testing if element <${selector}> has count: ${count}`; this.message = `Testing if element <${selector}> has count: ${count}`
this.expected = count; this.expected = count
this.pass = val => val === count; this.pass = (val) => val === count
this.value = res => res.value; this.value = (res) => res.value
function evaluator(_selector) { function evaluator(_selector) {
return document.querySelectorAll(_selector).length; return document.querySelectorAll(_selector).length
}
this.command = (cb) => this.api.execute(evaluator, [selector], cb)
} }
this.command = cb => this.api.execute(evaluator, [selector], cb);
};

View File

@ -23,7 +23,7 @@ exports.command = function command(data) {
this.execute( this.execute(
// The function argument is converted to a string and sent to the browser // The function argument is converted to a string and sent to the browser
function(argData) { function(argData) {
return argData; return argData
}, },
// The arguments for the function to be sent to the browser are specified in this array // The arguments for the function to be sent to the browser are specified in this array
@ -31,9 +31,9 @@ exports.command = function command(data) {
function(result) { function(result) {
// The "result" object contains the result of what we have sent back from the browser window // The "result" object contains the result of what we have sent back from the browser window
console.log("custom execute result:", result.value); console.log('custom execute result:', result.value)
} }
); )
return this; return this
}; }

View File

@ -14,10 +14,10 @@ module.exports = {
command: async function() { command: async function() {
// Other Nightwatch commands are available via "this" // Other Nightwatch commands are available via "this"
// .init() simply calls .url() command with the value of the "launch_url" setting // .init() simply calls .url() command with the value of the "launch_url" setting
this.init(); this.init()
this.waitForElementVisible("#app"); this.waitForElementVisible('#app')
const result = await this.elements("css selector", "#app ul"); const result = await this.elements('css selector', '#app ul')
this.assert.strictEqual(result.value.length, 3); this.assert.strictEqual(result.value.length, 3)
}
} }
};

View File

@ -10,15 +10,15 @@
* *
*/ */
const assert = require("assert"); const assert = require('assert')
module.exports = class { module.exports = class {
async command() { async command() {
// Other Nightwatch commands are available via "this.api" // Other Nightwatch commands are available via "this.api"
this.api.init(); this.api.init()
this.api.waitForElementVisible("#app"); this.api.waitForElementVisible('#app')
const result = await this.api.elements("css selector", "#app ul"); const result = await this.api.elements('css selector', '#app ul')
assert.strictEqual(result.value.length, 3); assert.strictEqual(result.value.length, 3)
}
} }
};

View File

@ -100,4 +100,4 @@ module.exports = {
cb(); cb();
} }
*/ */
}; }

View File

@ -10,38 +10,38 @@
*/ */
module.exports = { module.exports = {
url: "/", url: '/',
commands: [], commands: [],
// A page object can have elements // A page object can have elements
elements: { elements: {
appContainer: "#app" appContainer: '#app'
}, },
// Or a page objects can also have sections // Or a page objects can also have sections
sections: { sections: {
app: { app: {
selector: "#app", selector: '#app',
elements: { elements: {
logo: "img" logo: 'img'
}, },
// - a page object section can also have sub-sections // - a page object section can also have sub-sections
// - elements or sub-sections located here are retrieved using the "app" section as the base // - elements or sub-sections located here are retrieved using the "app" section as the base
sections: { sections: {
headline: { headline: {
selector: "h1" selector: 'h1'
}, },
welcome: { welcome: {
// the equivalent css selector for the "welcome" sub-section would be: // the equivalent css selector for the "welcome" sub-section would be:
// '#app div.hello' // '#app div.hello'
selector: "div.hello", selector: 'div.hello',
elements: { elements: {
cliPluginLinks: { cliPluginLinks: {
selector: "ul", selector: 'ul',
index: 0 index: 0
} }
} }
@ -49,4 +49,4 @@ module.exports = {
} }
} }
} }
}; }

View File

@ -7,28 +7,30 @@
//////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////
module.exports = { module.exports = {
beforeEach: browser => browser.init(), beforeEach: (browser) => browser.init(),
"e2e tests using page objects": browser => { 'e2e tests using page objects': (browser) => {
const homepage = browser.page.homepage(); const homepage = browser.page.homepage()
homepage.waitForElementVisible("@appContainer"); homepage.waitForElementVisible('@appContainer')
const app = homepage.section.app; const app = homepage.section.app
app.assert.elementCount("@logo", 1); app.assert.elementCount('@logo', 1)
app.expect.section("@welcome").to.be.visible; app.expect.section('@welcome').to.be.visible
app.expect app.expect
.section("@headline") .section('@headline')
.text.to.match(/^Welcome to Your Vue\.js (.*)App$/); .text.to.match(/^Welcome to Your Vue\.js (.*)App$/)
browser.end(); browser.end()
}, },
'verify if string "e2e-nightwatch" is within the cli plugin links': browser => { 'verify if string "e2e-nightwatch" is within the cli plugin links': (
const homepage = browser.page.homepage(); browser
const welcomeSection = homepage.section.app.section.welcome; ) => {
const homepage = browser.page.homepage()
const welcomeSection = homepage.section.app.section.welcome
welcomeSection.expect welcomeSection.expect
.element("@cliPluginLinks") .element('@cliPluginLinks')
.text.to.contain("e2e-nightwatch"); .text.to.contain('e2e-nightwatch')
}
} }
};

View File

@ -2,20 +2,20 @@
// https://nightwatchjs.org/guide // https://nightwatchjs.org/guide
module.exports = { module.exports = {
"default e2e tests": browser => { 'default e2e tests': (browser) => {
browser browser
.init() .init()
.waitForElementVisible("#app") .waitForElementVisible('#app')
.assert.elementPresent(".hello") .assert.elementPresent('.hello')
.assert.containsText("h1", "Welcome to Your Vue.js App") .assert.containsText('h1', 'Welcome to Your Vue.js App')
.assert.elementCount("img", 1) .assert.elementCount('img', 1)
.end(); .end()
}, },
"example e2e test using a custom command": browser => { 'example e2e test using a custom command': (browser) => {
browser browser
.openHomepage() .openHomepage()
.assert.elementPresent(".hello") .assert.elementPresent('.hello')
.end(); .end()
}
} }
};

View File

@ -1,12 +1,12 @@
import { shallowMount } from "@vue/test-utils"; import { shallowMount } from '@vue/test-utils'
import HelloWorld from "@/components/HelloWorld.vue"; import HelloWorld from '@/components/HelloWorld.vue'
describe("HelloWorld.vue", () => { describe('HelloWorld.vue', () => {
it("renders props.msg when passed", () => { it('renders props.msg when passed', () => {
const msg = "new message"; const msg = 'new message'
const wrapper = shallowMount(HelloWorld, { const wrapper = shallowMount(HelloWorld, {
propsData: { msg } propsData: { msg }
}); })
expect(wrapper.text()).toMatch(msg); expect(wrapper.text()).toMatch(msg)
}); })
}); })