Update dependencies for mid-2021

.eslintrc.js

@@ -9,9 +9,6 @@ module.exports = {
     "@vue/standard",
     "@vue/typescript/recommended",
     "prettier",
-    "prettier/standard",
-    "prettier/vue",
-    "prettier/@typescript-eslint",
   ],
   parserOptions: {
     ecmaVersion: 2020,

.github/workflows/node.js.yml

@@ -10,7 +10,7 @@ jobs:
       - name: Use Node.js
         uses: actions/setup-node@v1
         with:
-          node-version: 12.x
+          node-version: 14.x
       - uses: actions/cache@v2
         with:
           path: ~/.npm

package.json

@@ -12,39 +12,39 @@
     "test:e2e:ci": "vue-cli-service test:e2e --headless"
   },
   "dependencies": {
-    "@mdi/font": "^5.6.55",
-    "buefy": "^0.9.3",
-    "core-js": "^3.6.5",
+    "@mdi/font": "^5.9.55",
+    "buefy": "^0.9.8",
+    "core-js": "^3.15.2",
     "svg-pan-zoom": "^3.6.1",
-    "vue": "^2.6.12",
-    "vuex": "^3.5.1"
+    "vue": "^2.6.14",
+    "vuex": "^3.6.2"
   },
   "devDependencies": {
-    "@types/jest": "^24.9.1",
-    "@typescript-eslint/eslint-plugin": "^4.2.0",
-    "@typescript-eslint/parser": "^4.2.0",
-    "@vue/cli-plugin-babel": "^4.5.6",
-    "@vue/cli-plugin-e2e-cypress": "^4.5.6",
-    "@vue/cli-plugin-eslint": "^4.5.6",
-    "@vue/cli-plugin-typescript": "^4.5.6",
-    "@vue/cli-plugin-unit-jest": "^4.5.6",
-    "@vue/cli-plugin-vuex": "^4.5.6",
-    "@vue/cli-service": "^4.5.6",
-    "@vue/eslint-config-standard": "^5.1.2",
-    "@vue/eslint-config-typescript": "^5.1.0",
-    "@vue/test-utils": "^1.1.0",
-    "eslint": "^7.10.0",
-    "eslint-config-prettier": "^6.12.0",
-    "eslint-plugin-import": "^2.20.2",
+    "@types/jest": "^26.0.24",
+    "@typescript-eslint/eslint-plugin": "^4.28.3",
+    "@typescript-eslint/parser": "^4.28.3",
+    "@vue/cli-plugin-babel": "^4.5.13",
+    "@vue/cli-plugin-e2e-cypress": "^4.5.13",
+    "@vue/cli-plugin-eslint": "^4.5.13",
+    "@vue/cli-plugin-typescript": "^4.5.13",
+    "@vue/cli-plugin-unit-jest": "^4.5.13",
+    "@vue/cli-plugin-vuex": "^4.5.13",
+    "@vue/cli-service": "^4.5.13",
+    "@vue/eslint-config-standard": "^6.0.0",
+    "@vue/eslint-config-typescript": "^7.0.0",
+    "@vue/test-utils": "^1.2.1",
+    "eslint": "^7.30.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-import": "^2.23.4",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-promise": "^4.2.1",
-    "eslint-plugin-standard": "^4.0.0",
-    "eslint-plugin-vue": "^6.2.2",
-    "node-sass": "^4.14.1",
-    "prettier": "^2.1.2",
-    "sass-loader": "^8.0.2",
-    "typescript": "^3.9.7",
-    "vue-template-compiler": "^2.6.12"
+    "eslint-plugin-promise": "^5.1.0",
+    "eslint-plugin-standard": "^5.0.0",
+    "eslint-plugin-vue": "^7.13.0",
+    "node-sass": "^6.0.1",
+    "prettier": "^2.3.2",
+    "sass-loader": "^10.2.0",
+    "typescript": "^4.3.5",
+    "vue-template-compiler": "^2.6.14"
   },
   "browserslist": [
     "defaults"

src/components/menu-bottom/MenuBottomTools.vue

@@ -71,9 +71,8 @@ export default Vue.extend({
     setTool(toolIndex: number): void {
       this.$data.toolSelectedIndex = toolIndex;
       console.log("which tool ", toolIndex);
-      const ToolConstructor: ToolConstructor = this.$data.toolDataList[
-        toolIndex
-      ].tool;
+      const ToolConstructor: ToolConstructor =
+        this.$data.toolDataList[toolIndex].tool;
       const tool: BaseTool = new ToolConstructor();
       this.$store.commit(Mutations.SET_TOOL_SELECTED, tool);
       if (!tool.supportsSelection) {

src/models/StuntSheet.ts

@@ -60,11 +60,9 @@ export default class StuntSheet extends Serializable<StuntSheet> {
     }
     if (json.dotTypes !== undefined) {
       json.dotTypes = json.dotTypes.map((dotType: BaseCont[]): BaseCont[] => {
-        return dotType.map(
-          (continuity: BaseCont): BaseCont => {
-            return loadContinuity(continuity);
-          }
-        );
+        return dotType.map((continuity: BaseCont): BaseCont => {
+          return loadContinuity(continuity);
+        });
       });
     }
     if (json.dotAppearances !== undefined) {

src/models/UndoRedo.ts

@@ -167,45 +167,45 @@ export class UndoRedo extends Serializable<UndoRedo> {
       this.reinitializeUndoRedo(store.state.show);
       // called when the store is initialized
       // State could be useful in the future.
-      store.subscribe((
-        mutation: MutationPayload /*, state: CalChartState */
-      ) => {
-        if (UNDOABLE_ACTIONS.includes(mutation.type as Mutations)) {
-          if (this.currentShapshot + 1 === this.maxSnapshots) {
-            this.stateSnapshots.shift();
-          } else {
-            this.currentShapshot = this.currentShapshot + 1;
-            this.stateSnapshots = this.stateSnapshots.slice(
-              0,
-              this.currentShapshot
-            );
+      store.subscribe(
+        (mutation: MutationPayload /*, state: CalChartState */) => {
+          if (UNDOABLE_ACTIONS.includes(mutation.type as Mutations)) {
+            if (this.currentShapshot + 1 === this.maxSnapshots) {
+              this.stateSnapshots.shift();
+            } else {
+              this.currentShapshot = this.currentShapshot + 1;
+              this.stateSnapshots = this.stateSnapshots.slice(
+                0,
+                this.currentShapshot
+              );
+            }
+            this.stateSnapshots.push([
+              JSON.stringify(store.state.show),
+              mutation.type,
+            ]);
           }
-          this.stateSnapshots.push([
-            JSON.stringify(store.state.show),
-            mutation.type,
-          ]);
-        }
-        if (mutation.type === Mutations.UNDO) {
-          if (!this.canUndo()) {
-            return;
+          if (mutation.type === Mutations.UNDO) {
+            if (!this.canUndo()) {
+              return;
+            }
+            this.currentShapshot = this.currentShapshot - 1;
+            store.commit(
+              Mutations.SET_SHOW,
+              new Show(JSON.parse(this.stateSnapshots[this.currentShapshot][0]))
+            );
           }
-          this.currentShapshot = this.currentShapshot - 1;
-          store.commit(
-            Mutations.SET_SHOW,
-            new Show(JSON.parse(this.stateSnapshots[this.currentShapshot][0]))
-          );
-        }
-        if (mutation.type === Mutations.REDO) {
-          if (!this.canRedo()) {
-            return;
+          if (mutation.type === Mutations.REDO) {
+            if (!this.canRedo()) {
+              return;
+            }
+            this.currentShapshot = this.currentShapshot + 1;
+            store.commit(
+              Mutations.SET_SHOW,
+              new Show(JSON.parse(this.stateSnapshots[this.currentShapshot][0]))
+            );
           }
-          this.currentShapshot = this.currentShapshot + 1;
-          store.commit(
-            Mutations.SET_SHOW,
-            new Show(JSON.parse(this.stateSnapshots[this.currentShapshot][0]))
-          );
         }
-      });
+      );
     };
   }
 }

src/models/continuity/ContCounterMarch.ts

@@ -9,7 +9,8 @@ import Serializable from "../util/Serializable";
  */
 export default class ContCounterMarch
   extends Serializable<ContCounterMarch>
-  implements BaseCont {
+  implements BaseCont
+{
   readonly continuityId: CONT_IDS = CONT_IDS.COUNTER_MARCH;
 
   duration = 0;

src/models/continuity/ContETFDynamic.ts

@@ -24,7 +24,8 @@ export enum ETF_DYNAMIC_TYPES {
  */
 export default class ContETFDynamic
   extends Serializable<ContETFDynamic>
-  implements BaseCont {
+  implements BaseCont
+{
   readonly continuityId: CONT_IDS = CONT_IDS.ETF_DYNAMIC;
 
   duration = 0;

src/models/continuity/ContETFStatic.ts

@@ -14,7 +14,8 @@ import Serializable from "../util/Serializable";
  */
 export default class ContETFStatic
   extends Serializable<ContETFStatic>
-  implements BaseCont {
+  implements BaseCont
+{
   readonly continuityId: CONT_IDS = CONT_IDS.ETF_STATIC;
 
   duration = 8;

src/models/continuity/ContEven.ts

@@ -13,7 +13,8 @@ import Serializable from "../util/Serializable";
  */
 export default class ContEven
   extends Serializable<ContEven>
-  implements BaseCont {
+  implements BaseCont
+{
   readonly continuityId: CONT_IDS = CONT_IDS.EVEN;
 
   duration = 8;

src/models/continuity/ContFollowLeader.ts

@@ -11,7 +11,8 @@ import Serializable from "../util/Serializable";
  */
 export default class ContFollowLeader
   extends Serializable<ContFollowLeader>
-  implements BaseCont {
+  implements BaseCont
+{
   readonly continuityId: CONT_IDS = CONT_IDS.FOLLOW_LEADER;
 
   duration = 8;

src/models/continuity/ContGateTurn.ts

@@ -12,7 +12,8 @@ import Serializable from "../util/Serializable";
  */
 export default class ContGateTurn
   extends Serializable<ContGateTurn>
-  implements BaseCont {
+  implements BaseCont
+{
   readonly continuityId: CONT_IDS = CONT_IDS.GATE_TURN;
 
   duration = 8;

src/models/continuity/ContInPlace.ts

@@ -13,7 +13,8 @@ import Serializable from "../util/Serializable";
  */
 export default class ContInPlace
   extends Serializable<ContInPlace>
-  implements BaseCont {
+  implements BaseCont
+{
   readonly continuityId: CONT_IDS = CONT_IDS.IN_PLACE;
 
   duration = 0;

src/models/continuity/ContStepTwo.ts

@@ -16,7 +16,8 @@ import Serializable from "../util/Serializable";
  */
 export default class ContStepTwo
   extends Serializable<ContStepTwo>
-  implements BaseCont {
+  implements BaseCont
+{
   readonly continuityId: CONT_IDS = CONT_IDS.STEP_TWO;
 
   duration = 8;

src/store/getters.ts

@@ -23,13 +23,12 @@ const getters: GetterTree<CalChartState, CalChartState> = {
   getSelectedStuntIndex: (state): number => state.show.selectedSS,
   getSelectedStuntSheet: (state): StuntSheet =>
     state.show.stuntSheets[state.show.selectedSS],
-  getContinuity: (state) => (
-    dotTypeIndex: number,
-    continuityIndex: number
-  ): BaseCont =>
-    state.show.stuntSheets[state.show.selectedSS].dotTypes[dotTypeIndex][
-      continuityIndex
-    ],
+  getContinuity:
+    (state) =>
+    (dotTypeIndex: number, continuityIndex: number): BaseCont =>
+      state.show.stuntSheets[state.show.selectedSS].dotTypes[dotTypeIndex][
+        continuityIndex
+      ],
 
   // Undo
   getCanUndo: (state): boolean => state.undoRedo.canUndo(),

tests/e2e/specs/menu-left/MenuLeft.spec.js

@@ -20,8 +20,7 @@ describe("components/menu-left/MenuLeft", () => {
 
     cy.get('[data-test="ss-modal--beats"]')
       .should("have.value", "16")
-      .clear()
-      .type("2");
+      .type("{selectall}2");
 
     cy.get('[data-test="ss-modal--close"]').click();
 
@@ -71,8 +70,7 @@ describe("components/menu-left/MenuLeft", () => {
 
     cy.get('[data-test="ss-modal--beats"]')
       .should("have.value", "16")
-      .clear()
-      .type("4");
+      .type("{selectall}4");
 
     cy.get('[data-test="ss-modal--close"]').click();
 

tests/e2e/specs/menu-top/FileModal.spec.js

@@ -46,9 +46,13 @@ describe("components/menu-top/FileModal", () => {
   });
 
   it("field changes shape upon adjusting hashes and middle of field", () => {
-    cy.get('[data-test="file-modal--front-hash-offset-y"]').clear().type("8");
+    cy.get('[data-test="file-modal--front-hash-offset-y"]').type(
+      "{selectall}8"
+    );
 
-    cy.get('[data-test="file-modal--back-hash-offset-y"]').clear().type("16");
+    cy.get('[data-test="file-modal--back-hash-offset-y"]').type(
+      "{selectall}16"
+    );
 
     cy.get('[data-test="file-modal--middle-of-field"]').clear();
 

tests/unit/components/menu-right/ContETFDynamicEditor.spec.ts

@@ -68,7 +68,8 @@ describe("components/menu-right/ContETFDynamicEditor", () => {
         '[data-test="cont-etf-dynamic--march-type"]'
       );
       expect(selectMarchType.exists()).toBe(true);
-      const selectMarchTypeElement = selectMarchType.element as HTMLSelectElement;
+      const selectMarchTypeElement =
+        selectMarchType.element as HTMLSelectElement;
       expect(selectMarchTypeElement.value).toBe(MARCH_TYPES.HS);
       expect(commitSpy).not.toHaveBeenCalled();
       selectMarchType.setValue(MARCH_TYPES.MINI_MILITARY);

tests/unit/components/menu-right/ContEvenEditor.spec.ts

@@ -47,7 +47,8 @@ describe("components/menu-right/ContEvenEditor", () => {
         '[data-test="cont-even--march-type"]'
       );
       expect(selectMarchType.exists()).toBe(true);
-      const selectMarchTypeElement = selectMarchType.element as HTMLSelectElement;
+      const selectMarchTypeElement =
+        selectMarchType.element as HTMLSelectElement;
       expect(selectMarchTypeElement.value).toBe(MARCH_TYPES.MINI_MILITARY);
       expect(commitSpy).not.toHaveBeenCalled();
       selectMarchType.setValue(MARCH_TYPES.HS);

tests/unit/components/menu-right/ContGateTurnEditor.spec.ts

@@ -5,7 +5,7 @@ import Vuex, { Store } from "vuex";
 import ContGateTurnEditor from "@/components/menu-right/ContGateTurnEditor.vue";
 import StuntSheet from "@/models/StuntSheet";
 import Show from "@/models/Show";
-import ContETFDynamic from "@/models/continuity/ContETFDynamic.ts";
+import ContETFDynamic from "@/models/continuity/ContETFDynamic";
 import { MARCH_TYPES } from "@/models/util/constants";
 import ContGateTurn from "@/models/continuity/ContGateTurn";
 import { Mutations } from "@/store/mutations";
@@ -50,7 +50,8 @@ describe("components/menu-right/ContETFStaticEditor", () => {
         '[data-test="cont-gate-turn--march-type"]'
       );
       expect(selectMarchType.exists()).toBe(true);
-      const selectMarchTypeElement = selectMarchType.element as HTMLSelectElement;
+      const selectMarchTypeElement =
+        selectMarchType.element as HTMLSelectElement;
       expect(selectMarchTypeElement.value).toBe(MARCH_TYPES.HS);
       expect(commitSpy).not.toHaveBeenCalled();
       selectMarchType.setValue(MARCH_TYPES.MINI_MILITARY);

tests/unit/components/menu-right/ContInETFStaticEditor.spec.ts

@@ -5,7 +5,7 @@ import Vuex, { Store } from "vuex";
 import ContETFStaticEditor from "@/components/menu-right/ContETFStaticEditor.vue";
 import StuntSheet from "@/models/StuntSheet";
 import Show from "@/models/Show";
-import ContETFStatic from "@/models/continuity/ContETFStatic.ts";
+import ContETFStatic from "@/models/continuity/ContETFStatic";
 import { DIRECTIONS, MARCH_TYPES } from "@/models/util/constants";
 import ContETFDynamic from "@/models/continuity/ContETFDynamic";
 import { Mutations } from "@/store/mutations";
@@ -50,7 +50,8 @@ describe("components/menu-right/ContETFStaticEditor", () => {
         '[data-test="cont-etf-static--march-type"]'
       );
       expect(selectMarchType.exists()).toBe(true);
-      const selectMarchTypeElement = selectMarchType.element as HTMLSelectElement;
+      const selectMarchTypeElement =
+        selectMarchType.element as HTMLSelectElement;
       expect(selectMarchTypeElement.value).toBe(MARCH_TYPES.HS);
       expect(commitSpy).not.toHaveBeenCalled();
       selectMarchType.setValue(MARCH_TYPES.MINI_MILITARY);
@@ -84,7 +85,8 @@ describe("components/menu-right/ContETFStaticEditor", () => {
         '[data-test="cont-etf-static--marching-direction"]'
       );
       expect(selectDirection.exists()).toBe(true);
-      const selectDirectionElement = selectDirection.element as HTMLSelectElement;
+      const selectDirectionElement =
+        selectDirection.element as HTMLSelectElement;
       expect(selectDirectionElement.value).toBe(`${DIRECTIONS.E}`);
       expect(commitSpy).not.toHaveBeenCalled();
       selectDirection.setValue(`${DIRECTIONS.S}`);