From a500ad19e962fa5a9e386e741d83018a77cfe233 Mon Sep 17 00:00:00 2001 From: Frank Date: Wed, 17 Nov 2021 15:56:06 -0500 Subject: [PATCH] lint + correcting some actions --- jest.config.js | 16 ++- src/App.vue | 1 - .../radioQuestion/radioQuestion.spec.js | 44 ++++--- .../radioQuestion/radioQuestion.vue | 23 ++-- src/constants/applicationConfig.js | 6 +- src/constants/endpoints.js | 52 ++++---- src/constants/storeActions.js | 14 ++- src/constants/widgetNames.js | 9 +- src/global-methods.js | 20 +-- src/global-methods.spec.js | 117 +++++++++--------- src/helpers/unitTestHelper.js | 40 +++--- src/layouts/componentTest/componentTest.vue | 37 +++--- src/layouts/notFound/notFound.vue | 4 +- src/layouts/vehicle-year/vehicle-year.spec.js | 95 +++++++------- src/layouts/vehicle-year/vehicle-year.vue | 32 ++--- .../year-question/year-question.vue | 36 ++---- src/main.js | 4 +- src/mixins/baseMixin.js | 99 ++++++++------- src/router/index.js | 47 ++++--- src/store/index.js | 45 +++++-- .../buttonPrimary/buttonPrimary.spec.js | 2 +- .../buttonPrimary/buttonPrimary.vue | 6 +- .../buttonSecondary/buttonSecondary.spec.js | 2 +- .../buttonSecondary/buttonSecondary.vue | 4 +- src/uxComponents/confetti/confetti.spec.js | 2 +- src/uxComponents/header/header.spec.js | 28 ++--- src/uxComponents/header/header.vue | 14 +-- .../listButton/listButton.spec.js | 2 +- src/uxComponents/listButton/listButton.vue | 11 +- src/uxComponents/radio/radio.spec.js | 42 +++---- src/uxComponents/radio/radio.vue | 28 ++--- src/uxComponents/radioCard/radioCard.spec.js | 2 +- src/uxComponents/radioCard/radioCard.vue | 5 +- src/uxComponents/radioList/radioList.spec.js | 2 +- src/uxComponents/radioList/radioList.vue | 36 +++--- vue.config.js | 14 ++- vue.release.config.js | 11 +- 37 files changed, 488 insertions(+), 464 deletions(-) diff --git a/jest.config.js b/jest.config.js index c12380928..036286c62 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,14 +1,20 @@ module.exports = { verbose: true, - coverageReporters: ['html', 'text', 'jest-junit'], + coverageReporters: ["html", "text", "jest-junit"], preset: "@vue/cli-plugin-unit-jest", - transform: { "^.+\\.vue$": "vue-jest", }, - moduleFileExtensions: ['js', 'vue'], - collectCoverageFrom: ["src/**/*.{js,vue}", "!src/main.js", "!src/constants/*.js", "!src/router/**/*.js", "!src/helpers/*.js"], //! means exclude from coverage. + transform: { "^.+\\.vue$": "vue-jest" }, + moduleFileExtensions: ["js", "vue"], + collectCoverageFrom: [ + "src/**/*.{js,vue}", + "!src/main.js", + "!src/constants/*.js", + "!src/router/**/*.js", + "!src/helpers/*.js", + ], //! means exclude from coverage. testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"], coverageThreshold: { global: { statements: 90, - } + }, }, }; diff --git a/src/App.vue b/src/App.vue index 57b5ffe58..a44ab87b7 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,4 +1,3 @@ - diff --git a/src/commonComponents/radioQuestion/radioQuestion.spec.js b/src/commonComponents/radioQuestion/radioQuestion.spec.js index a9ba7476e..bf779fcff 100644 --- a/src/commonComponents/radioQuestion/radioQuestion.spec.js +++ b/src/commonComponents/radioQuestion/radioQuestion.spec.js @@ -1,22 +1,26 @@ -import { shallowMount } from '@vue/test-utils'; -import radioQuestion from './radioQuestion'; +import { shallowMount } from "@vue/test-utils"; +import radioQuestion from "./radioQuestion"; -describe('radioQuestion.vue', () => { - it("Should render the 'questionText' prop value as a span value for the radio question and the 'answer' values should render as text values for radio components.", () => { - // Act - const wrapper = shallowMount(radioQuestion, { - propsData: { - questionText: 'Question Text', - answers: ['2023', '2022', '2021'], - chooseAnswer: function(test){ console.log(test) } - } - }); +describe("radioQuestion.vue", () => { + it("Should render the 'questionText' prop value as a span value for the radio question and the 'answer' values should render as text values for radio components.", () => { + // Act + const wrapper = shallowMount(radioQuestion, { + propsData: { + questionText: "Question Text", + answers: ["2023", "2022", "2021"], + chooseAnswer: function (test) { + console.log(test); + }, + }, + }); - // Assert - expect(wrapper.find('.needed_car_info-text').text()).toEqual('Question Text'); - const radioButtons = wrapper.findAllComponents('[data-test="radio"]'); - expect(radioButtons[0].attributes('text')).toEqual('2023'); - expect(radioButtons[2].attributes('text')).toEqual('2021'); - expect(typeof wrapper.props().chooseAnswer).toBe('function'); - }) -}) \ No newline at end of file + // Assert + expect(wrapper.find(".needed_car_info-text").text()).toEqual( + "Question Text" + ); + const radioButtons = wrapper.findAllComponents('[data-test="radio"]'); + expect(radioButtons[0].attributes("text")).toEqual("2023"); + expect(radioButtons[2].attributes("text")).toEqual("2021"); + expect(typeof wrapper.props().chooseAnswer).toBe("function"); + }); +}); diff --git a/src/commonComponents/radioQuestion/radioQuestion.vue b/src/commonComponents/radioQuestion/radioQuestion.vue index 7e8b16c55..feeba3d08 100644 --- a/src/commonComponents/radioQuestion/radioQuestion.vue +++ b/src/commonComponents/radioQuestion/radioQuestion.vue @@ -1,13 +1,20 @@ @@ -18,10 +25,10 @@ export default { props: { questionText: String, answers: Array, - chooseAnswer: Function + chooseAnswer: Function, }, components: { - radio - } + radio, + }, }; diff --git a/src/constants/applicationConfig.js b/src/constants/applicationConfig.js index 78c0387c5..4b80d25d1 100644 --- a/src/constants/applicationConfig.js +++ b/src/constants/applicationConfig.js @@ -1,5 +1,5 @@ const applicationConfig = { -CONSUMER_APIGATEWAY_URL: process.env.VUE_APP_CONSUMER_API_GATEWAY -} + CONSUMER_APIGATEWAY_URL: process.env.VUE_APP_CONSUMER_API_GATEWAY, +}; -export { applicationConfig } \ No newline at end of file +export { applicationConfig }; diff --git a/src/constants/endpoints.js b/src/constants/endpoints.js index 468e4f3b0..9ba245c34 100644 --- a/src/constants/endpoints.js +++ b/src/constants/endpoints.js @@ -1,28 +1,28 @@ const endpoints = { - GetRouteInfoEndpoint: { - url: '/content/api/v1/content/RouteInfo', - method: 'POST' - }, - GetYears: { - url: '/vehicle/api/v1/vehicle/years', - method: 'GET' - }, - GetMakes: { - url: '/vehicle/api/v1/vehicle/Makes', - method: 'POST' - }, - GetVehicleModels: { - url: '/vehicle/api/v1/vehicle/Models', - method: 'GET' - }, - GetStyles: { - url: '/vehicle/api/v1/vehicle/Styles', - method: 'POST' - }, - GetPageData: { - url: '/content/api/v1/content/{pageName}', - method: 'GET' - } -} + GetRouteInfo: { + url: "/content/api/v1/content/RouteInfo", + method: "POST", + }, + GetVehicleYears: { + url: "/vehicle/api/v1/vehicle/years", + method: "GET", + }, + GetVehicleMakes: { + url: "/vehicle/api/v1/vehicle/Makes", + method: "GET", + }, + GetVehicleModels: { + url: "/vehicle/api/v1/vehicle/Models", + method: "GET", + }, + GetVehicleStyles: { + url: "/vehicle/api/v1/vehicle/Styles", + method: "GET", + }, + GetPageData: { + url: "/content/api/v1/content", + method: "GET", + }, +}; -export { endpoints } \ No newline at end of file +export { endpoints }; diff --git a/src/constants/storeActions.js b/src/constants/storeActions.js index e576e8ed2..75478ba7e 100644 --- a/src/constants/storeActions.js +++ b/src/constants/storeActions.js @@ -1,8 +1,10 @@ const storeActions = { - GET_ROUTE_INFO_ACTION: "getRouteInfo", - GET_YEARS: 'getYears', - GET_VEHICLE_MODELS: 'getVehicleModels', - GET_PAGE_DATA: 'getPageData', -} + GET_ROUTE_INFO_ACTION: "getRouteInfo", + GET_PAGE_DATA: "getPageData", + GET_VEHICLE_YEARS: "getVehicleYears", + GET_VEHICLE_MAKES: "getVehicleMakes", + GET_VEHICLE_MODELS: "getVehicleModels", + GET_VEHICLE_STYLES: "getVehicleStyles", +}; -export { storeActions } \ No newline at end of file +export { storeActions }; diff --git a/src/constants/widgetNames.js b/src/constants/widgetNames.js index e15d2d7f8..6fd0a1196 100644 --- a/src/constants/widgetNames.js +++ b/src/constants/widgetNames.js @@ -1,7 +1,6 @@ const widgetNames = { - HEADER_TEXT_WIDGET: "HeaderTextWidget", - RADIO_QUESTION_WIDGET: "RadioQuestionWidget" -} + HEADER_TEXT_WIDGET: "HeaderTextWidget", + RADIO_QUESTION_WIDGET: "RadioQuestionWidget", +}; - -export { widgetNames } \ No newline at end of file +export { widgetNames }; diff --git a/src/global-methods.js b/src/global-methods.js index 1b120b662..72d079b42 100644 --- a/src/global-methods.js +++ b/src/global-methods.js @@ -3,11 +3,12 @@ import { applicationConfig } from "@/constants/applicationConfig.js"; import httpStatusCodes from "http-status-codes"; export default { - callHttpClient({ method, endpoint, payload}) { + callHttpClient({ method, endpoint, payload }) { return new Promise((resolve, reject) => { - const apiGatewayUrl = applicationConfig.CONSUMER_APIGATEWAY_URL; - const payloadAndAnalyticsData = Object.assign({}, payload, {AppName: "FixMyGlass"}); + const payloadAndAnalyticsData = Object.assign({}, payload, { + AppName: "FixMyGlass", + }); axios({ method: method, @@ -15,7 +16,8 @@ export default { data: payloadAndAnalyticsData, crossDomain: true, responseType: {}, - }).then((response) => { + }).then( + (response) => { if (response.status == httpStatusCodes.OK) { resolve(response); } else { @@ -29,19 +31,17 @@ export default { }); }, - /* istanbul ignore next */ - callMockHttpClient({ method, endpoint}) { + callMockHttpClient({ method, endpoint }) { // For Mock use only! return new Promise((resolve, reject) => { - axios({ method: method, url: endpoint, crossDomain: true, responseType: {}, - }).then((response) => { - + }).then( + (response) => { if (response.status == httpStatusCodes.OK) { resolve(response); } else { @@ -53,5 +53,5 @@ export default { } ); }); - } + }, }; diff --git a/src/global-methods.spec.js b/src/global-methods.spec.js index 6885a23e0..59fa15b77 100644 --- a/src/global-methods.spec.js +++ b/src/global-methods.spec.js @@ -1,73 +1,76 @@ import globalMethods from "@/global-methods"; -import axios from 'axios'; +import axios from "axios"; //Mock external dependencies -jest.mock('axios'); +jest.mock("axios"); it("Global Methods - Call Http Client - Should Resolve Promise", () => { - //Arrange - const endpoint = 'https://mock.safelite.com'; - const httpArgs = setupMocksForHttpClient({ endpoint: endpoint }); + //Arrange + const endpoint = "https://mock.safelite.com"; + const httpArgs = setupMocksForHttpClient({ endpoint: endpoint }); - //Act - globalMethods.callHttpClient(httpArgs) - .then((response) => { - - //Assert - expect(axios.mock.calls[0][0].url).toContain(endpoint); - expect(response.data.message).toContain('Success'); - expect(response.status).toEqual(200); - }); + //Act + globalMethods.callHttpClient(httpArgs).then((response) => { + //Assert + expect(axios.mock.calls[0][0].url).toContain(endpoint); + expect(response.data.message).toContain("Success"); + expect(response.status).toEqual(200); + }); }); it("Global Methods - Call Http Client - Should Reject Promise", () => { - //Arrange - const endpoint = 'https://mock.safelite.com'; - const httpArgs = setupMocksForHttpClient({ endpoint: endpoint, isError: true }); + //Arrange + const endpoint = "https://mock.safelite.com"; + const httpArgs = setupMocksForHttpClient({ + endpoint: endpoint, + isError: true, + }); - //Act - globalMethods.callHttpClient(httpArgs) - .catch((err) => { - //Assert - expect(axios.mock.calls[0][0].url).toContain(endpoint); - expect(err.data.message).toContain('Error'); - expect(err.status).toEqual(500); - }); + //Act + globalMethods.callHttpClient(httpArgs).catch((err) => { + //Assert + expect(axios.mock.calls[0][0].url).toContain(endpoint); + expect(err.data.message).toContain("Error"); + expect(err.status).toEqual(500); + }); }); -function setupMocksForHttpClient({ endpoint = null, isError = false, additionalData = null }) { +function setupMocksForHttpClient({ + endpoint = null, + isError = false, + additionalData = null, +}) { + //Clear node module + axios.mockClear(); - //Clear node module - axios.mockClear(); + // Success Response + const response = { + status: 200, + data: { + message: "Success", + additionalData: additionalData, + }, + }; - // Success Response - const response = { - status: 200, - data: { - message: 'Success', - additionalData: additionalData - } - }; + // Error Response + const error = { + response: { + status: 500, + data: { + message: "Error", + additionalData: additionalData, + }, + }, + }; - // Error Response - const error = { - response: { - status: 500, - data: { - message: 'Error', - additionalData: additionalData - } - } - } + // Error interceptor on Axios returns a different object, so we need to mimic that. + if (isError) { + axios.mockRejectedValue(error); + } else { + axios.mockResolvedValue(response); + } - // Error interceptor on Axios returns a different object, so we need to mimic that. - if (isError) { - axios.mockRejectedValue(error); - } else { - axios.mockResolvedValue(response); - } - - return { - endpoint: endpoint - } -} \ No newline at end of file + return { + endpoint: endpoint, + }; +} diff --git a/src/helpers/unitTestHelper.js b/src/helpers/unitTestHelper.js index 417b47e43..e24e141d5 100644 --- a/src/helpers/unitTestHelper.js +++ b/src/helpers/unitTestHelper.js @@ -1,26 +1,26 @@ import { storeActions } from "@/constants/storeActions"; export function getMountOptions(mockData) { - // Define our mocks to attached to the 'global' object for Vue/Jest. - const mocks = {}; + // Define our mocks to attached to the 'global' object for Vue/Jest. + const mocks = {}; - mocks.dispatchNonBlockingStoreAction = jest.fn(); - mocks.dispatchNonBlockingStoreAction.mockImplementation((actionName) => { - - let actionFilterResult = mockData.actionList.filter(x => x.actionName == actionName); - - if (actionFilterResult.length > 0 && actionFilterResult.length === 1) { + mocks.dispatchNonBlockingStoreAction = jest.fn(); + mocks.dispatchNonBlockingStoreAction.mockImplementation((actionName) => { + let actionFilterResult = mockData.actionList.filter( + (x) => x.actionName == actionName + ); - return Promise.resolve({ - data: actionFilterResult[0].data - }); - } - }); - // Mock store actions from js file - mocks.storeActions = storeActions; - const global = { - mocks: mocks - }; + if (actionFilterResult.length > 0 && actionFilterResult.length === 1) { + return Promise.resolve({ + data: actionFilterResult[0].data, + }); + } + }); + // Mock store actions from js file + mocks.storeActions = storeActions; + const global = { + mocks: mocks, + }; - return { global } -} \ No newline at end of file + return { global }; +} diff --git a/src/layouts/componentTest/componentTest.vue b/src/layouts/componentTest/componentTest.vue index 90d281d67..11cd42970 100644 --- a/src/layouts/componentTest/componentTest.vue +++ b/src/layouts/componentTest/componentTest.vue @@ -1,4 +1,4 @@ - @@ -15,11 +15,11 @@ export default { name: "buttonPrimary", props: { buttonText: String, - isDisabled: Boolean + isDisabled: Boolean, }, data() { return { - isLoading: false + isLoading: false, }; }, methods: { diff --git a/src/uxComponents/buttonSecondary/buttonSecondary.spec.js b/src/uxComponents/buttonSecondary/buttonSecondary.spec.js index 882a68129..3d0843e10 100644 --- a/src/uxComponents/buttonSecondary/buttonSecondary.spec.js +++ b/src/uxComponents/buttonSecondary/buttonSecondary.spec.js @@ -1 +1 @@ -test.todo('some test to be written in the future'); \ No newline at end of file +test.todo("some test to be written in the future"); diff --git a/src/uxComponents/buttonSecondary/buttonSecondary.vue b/src/uxComponents/buttonSecondary/buttonSecondary.vue index 19961efa0..3840922d4 100644 --- a/src/uxComponents/buttonSecondary/buttonSecondary.vue +++ b/src/uxComponents/buttonSecondary/buttonSecondary.vue @@ -5,7 +5,7 @@ class="btn btn-secondary d-flex align-items-center" v-on:click="showLoader()" v-bind:class="[this.isLoading ? 'button-loader' : 'not-loading']" - > + > {{ this.buttonText }} @@ -14,7 +14,7 @@ export default { name: "buttonSecondary", props: { - buttonText: String + buttonText: String, }, data() { return { diff --git a/src/uxComponents/confetti/confetti.spec.js b/src/uxComponents/confetti/confetti.spec.js index 882a68129..3d0843e10 100644 --- a/src/uxComponents/confetti/confetti.spec.js +++ b/src/uxComponents/confetti/confetti.spec.js @@ -1 +1 @@ -test.todo('some test to be written in the future'); \ No newline at end of file +test.todo("some test to be written in the future"); diff --git a/src/uxComponents/header/header.spec.js b/src/uxComponents/header/header.spec.js index d02c78d9f..f5a423803 100644 --- a/src/uxComponents/header/header.spec.js +++ b/src/uxComponents/header/header.spec.js @@ -1,16 +1,16 @@ -import { shallowMount } from '@vue/test-utils'; -import Header from './header'; +import { shallowMount } from "@vue/test-utils"; +import Header from "./header"; -describe('Header.vue', () => { - it("Should render the 'text' prop value as a span value for the header span text value.", () => { - // Act - const wrapper = shallowMount(Header, { - propsData: { - text: 'Header Content' - } - }); +describe("Header.vue", () => { + it("Should render the 'text' prop value as a span value for the header span text value.", () => { + // Act + const wrapper = shallowMount(Header, { + propsData: { + text: "Header Content", + }, + }); - // Assert - expect(wrapper.find('span').text()).toContain("Header Content"); - }) -}); \ No newline at end of file + // Assert + expect(wrapper.find("span").text()).toContain("Header Content"); + }); +}); diff --git a/src/uxComponents/header/header.vue b/src/uxComponents/header/header.vue index a2a68eeb7..621e4c917 100644 --- a/src/uxComponents/header/header.vue +++ b/src/uxComponents/header/header.vue @@ -1,16 +1,16 @@ \ No newline at end of file + diff --git a/src/uxComponents/listButton/listButton.spec.js b/src/uxComponents/listButton/listButton.spec.js index e360d0fc1..3d0843e10 100644 --- a/src/uxComponents/listButton/listButton.spec.js +++ b/src/uxComponents/listButton/listButton.spec.js @@ -1 +1 @@ -test.todo('some test to be written in the future'); +test.todo("some test to be written in the future"); diff --git a/src/uxComponents/listButton/listButton.vue b/src/uxComponents/listButton/listButton.vue index e6297fe60..2580b0f83 100644 --- a/src/uxComponents/listButton/listButton.vue +++ b/src/uxComponents/listButton/listButton.vue @@ -3,8 +3,11 @@ @@ -16,12 +19,12 @@ export default { name: "listButton", props: { buttonText: String, - errorText: String + errorText: String, }, data() { return { isLoading: false, - isError: false + isError: false, }; }, methods: { diff --git a/src/uxComponents/radio/radio.spec.js b/src/uxComponents/radio/radio.spec.js index ba59e2650..35ddfdab7 100644 --- a/src/uxComponents/radio/radio.spec.js +++ b/src/uxComponents/radio/radio.spec.js @@ -1,23 +1,23 @@ -import { shallowMount } from '@vue/test-utils'; -import radio from './radio'; +import { shallowMount } from "@vue/test-utils"; +import radio from "./radio"; -describe('radio.vue', () => { - it("Should render the 'text' prop value as a span value for the radio button label and add the 'value' prop value as the radio button value and id.", () => { - // Act - const wrapper = shallowMount(radio, { - propsData: { - value: '2023', - text: '12' - } - }); +describe("radio.vue", () => { + it("Should render the 'text' prop value as a span value for the radio button label and add the 'value' prop value as the radio button value and id.", () => { + // Act + const wrapper = shallowMount(radio, { + propsData: { + value: "2023", + text: "12", + }, + }); - // Assert - expect(wrapper.find('span').text()).toEqual('12'); - expect(wrapper.find('input').attributes()).toEqual({ - class: 'position-absolute opacity-0', - id: '2023', - type: 'radio', - value: '2023' - }); - }) -}) \ No newline at end of file + // Assert + expect(wrapper.find("span").text()).toEqual("12"); + expect(wrapper.find("input").attributes()).toEqual({ + class: "position-absolute opacity-0", + id: "2023", + type: "radio", + value: "2023", + }); + }); +}); diff --git a/src/uxComponents/radio/radio.vue b/src/uxComponents/radio/radio.vue index 1f4e63f39..ac005bca4 100644 --- a/src/uxComponents/radio/radio.vue +++ b/src/uxComponents/radio/radio.vue @@ -1,30 +1,26 @@ \ No newline at end of file + diff --git a/src/uxComponents/radioList/radioList.spec.js b/src/uxComponents/radioList/radioList.spec.js index 882a68129..3d0843e10 100644 --- a/src/uxComponents/radioList/radioList.spec.js +++ b/src/uxComponents/radioList/radioList.spec.js @@ -1 +1 @@ -test.todo('some test to be written in the future'); \ No newline at end of file +test.todo("some test to be written in the future"); diff --git a/src/uxComponents/radioList/radioList.vue b/src/uxComponents/radioList/radioList.vue index 6b59e6f57..867892df9 100644 --- a/src/uxComponents/radioList/radioList.vue +++ b/src/uxComponents/radioList/radioList.vue @@ -1,28 +1,36 @@