add ESLint for netlify-functions-ecommerce and run ESLint with tests

stargate · Nov 24, 2023 · 257f713 · 257f713
1 parent 3278ff7
commit 257f713
Show file tree

Hide file tree

Showing 11 changed files with 46 additions and 28 deletions.
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -43,6 +43,8 @@ jobs:
 
       - run: npm install
         working-directory: discord-bot
+      - run: npm run lint
+        working-directory: discord-bot
       - run: npm test
         working-directory: discord-bot
   test-ecommerce:
@@ -82,5 +84,7 @@ jobs:
 
       - run: npm install
         working-directory: netlify-functions-ecommerce
+      - run: npm run lint
+        working-directory: netlify-functions-ecommerce
       - run: npm test
         working-directory: netlify-functions-ecommerce
diff --git a/netlify-functions-ecommerce/.eslintignore b/netlify-functions-ecommerce/.eslintignore
@@ -0,0 +1 @@
+public
diff --git a/netlify-functions-ecommerce/.eslintrc.js b/netlify-functions-ecommerce/.eslintrc.js
@@ -0,0 +1,14 @@
+'use strict';
+
+module.exports = {
+  extends: [
+    '@masteringjs'
+  ],
+  parserOptions: {
+    ecmaVersion: 2020
+  },
+  env: {
+    node: true,
+    es6: true
+  }
+};
diff --git a/netlify-functions-ecommerce/connect.js b/netlify-functions-ecommerce/connect.js
@@ -5,7 +5,7 @@ require('dotenv').config();
 const mongoose = require('./mongoose');
 
 require('./models');
-const {createAstraUri} = require("stargate-mongoose");
+const { createAstraUri } = require('stargate-mongoose');
 
 let conn = null;
 

