Browse Source

Prettify codebase

master
crstin 2 years ago
parent
commit
818382bd13
  1. 14
      .eslintrc.js
  2. 6
      .prettierrc
  3. 4
      babel.config.js
  4. 4
      jest.config.js
  5. 6
      src/App.vue
  6. 4
      src/components/HelloWorld.vue
  7. 10
      src/main.js
  8. 4
      tests/e2e/.eslintrc.js
  9. 22
      tests/e2e/custom-assertions/elementCount.js
  10. 10
      tests/e2e/custom-commands/customExecute.js
  11. 10
      tests/e2e/custom-commands/openHomepage.js
  12. 12
      tests/e2e/custom-commands/openHomepageClass.js
  13. 2
      tests/e2e/globals.js
  14. 16
      tests/e2e/page-objects/homepage.js
  15. 34
      tests/e2e/specs/test-with-pageobjects.js
  16. 20
      tests/e2e/specs/test.js
  17. 18
      tests/unit/example.spec.js

14
.eslintrc.js

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

6
.prettierrc

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

4
babel.config.js

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

4
jest.config.js

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

6
src/App.vue

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

4
src/components/HelloWorld.vue

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

10
src/main.js

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

4
tests/e2e/.eslintrc.js

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

22
tests/e2e/custom-assertions/elementCount.js

@ -13,22 +13,22 @@
*/
exports.assertion = function elementCount(selectorOrObject, count) {
let selector;
let selector
// 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
selector = selectorOrObject.selector;
selector = selectorOrObject.selector
} else {
selector = selectorOrObject;
selector = selectorOrObject
}
this.message = `Testing if element <${selector}> has count: ${count}`;
this.expected = count;
this.pass = val => val === count;
this.value = res => res.value;
this.message = `Testing if element <${selector}> has count: ${count}`
this.expected = count
this.pass = (val) => val === count
this.value = (res) => res.value
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)
}

10
tests/e2e/custom-commands/customExecute.js

@ -23,7 +23,7 @@ exports.command = function command(data) {
this.execute(
// The function argument is converted to a string and sent to the browser
function(argData) {
return argData;
return argData
},
// 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) {
// 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
}

10
tests/e2e/custom-commands/openHomepage.js

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

12
tests/e2e/custom-commands/openHomepageClass.js

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

2
tests/e2e/globals.js

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

16
tests/e2e/page-objects/homepage.js

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

34
tests/e2e/specs/test-with-pageobjects.js

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

20
tests/e2e/specs/test.js

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

18
tests/unit/example.spec.js

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

Loading…
Cancel
Save