diff --git a/netlify-functions-ecommerce/frontend/.eslintrc.js b/netlify-functions-ecommerce/frontend/.eslintrc.js
@@ -0,0 +1,11 @@
+'use strict';
+
+module.exports = {
+  env: {
+    browser: true
+  },
+  globals: {
+    Vue: true,
+    VueRouter: true
+  }
+};
diff --git a/netlify-functions-ecommerce/frontend/src/BaseComponent.js b/netlify-functions-ecommerce/frontend/src/BaseComponent.js
@@ -1,3 +1,5 @@
+'use strict';
+
 module.exports = (html, css) => {
   appendCSS(css);
   return {

diff --git a/netlify-functions-ecommerce/frontend/src/cart/cart.js b/netlify-functions-ecommerce/frontend/src/cart/cart.js
@@ -10,7 +10,7 @@ module.exports = app => app.component('cart', {
   computed: {
     cartTotal() {
       return '$' + this.state.cart.items.reduce((sum, item) => {
-        return sum + (+(item.quantity * this.product(item).price).toFixed(2))
+        return sum + (+(item.quantity * this.product(item).price).toFixed(2));
       }, 0).toFixed(2);
     }
   },

diff --git a/netlify-functions-ecommerce/netlify/functions/checkout.js b/netlify-functions-ecommerce/netlify/functions/checkout.js
@@ -39,7 +39,7 @@ const handler = async(event) => {
       return {
         statusCode: 200,
         body: JSON.stringify({ cart: cart, url: '/order-confirmation' })
-      }
+      };
     }
 
     const session = await stripe.checkout.sessions.create({

diff --git a/netlify-functions-ecommerce/package.json b/netlify-functions-ecommerce/package.json
@@ -12,7 +12,9 @@
     "webpack": "5.x"
   },
   "devDependencies": {
+    "@masteringjs/eslint-config": "0.0.1",
     "axios": "1.6.2",
+    "eslint": "8.54.0",
     "mocha": "10.2.0",
     "netlify-cli": "17.5.1"
   },
@@ -21,6 +23,7 @@
   },
   "scripts": {
     "build": "node ./frontend/build",
+    "lint": "eslint .",
     "seed": "node ./seed",
     "start": "netlify dev --dir public --functions netlify/functions",
     "test": "mocha ./test/*.test.js",

diff --git a/netlify-functions-ecommerce/public/app.js b/netlify-functions-ecommerce/public/app.js
@@ -1,4 +1,5 @@
 /******/ (() => { // webpackBootstrap
+/******/ 	"use strict";
 /******/ 	var __webpack_modules__ = ({
 
 /***/ "./frontend/src/BaseComponent.js":
@@ -7,6 +8,8 @@
   \***************************************/
 /***/ ((module) => {
 
+
+
 module.exports = (html, css) => {
   appendCSS(css);
   return {
@@ -42,7 +45,6 @@ function appendCSS(css) {
   \***********************************/
 /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
 
-"use strict";
 
 
 const BaseComponent = __webpack_require__(/*! ../BaseComponent */ "./frontend/src/BaseComponent.js");
@@ -55,7 +57,7 @@ module.exports = app => app.component('cart', {
   computed: {
     cartTotal() {
       return '$' + this.state.cart.items.reduce((sum, item) => {
-        return sum + (+(item.quantity * this.product(item).price).toFixed(2))
+        return sum + (+(item.quantity * this.product(item).price).toFixed(2));
       }, 0).toFixed(2);
     }
   },
@@ -100,7 +102,6 @@ module.exports = app => app.component('cart', {
   \***********************************/
 /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
 
-"use strict";
 
 
 const BaseComponent = __webpack_require__(/*! ../BaseComponent */ "./frontend/src/BaseComponent.js");
@@ -148,7 +149,6 @@ module.exports = app => app.component('home', {
   \***************************************/
 /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
 
-"use strict";
 
 
 const BaseComponent = __webpack_require__(/*! ../BaseComponent */ "./frontend/src/BaseComponent.js");
@@ -166,7 +166,6 @@ module.exports = app => app.component('navbar', {
   \***************************************************************/
 /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
 
-"use strict";
 
 
 const BaseComponent = __webpack_require__(/*! ../BaseComponent */ "./frontend/src/BaseComponent.js");
@@ -207,7 +206,6 @@ module.exports = app => app.component('order-confirmation', {
   \*****************************************/
 /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
 
-"use strict";
 
 
 const BaseComponent = __webpack_require__(/*! ../BaseComponent */ "./frontend/src/BaseComponent.js");
@@ -261,7 +259,6 @@ module.exports = app => app.component('product', {
   \*******************************************/
 /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
 
-"use strict";
 
 
 const BaseComponent = __webpack_require__(/*! ../BaseComponent */ "./frontend/src/BaseComponent.js");
@@ -309,7 +306,6 @@ module.exports = app => app.component('products', {
   \********************************/
 /***/ ((module) => {
 
-"use strict";
 
 
 module.exports = [
@@ -343,7 +339,6 @@ module.exports = [
   \************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = ".cart .cart-item {\n  display: flex;\n  gap: 10px;\n  width: 100%;\n  margin-bottom: 1em;\n}\n\n.cart .cart-item .product-image {\n  width: 80px;\n  border: 1px solid #ddd;\n  border-radius: 8px;\n  padding: 5px;\n}\n\n.cart .cart-item .product-image img {\n  width: 100%;\n  height: auto;\n  vertical-align: middle;\n}\n\n.cart .cart-item .item-description {\n  flex-grow: 1;\n}\n\n.cart .cart-item .item-description .name {\n  margin-bottom: 0.5em;\n  font-weight: bold;\n}\n\n.cart .cart-item .subtotal {\n  width: 120px;\n  font-weight: bold;\n  text-align: right;\n}\n\n.cart .total {\n  width: 100%;\n  font-weight: bold;\n  border-top: 1px solid #ddd;\n  padding-top: 1em;\n  display: flex;\n}\n\n.cart .total .total-text {\n  width: 50%;\n}\n\n.cart .total .total-price {\n  text-align: right;\n  width: 50%;\n}\n\n.cart .checkout {\n  text-align: center;\n}\n\n.cart .checkout button {\n  margin-top: 1em;\n  font-size: 2em;\n  background-color: white;\n  border: 2px solid #43783E;\n  color: #43783E;\n  padding: 0.5em 1em;\n  border-radius: 16px;\n}\n\n.cart .checkout button:hover {\n  color: white;\n  background-color: #43783E;\n}";
 
 /***/ }),
@@ -354,7 +349,6 @@ module.exports = ".cart .cart-item {\n  display: flex;\n  gap: 10px;\n  width: 1
   \*************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = "<div class=\"cart\">\n  <h1>My Cart</h1>\n  <div v-if=\"state.cart\">\n    <div v-for=\"item in state.cart.items\" class=\"cart-item\">\n      <div class=\"product-image\">\n        <img :src=\"product(item).image\">\n      </div>\n      <div class=\"item-description\">\n        <div class=\"name\">\n          {{product(item).name}}\n        </div>\n        <div class=\"quantity\">\n          x{{item.quantity}}\n        </div>\n      </div>\n      <div class=\"subtotal\">\n        {{formatTotal(item, product(item))}}\n      </div>\n    </div>\n    <div class=\"total\">\n      <div class=\"total-text\">\n        Total\n      </div>\n      <div class=\"total-price\">\n        {{cartTotal}}\n      </div>\n    </div>\n\n    <div class=\"checkout\">\n      <button @click=\"checkout\" :disabled=\"submitting\">\n        <span v-if=\"!submitting\">Check Out</span>\n        <span v-else><img src=\"/images/loader.gif\"></span>\n      </button>\n    </div>\n  </div>\n</div>";
 
 /***/ }),
@@ -365,7 +359,6 @@ module.exports = "<div class=\"cart\">\n  <h1>My Cart</h1>\n  <div v-if=\"state.
   \************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = ".home {\n  margin-bottom: 80px;\n}\n\n.home .hero {\n  background-color: #CFFC7B;\n  padding: 50px;\n  position: relative;\n  overflow: hidden;\n}\n\n.home .hero h1 {\n  line-height: 1.25em;\n}\n\n.home .hero button {\n  padding: 10px 15px;\n  border-radius: 8px;\n  color: white;\n  background-color: #43783E;\n  border: 0px;\n  font-size: 1.5em;\n  margin-top: 10px;\n}\n\n.home .hero img {\n  width: 33%;\n  position: absolute;\n  right: 15px;\n  top: -10px;\n}\n\n.home .iphone {\n  width: 25%;\n}\n\n.home .iphone .image-wrapper {\n  background-color: #ddd;\n  padding-top: 10px;\n  padding-bottom: 10px;\n}\n\n.home .iphone img {\n  width: 100%;\n}\n\n.home .iphone-container {\n  display: flex;\n  gap: 15px;\n}\n\n.home .iphone .info-wrapper {\n  font-weight: bold;\n  display: flex;\n  margin-top: 0.5em;\n}\n\n.home .iphone .info-wrapper .price {\n  text-align: right;\n  flex-grow: 1;\n}";
 
 /***/ }),
@@ -376,7 +369,6 @@ module.exports = ".home {\n  margin-bottom: 80px;\n}\n\n.home .hero {\n  backgro
   \*************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = "<div class=\"home\">\n  <div class=\"hero\">\n    <div class=\"image-bg\">\n      <img src=\"/images/woman-with-iphone.png\">\n    </div>\n    <h1>\n      Get the Latest iPhones<br>at the Best Prices \n    </h1>\n    <router-link to=\"/products\">\n      <button>Shop Now!</button>\n    </router-link>\n  </div>\n  <div>\n    <h2>iPhones For You</h2>\n\n    <div class=\"iphone-container\">\n      <div v-for=\"product in state.products\" class=\"iphone\">\n        <div class=\"image-wrapper\">\n          <router-link :to=\"'/products/' + product._id\">\n            <img :src=\"product.image\">\n          </router-link>\n        </div>\n        <div class=\"info-wrapper\">\n          <router-link :to=\"'/products/' + product._id\">\n            {{product.name}}\n          </router-link>\n          <div class=\"price\">\n            {{formatPrice(product.price)}}\n          </div>\n        </div>\n        <div class=\"add-to-cart\">\n          <button @click=\"addToCart(product)\" :disabled=\"submitting === product\">\n            <span v-if=\"submitting !== product\">Add to Cart</span>\n            <span v-else><img src=\"/images/loader.gif\"></span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>";
 
 /***/ }),
@@ -387,7 +379,6 @@ module.exports = "<div class=\"home\">\n  <div class=\"hero\">\n    <div class=\
   \****************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = ".navbar {\n  max-width: 1000px;\n  display: flex;\n  margin-left: auto;\n  margin-right: auto;\n  margin-bottom: 25px;\n  margin-top: 10px;\n}\n\n.navbar img {\n  vertical-align: middle;\n}\n\n.navbar .logo {\n  flex-grow: 0;\n  font-size: 2em;\n}\n\n.navbar .logo img {\n  height: 45px;\n}\n\n.navbar .nav-center {\n  flex-grow: 1;\n}\n\n.navbar .right {\n  padding-top: 11px;\n  position: relative;\n}\n\n.navbar .right img {\n  height: 1.5em;\n  margin-right: 0.5em;\n}\n\n.navbar .right .cart-indicator {\n  position: absolute;\n  background-color: #43783E;\n  color: white;\n  border-radius: 50%;\n  height: 1.75em;\n  width: 1.75em;\n  font-size: 0.7em;\n  left: 1.25em;\n  top: 0.25em;\n  text-align: center;\n  line-height: 1.75em;\n}";
 
 /***/ }),
@@ -398,7 +389,6 @@ module.exports = ".navbar {\n  max-width: 1000px;\n  display: flex;\n  margin-le
   \*****************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = "<div class=\"navbar\">\n  <div class=\"logo\">\n    <router-link to=\"/\">\n      <img src=\"/images/logo.png\">\n      iPhoneMarket\n    </router-link>\n  </div>\n  <div class=\"nav-center\">&nbsp;</div>\n  <div class=\"right\">\n    <router-link to=\"/cart\">\n      <img src=\"/images/shopping-cart.svg\">\n      <span>Cart</span>\n      <div\n        class=\"cart-indicator\"\n        v-if=\"state.cart && state.cart.numItems\">\n        {{state.cart.numItems}}\n      </div>\n    </router-link>\n  </div>\n</div>";
 
 /***/ }),
@@ -409,7 +399,6 @@ module.exports = "<div class=\"navbar\">\n  <div class=\"logo\">\n    <router-li
   \****************************************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = ".order-confirmation .order-info {\n  display: flex;\n}\n\n.order-confirmation .order-info .order-detail {\n  flex-grow: 1;\n}\n\n.order-confirmation .order-info .order-detail .subheader {\n  font-weight: bold;\n}\n\n.order-confirmation button {\n  background-color: white;\n  border: 2px solid #43783E;\n  color: #43783E;\n  padding: 0.5em 1em;\n  border-radius: 16px;\n  margin-top: 1em;\n}\n\n.order-confirmation button:hover {\n  background-color: #43783E;\n  border: 2px solid #43783E;\n  color: white;\n}";
 
 /***/ }),
@@ -420,7 +409,6 @@ module.exports = ".order-confirmation .order-info {\n  display: flex;\n}\n\n.ord
   \*****************************************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = "<div class=\"order-confirmation\">\n  <div v-if=\"order\">\n    <h1>Your Order is Confirmed</h1>\n    <div class=\"order-info\">\n      <div class=\"order-detail\">\n        <div class=\"subheader\">\n          Total\n        </div>\n        <div>\n          ${{order.total.toFixed(2)}}\n        </div>\n      </div>\n      <div class=\"order-detail\">\n        <div class=\"subheader\">\n          Payment Method\n        </div>\n        <div>\n          {{order.paymentMethod.brand}} ending in {{order.paymentMethod.last4}}\n        </div>\n      </div>\n    </div>\n\n    <div>\n      <router-link to=\"/\">\n        <button>Back to Store</button>\n      </router-link>\n    </div>\n  </div>\n</div>";
 
 /***/ }),
@@ -431,7 +419,6 @@ module.exports = "<div class=\"order-confirmation\">\n  <div v-if=\"order\">\n
   \******************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = ".product .product-wrapper {\n  display: flex;\n  gap: 20px;\n}\n\n.product .breadcrumbs {\n  font-size: 0.9em;\n  color: #666;\n  margin-bottom: 1em;\n}\n\n.product .breadcrumbs a {\n  color: #666;\n}\n\n.product .product-wrapper .product-image {\n  width: 50%;\n  background-color: #ddd;\n}\n\n.product .product-wrapper .product-image img {\n  width: 100%;\n}\n\n.product .product-wrapper .product-description {\n  width: 50%;\n}\n\n.product .product-description .name {\n  font-size: 1.5em;\n  font-weight: bold;\n  margin-bottom: 0.5em;\n}\n\n.product .product-description .price {\n  margin-bottom: 1em;\n  font-weight: bold;\n}\n\n.product .product-description .description {\n  line-height: 1.5em;\n  margin-bottom: 1em;\n}\n\n.product .product-description button {\n  font-size: 1.5em;\n}";
 
 /***/ }),
@@ -442,7 +429,6 @@ module.exports = ".product .product-wrapper {\n  display: flex;\n  gap: 20px;\n}
   \*******************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = "<div class=\"product\">\n  <div class=\"breadcrumbs\" v-if=\"product\">\n    <router-link to=\"/products\">All Products</router-link>\n    /\n    {{product.name}}\n  </div>\n  <div class=\"product-wrapper\" v-if=\"product\">\n    <div class=\"product-image\">\n      <img :src=\"product.image\">\n    </div>\n    <div class=\"product-description\">\n      <div class=\"name\">\n        {{product.name}}\n      </div>\n      <div class=\"price\">\n        {{formatPrice(product.price)}}\n      </div>\n      <div class=\"description\">\n        {{product.description}}\n      </div>\n  \n      <div class=\"add-to-cart\">\n        <button @click=\"addToCart(product)\" :disabled=\"submitting === product\">\n          <span v-if=\"submitting !== product\">Add to Cart</span>\n          <span v-else><img src=\"/images/loader.gif\"></span>\n        </button>\n      </div>\n    </div>\n  </div>\n</div>";
 
 /***/ }),
@@ -453,7 +439,6 @@ module.exports = "<div class=\"product\">\n  <div class=\"breadcrumbs\" v-if=\"p
   \********************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = ".products .iphone {\n  width: 25%;\n}\n\n.products .iphone .image-wrapper {\n  background-color: #ddd;\n  padding-top: 10px;\n  padding-bottom: 10px;\n}\n\n.products .iphone img {\n  width: 100%;\n}\n\n.products .iphone-container {\n  display: flex;\n  gap: 15px;\n}\n\n.products .iphone .info-wrapper {\n  font-weight: bold;\n  display: flex;\n  margin-top: 0.5em;\n}\n\n.products .iphone .info-wrapper .price {\n  text-align: right;\n  flex-grow: 1;\n}";
 
 /***/ }),
@@ -464,7 +449,6 @@ module.exports = ".products .iphone {\n  width: 25%;\n}\n\n.products .iphone .im
   \*********************************************/
 /***/ ((module) => {
 
-"use strict";
 module.exports = "<div class=\"products\">\n  <h1>All Products</h1>\n  <div class=\"iphone-container\">\n    <div v-for=\"product in state.products\" class=\"iphone\">\n      <div class=\"image-wrapper\">\n        <router-link :to=\"'/products/' + product._id\">\n          <img :src=\"product.image\">\n        </router-link>\n      </div>\n      <div class=\"info-wrapper\">\n        <div>\n          <router-link :to=\"'/products/' + product._id\">\n            {{product.name}}\n          </router-link>\n        </div>\n        <div class=\"price\">\n          {{formatPrice(product.price)}}\n        </div>\n      </div>\n      <div class=\"add-to-cart\">\n        <button @click=\"addToCart(product)\" :disabled=\"submitting === product\">\n          <span v-if=\"submitting !== product\">Add to Cart</span>\n          <span v-else><img src=\"/images/loader.gif\"></span>\n        </button>\n      </div>\n    </div>\n  </div>\n</div>";
 
 /***/ })
@@ -497,9 +481,8 @@ module.exports = "<div class=\"products\">\n  <h1>All Products</h1>\n  <div clas
 /******/ 	
 /************************************************************************/
 var __webpack_exports__ = {};
-// This entry need to be wrapped in an IIFE because it need to be in strict mode.
+// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
 (() => {
-"use strict";
 /*!*******************************!*\
   !*** ./frontend/src/index.js ***!
   \*******************************/

diff --git a/netlify-functions-ecommerce/test/setup.test.js b/netlify-functions-ecommerce/test/setup.test.js
@@ -2,20 +2,20 @@
 
 require('dotenv').config({ path: `${__dirname}/../.env.test` });
 
-const { after } = require('mocha');
+const { after, before } = require('mocha');
 const connect = require('../connect');
 const mongoose = require('../mongoose');
 
 before(async function() {
-  this.timeout(30_000);
+  this.timeout(30000);
   await connect();
 
   await Promise.all(Object.values(mongoose.connection.models).map(Model => Model.createCollection()));
   await Promise.all(Object.values(mongoose.connection.models).map(Model => Model.deleteMany({})));
 });
 
 after(async function() {
-  this.timeout(30_000);
+  this.timeout(30000);
   await Promise.all(Object.values(mongoose.connection.models).map(async Model => {
     await mongoose.connection.dropCollection(Model.collection.collectionName);
   }));