diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index 064665526..f9fd8ab9e 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -15,6 +15,14 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
+const commaDangle = {
+  arrays: 'always-multiline',
+  objects: 'always-multiline',
+  imports: 'always-multiline',
+  exports: 'always-multiline',
+  functions: 'only-multiline',
+}
+
 module.exports = {
   root: true,
   parserOptions: {
@@ -32,40 +40,45 @@ module.exports = {
   rules: {
     'comma-dangle': [
       'error',
+      commaDangle,
+    ],
+    'vue/comma-dangle': [
+      'error',
+      commaDangle,
+    ],
+    'vue/html-indent': [
+      'error',
+      2,
       {
-        arrays: 'only-multiline',
-        objects: 'only-multiline',
-        imports: 'only-multiline',
-        exports: 'only-multiline',
-        functions: 'only-multiline',
+        alignAttributesVertically: false,
       },
     ],
     'no-console': [
       'error',
       {
-        allow: ['warn', 'error']
-      }
+        allow: ['warn', 'error'],
+      },
     ],
     'template-curly-spacing': [
-      'off'
+      'off',
     ],
     'vue/multi-word-component-names': [
-      'off'
+      'off',
     ],
     'vue/valid-v-slot': [
       'error',
       {
-        allowModifiers: true
-      }
+        allowModifiers: true,
+      },
     ],
     'promise/param-names': [
-      'error'
+      'error',
     ],
     'promise/no-return-wrap': [
-      'error'
+      'error',
     ],
     'cypress/unsafe-to-chain-command': [
-      'off'
+      'off',
     ],
   },
 }
diff --git a/cypress.config.cjs b/cypress.config.cjs
index 26285f80a..f40fc3836 100644
--- a/cypress.config.cjs
+++ b/cypress.config.cjs
@@ -36,13 +36,13 @@ module.exports = defineConfig({
       return config
     },
     specPattern: 'tests/e2e/specs/**/*.cy.{js,jsx,ts,tsx}',
-    supportFile: 'tests/e2e/support/index.js'
+    supportFile: 'tests/e2e/support/index.js',
   },
 
   component: {
     devServer: {
       framework: 'vue',
-      bundler: 'vite'
+      bundler: 'vite',
     },
     setupNodeEvents (on, config) {
       // For test coverage
@@ -51,12 +51,12 @@ module.exports = defineConfig({
     },
     specPattern: 'tests/component/**/*.cy.{js,jsx,ts,tsx}',
     supportFile: 'tests/component/support/index.js',
-    indexHtmlFile: 'tests/component/support/component-index.html'
+    indexHtmlFile: 'tests/component/support/component-index.html',
   },
 
   env: {
     // eslint-disable-next-line no-unneeded-ternary
-    coverage: process.env.COVERAGE ? true : false
+    coverage: process.env.COVERAGE ? true : false,
   },
 
   morgan: false, // Disable XHR logging as it's very noisy
diff --git a/scripts/concurrently.cjs b/scripts/concurrently.cjs
index 2a5f9bda2..9e2634673 100644
--- a/scripts/concurrently.cjs
+++ b/scripts/concurrently.cjs
@@ -8,28 +8,28 @@ const allCommands = {
   'serve:jupyterhub': {
     command: 'yarn run serve:jupyterhub',
     name: 'SERVER',
-    prefixColor: 'yellow'
+    prefixColor: 'yellow',
   },
   'serve:vue': {
     command: `yarn run serve:vue ${VITE_OPTIONS ?? ''}`,
     name: 'VITE',
-    prefixColor: 'blue'
+    prefixColor: 'blue',
   },
   preview: {
     command: `yarn run -B vite preview --mode offline ${VITE_OPTIONS ?? ''}`,
     name: 'VITE',
-    prefixColor: 'blue'
+    prefixColor: 'blue',
   },
   'e2e:open': {
     command: 'yarn run -B cypress open --e2e',
     name: 'TESTS',
-    prefixColor: 'magenta'
+    prefixColor: 'magenta',
   },
   'cy:run': {
     command: 'yarn run -B cypress run',
     name: 'TESTS',
-    prefixColor: 'cyan'
-  }
+    prefixColor: 'cyan',
+  },
 }
 
 concurrently(
diff --git a/src/components/Markdown.vue b/src/components/Markdown.vue
index 87799da48..4a233e313 100644
--- a/src/components/Markdown.vue
+++ b/src/components/Markdown.vue
@@ -34,14 +34,14 @@ export default {
   props: {
     markdown: {
       type: String,
-      required: true
-    }
+      required: true,
+    },
   },
 
   computed: {
     html () {
       return md.render(this.markdown)
-    }
-  }
+    },
+  },
 }
 </script>
diff --git a/src/components/cylc/ConnectionStatus.vue b/src/components/cylc/ConnectionStatus.vue
index 60f7f1b50..705597f64 100644
--- a/src/components/cylc/ConnectionStatus.vue
+++ b/src/components/cylc/ConnectionStatus.vue
@@ -46,8 +46,8 @@ export default {
      */
     isOffline: {
       type: Boolean,
-      required: true
-    }
+      required: true,
+    },
   },
 
   icons: {
diff --git a/src/components/cylc/Drawer.vue b/src/components/cylc/Drawer.vue
index b03c09a16..bdb9535ca 100644
--- a/src/components/cylc/Drawer.vue
+++ b/src/components/cylc/Drawer.vue
@@ -60,7 +60,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
         <v-tooltip
           activator="#version-chip"
           location="top"
-          >
+        >
           <div
             class="d-flex flex-column align-center"
             style="pointer-events: visible;"
@@ -96,7 +96,7 @@ export const minWidth = 150
 export default {
   components: {
     Workflows,
-    'c-header': Header
+    'c-header': Header,
   },
 
   setup () {
@@ -148,7 +148,7 @@ export default {
     const versionChipProps = computed(() => import.meta.env.MODE === 'production'
       ? {
           text: `Cylc ${cylcVersionInfo.value?.['cylc-flow'] ?? ''}`,
-          variant: 'text'
+          variant: 'text',
         }
       : {
           text: import.meta.env.MODE.toUpperCase(),
diff --git a/src/components/cylc/EventChip.vue b/src/components/cylc/EventChip.vue
index 7be653e0d..a419d39c8 100644
--- a/src/components/cylc/EventChip.vue
+++ b/src/components/cylc/EventChip.vue
@@ -45,7 +45,7 @@ export default {
         return { color: 'grey', variant: 'flat' }
       }
       return { color: 'grey', variant: 'outlined' }
-    }
-  }
+    },
+  },
 }
 </script>
diff --git a/src/components/cylc/GraphNode.vue b/src/components/cylc/GraphNode.vue
index fe7ca0a3a..5dedf5765 100644
--- a/src/components/cylc/GraphNode.vue
+++ b/src/components/cylc/GraphNode.vue
@@ -95,26 +95,26 @@ export default {
   name: 'GraphNode',
   components: {
     SVGTask,
-    Job
+    Job,
   },
   props: {
     task: {
       type: Object,
-      required: true
+      required: true,
     },
     jobs: {
       type: Array,
-      required: true
+      required: true,
     },
     maxJobs: {
       // maximum number of jobs to display before using an overflow indicator
       default: 6,
-      required: false
+      required: false,
     },
     mostRecentJobScale: {
       // the size of the most recent job icon relative to any previos jobs
       default: 1.2,
-      required: false
+      required: false,
     },
   },
   computed: {
@@ -147,7 +147,7 @@ export default {
       // the most recent job is larger so all subsequent jobs need to be bumped
       // along a bit further to account for this
       return (this.mostRecentJobScale * 100) - 100 // y offset in px
-    }
-  }
+    },
+  },
 }
 </script>
diff --git a/src/components/cylc/GraphSubgraph.vue b/src/components/cylc/GraphSubgraph.vue
index c81a04cf6..860f6259f 100644
--- a/src/components/cylc/GraphSubgraph.vue
+++ b/src/components/cylc/GraphSubgraph.vue
@@ -31,7 +31,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
       stroke-width="8px"
       stroke="grey"
       stroke-dasharray="50 50"
-      />
+    />
     <text
       :x="labelXPosition"
       :y="labelYPosition"
@@ -54,8 +54,8 @@ export default {
   props: {
     subgraph: {
       type: Object,
-      required: true
-    }
+      required: true,
+    },
   },
   computed: {
     labelXPosition () {
@@ -67,6 +67,6 @@ export default {
       // Adding 90pt to the y position brings the label inside the rect
       return (parseInt(this.subgraph.y) + 90)
     },
-  }
+  },
 }
 </script>
diff --git a/src/components/cylc/Header.vue b/src/components/cylc/Header.vue
index 6f343136a..63281a123 100644
--- a/src/components/cylc/Header.vue
+++ b/src/components/cylc/Header.vue
@@ -28,7 +28,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
         VCombobox: {
           bgColor: 'white',
           rules: [(val) => Boolean(val) || 'Required'],
-        }
+        },
       }">
         <!-- Owner combobox -->
         <v-combobox
@@ -105,7 +105,7 @@ import { computed, ref } from 'vue'
 import { useStore } from 'vuex'
 import { useLocalStorage } from '@vueuse/core'
 import {
-  mdiClose
+  mdiClose,
 } from '@mdi/js'
 
 const store = useStore()
diff --git a/src/components/cylc/Info.vue b/src/components/cylc/Info.vue
index dd1b6cdce..d5c2a062a 100644
--- a/src/components/cylc/Info.vue
+++ b/src/components/cylc/Info.vue
@@ -125,15 +125,15 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
           <v-expansion-panel-title>
             <template #default="{ expanded }">
               Inheritance
-                <v-icon
-                  v-if="expanded"
-                  :icon="icons.mdiHelpCircleOutline"
-                  class="ml-2"
-                  v-tooltip="{
-                    text: 'Shows the linearised family inheritance hierarchy for this task. The order of precedence is determined by the C3 algorithm used in Python.',
-                    location: 'top',
-                  }"
-                />
+              <v-icon
+                v-if="expanded"
+                :icon="icons.mdiHelpCircleOutline"
+                class="ml-2"
+                v-tooltip="{
+                  text: 'Shows the linearised family inheritance hierarchy for this task. The order of precedence is determined by the C3 algorithm used in Python.',
+                  location: 'top',
+                }"
+              />
             </template>
           </v-expansion-panel-title>
           <v-expansion-panel-text>
@@ -386,13 +386,13 @@ export default {
         return a.label > b.label ? 1 : -1
       })
       return xtriggers
-    }
+    },
 
   },
 
   methods: {
     formatCompletion,
-  }
+  },
 
 }
 </script>
diff --git a/src/components/cylc/Job.vue b/src/components/cylc/Job.vue
index 2362adbe4..d8a4889a1 100644
--- a/src/components/cylc/Job.vue
+++ b/src/components/cylc/Job.vue
@@ -43,7 +43,7 @@ const Job = (props, context) => {
       height: width,
       rx: '15',
       ry: '15',
-      'stroke-width': '10'
+      'stroke-width': '10',
     }
   )
   // the job icon SVG
@@ -63,7 +63,7 @@ const Job = (props, context) => {
         rx: '15',
         ry: '15',
         opacity: '50%',
-        'stroke-width': '10'
+        'stroke-width': '10',
       }
     )
     jobIconChildren.splice(0, 0, previousStateIconSvg)
@@ -73,7 +73,7 @@ const Job = (props, context) => {
       'g',
       { class: cJobClass },
       [
-        h('g', { class: 'job' }, jobIconChildren)
+        h('g', { class: 'job' }, jobIconChildren),
       ]
     )
   }
@@ -81,7 +81,7 @@ const Job = (props, context) => {
     'svg',
     {
       class: 'job',
-      viewBox: '0 0 100 100'
+      viewBox: '0 0 100 100',
     },
     jobIconChildren
   )
@@ -99,13 +99,13 @@ Job.props = {
   },
   previousState: {
     type: String,
-    required: false
+    required: false,
   },
   svg: {
     type: Boolean,
     required: false,
-    default: false
-  }
+    default: false,
+  },
 }
 
 export default Job
diff --git a/src/components/cylc/Mutation.vue b/src/components/cylc/Mutation.vue
index e0ba98cfd..fa22112e1 100644
--- a/src/components/cylc/Mutation.vue
+++ b/src/components/cylc/Mutation.vue
@@ -55,8 +55,8 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
               v-bind="extendedDescription ? {} : {
                 expandIcon: null,
                 style: {
-                  cursor: 'default'
-                }
+                  cursor: 'default',
+                },
               }"
             >
               <Markdown :markdown="shortDescription"/>
@@ -161,7 +161,7 @@ import Markdown from '@/components/Markdown.vue'
 import {
   getMutationShortDesc,
   getMutationExtendedDesc,
-  mutationStatus
+  mutationStatus,
 } from '@/utils/aotf'
 import { mdiClose, mdiOpenInNew } from '@mdi/js'
 import { useDynamicVuetifyDefaults } from '@/plugins/vuetify'
@@ -177,7 +177,7 @@ export default {
   components: {
     EditRuntimeForm,
     FormGenerator,
-    Markdown
+    Markdown,
   },
 
   emits: [
@@ -256,8 +256,8 @@ export default {
       },
       set (val) {
         if (!val) this.warningMsg = null
-      }
-    }
+      },
+    },
   },
 
   methods: {
@@ -296,8 +296,8 @@ export default {
       this.$router.push({
         name: 'Workspace',
         params: {
-          workflowName: this.cylcObject.tokens.workflow
-        }
+          workflowName: this.cylcObject.tokens.workflow,
+        },
       }).then(() => {
         // open the command editor in a new tab
         // (re-initialises this component preserving state)
@@ -324,7 +324,7 @@ export default {
   icons: {
     close: mdiClose,
     mdiOpenInNew,
-  }
+  },
 }
 </script>
 
diff --git a/src/components/cylc/SVGTask.vue b/src/components/cylc/SVGTask.vue
index 6581b9375..c01e787b3 100644
--- a/src/components/cylc/SVGTask.vue
+++ b/src/components/cylc/SVGTask.vue
@@ -230,7 +230,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
         Circular arrow representing a retry.
       -->
-       <g class="retry">
+      <g class="retry">
         <!-- An arc describing the arrow -->
         <path d="m25, 50 a30 30 1 1 1 25 30 "/>
         <!-- The arrowhead -->
@@ -266,7 +266,7 @@ import TaskState from '@/model/TaskState.model'
 
 const props = defineProps({
   task: {
-    required: true
+    required: true,
   },
   startTime: {
     // The start time as an ISO8601 date-time string in expanded format
@@ -274,12 +274,12 @@ const props = defineProps({
     // TODO: aim to remove this in due course
     // (we should be able to obtain this directly from the task)
     type: String,
-    required: false
+    required: false,
   },
   modifierSize: {
     // Scale the size of the task state modifier
     type: Number,
-    default: 0.7
+    default: 0.7,
   },
 })
 
diff --git a/src/components/cylc/Task.vue b/src/components/cylc/Task.vue
index 02436e886..25428dd20 100644
--- a/src/components/cylc/Task.vue
+++ b/src/components/cylc/Task.vue
@@ -39,19 +39,19 @@ export default {
   name: 'Task',
   props: {
     task: {
-      required: true
+      required: true,
     },
     startTime: {
-      required: false
+      required: false,
     },
     modifierSize: {
       // Scale the size of the task state modifier
       type: Number,
-      default: 0.7
+      default: 0.7,
     },
   },
   components: {
-    SVGTask
+    SVGTask,
   },
 }
 </script>
diff --git a/src/components/cylc/TaskStateBadge.vue b/src/components/cylc/TaskStateBadge.vue
index 770fb35a3..73d946499 100644
--- a/src/components/cylc/TaskStateBadge.vue
+++ b/src/components/cylc/TaskStateBadge.vue
@@ -43,7 +43,7 @@ import { computed } from 'vue'
 const props = defineProps({
   state: {
     type: String,
-    required: true
+    required: true,
   },
   value: {
     type: Number,
diff --git a/src/components/cylc/Toolbar.vue b/src/components/cylc/Toolbar.vue
index 92e79d127..5ff01b8bb 100644
--- a/src/components/cylc/Toolbar.vue
+++ b/src/components/cylc/Toolbar.vue
@@ -47,7 +47,7 @@ component. Note: this is not used for the workflow view, see
 import { mapState } from 'vuex'
 import { useDrawer, toolbarHeight } from '@/utils/toolbar'
 import {
-  mdiViewList
+  mdiViewList,
 } from '@mdi/js'
 
 export default {
@@ -57,7 +57,7 @@ export default {
   },
 
   computed: {
-    ...mapState('app', ['title'])
+    ...mapState('app', ['title']),
   },
 
   icons: {
diff --git a/src/components/cylc/ViewToolbar.vue b/src/components/cylc/ViewToolbar.vue
index faf7f7c13..dcd67ccdc 100644
--- a/src/components/cylc/ViewToolbar.vue
+++ b/src/components/cylc/ViewToolbar.vue
@@ -119,11 +119,11 @@ export default {
   name: 'ViewToolbar',
 
   emits: [
-    'setOption'
+    'setOption',
   ],
 
   components: {
-    Task
+    Task,
   },
 
   icons: {
@@ -192,7 +192,7 @@ export default {
     size: {
       type: String,
       default: 'default',
-    }
+    },
   },
 
   computed: {
@@ -210,7 +210,7 @@ export default {
       for (const group of this.groups) {
         iGroup = {
           ...group,
-          iControls: []
+          iControls: [],
         }
         for (const control of group.controls) {
           callback = null
@@ -273,7 +273,7 @@ export default {
             action,
             props,
             callback,
-            disabled
+            disabled,
           }
           iGroup.iControls.push(iControl)
         }
@@ -283,7 +283,7 @@ export default {
     },
     btnProps () {
       return btnProps(this.size)
-    }
+    },
   },
 
   methods: {
@@ -344,8 +344,8 @@ export default {
         return value.length
       }
       return value
-    }
-  }
+    },
+  },
 }
 </script>
 
diff --git a/src/components/cylc/WarningIcon.vue b/src/components/cylc/WarningIcon.vue
index ef06b6013..20c069e84 100644
--- a/src/components/cylc/WarningIcon.vue
+++ b/src/components/cylc/WarningIcon.vue
@@ -94,7 +94,7 @@ const PATH = pathJoin([
   ['L', x2 - sw, y1 + hsw],
   ['L', ((x2 - x1) / 2) + x1, y2 - sw],
   ['L', x1 + sw, y1 + hsw],
-  ['Z', '', '']
+  ['Z', '', ''],
 ])
 
 function nodeJoin (item) {
@@ -120,7 +120,7 @@ export default {
   props: {
     workflow: {
       required: true,
-    }
+    },
   },
 
   methods: {
diff --git a/src/components/cylc/analysis/AnalysisTable.vue b/src/components/cylc/analysis/AnalysisTable.vue
index 21d99775c..4d1fb8d10 100644
--- a/src/components/cylc/analysis/AnalysisTable.vue
+++ b/src/components/cylc/analysis/AnalysisTable.vue
@@ -60,7 +60,7 @@ import { formatDuration } from '@/utils/tasks'
 import {
   initialOptions,
   updateInitialOptionsEvent,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 
 export default {
@@ -71,11 +71,11 @@ export default {
   props: {
     tasks: {
       type: Array,
-      required: true
+      required: true,
     },
     timingOption: {
       type: String,
-      required: true
+      required: true,
     },
     initialOptions,
   },
@@ -102,7 +102,7 @@ export default {
     return {
       itemsPerPage,
       sortBy,
-      page
+      page,
     }
   },
 
@@ -111,17 +111,17 @@ export default {
       headers: [
         {
           title: 'Task',
-          key: 'name'
+          key: 'name',
         },
         {
           title: 'Platform',
-          key: 'platform'
+          key: 'platform',
         },
         {
           title: 'Count',
-          key: 'count'
-        }
-      ]
+          key: 'count',
+        },
+      ],
     }
   },
 
@@ -133,47 +133,47 @@ export default {
           title: `Mean T-${times}`,
           key: `mean${times}Time`,
           formatter: formatDuration,
-          allowZeros: false
+          allowZeros: false,
         },
         {
           title: `Std Dev T-${times}`,
           key: `stdDev${times}Time`,
           formatter: formatDuration,
-          allowZeros: true
+          allowZeros: true,
         },
         {
           title: `Min T-${times}`,
           key: `min${times}Time`,
           formatter: formatDuration,
-          allowZeros: false
+          allowZeros: false,
         },
         {
           title: `Q1 T-${times}`,
           key: `${times.toLowerCase()}Quartiles.0`,
           formatter: formatDuration,
-          allowZeros: false
+          allowZeros: false,
         },
         {
           title: `Median T-${times}`,
           key: `${times.toLowerCase()}Quartiles.1`,
           formatter: formatDuration,
-          allowZeros: false
+          allowZeros: false,
         },
         {
           title: `Q3 T-${times}`,
           key: `${times.toLowerCase()}Quartiles.2`,
           formatter: formatDuration,
-          allowZeros: false
+          allowZeros: false,
         },
         {
           title: `Max T-${times}`,
           key: `max${times}Time`,
           formatter: formatDuration,
-          allowZeros: false
-        }
+          allowZeros: false,
+        },
       ]
       return this.headers.concat(timingHeaders)
-    }
+    },
   },
 
   methods: {
@@ -189,7 +189,7 @@ export default {
         return header.formatter(value, header)
       }
       return value
-    }
+    },
   },
 
   itemsPerPageOptions: [
@@ -198,7 +198,7 @@ export default {
     { value: 50, title: '50' },
     { value: 100, title: '100' },
     { value: 200, title: '200' },
-    { value: -1, title: 'All' }
+    { value: -1, title: 'All' },
   ],
 }
 </script>
diff --git a/src/components/cylc/analysis/BoxPlot.vue b/src/components/cylc/analysis/BoxPlot.vue
index 978c5ed49..24af53b7a 100644
--- a/src/components/cylc/analysis/BoxPlot.vue
+++ b/src/components/cylc/analysis/BoxPlot.vue
@@ -70,7 +70,7 @@ import { useReducedAnimation } from '@/composables/localStorage'
 import {
   initialOptions,
   updateInitialOptionsEvent,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 
 export default {
@@ -138,10 +138,10 @@ export default {
               toolbar: {
                 exportToSVG: 'Download SVG',
                 exportToPNG: 'Download PNG',
-                menu: 'Download'
-              }
-            }
-          }
+                menu: 'Download',
+              },
+            },
+          },
         ],
         animations: {
           enabled: reducedAnimation.value ? false : props.animate,
@@ -197,7 +197,7 @@ export default {
           text: `${upperFirst(props.timingOption)} time`,
         },
         labels: {
-          formatter: (value) => formatDuration(value, { allowZeros: true })
+          formatter: (value) => formatDuration(value, { allowZeros: true }),
         },
       },
     }))
@@ -253,7 +253,7 @@ export default {
     numPages () {
       // Clamp page number
       this.page = Math.min(this.numPages, this.page)
-    }
+    },
   },
 
   methods: {
diff --git a/src/components/cylc/analysis/TimeSeries.vue b/src/components/cylc/analysis/TimeSeries.vue
index 500588244..18aab1411 100644
--- a/src/components/cylc/analysis/TimeSeries.vue
+++ b/src/components/cylc/analysis/TimeSeries.vue
@@ -72,7 +72,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
       :height="450"
       width="95%"
       class="d-flex justify-center"
-          />
+    />
   </div>
   <div id="miniTimeSeries">
     <VueApexCharts
@@ -85,7 +85,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
       class="d-flex justify-center"
     />
   </div>
-  </template>
+</template>
 
 <script>
 import VueApexCharts from 'vue3-apexcharts'
@@ -95,7 +95,7 @@ import {
   pick,
   union,
   uniq,
-  upperFirst
+  upperFirst,
 } from 'lodash'
 import gql from 'graphql-tag'
 import { formatDuration } from '@/utils/tasks'
@@ -108,7 +108,7 @@ import DeltasCallback from '@/services/callbacks'
 import {
   initialOptions,
   updateInitialOptionsEvent,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 
 /** List of fields to request for task for each task */
@@ -120,7 +120,7 @@ const jobFields = [
   'totalTime',
   'queueTime',
   'runTime',
-  'startedTime'
+  'startedTime',
 ]
 
 /** The one-off query which retrieves historical job timing statistics */
@@ -224,7 +224,7 @@ export default {
     return {
       reducedAnimation,
       displayedTasks,
-      showOrigin
+      showOrigin,
     }
   },
 
@@ -253,7 +253,7 @@ export default {
       if (addedTasks.length > 0) {
         this.jobsQuery(newTasks)
       }
-    }
+    },
   },
 
   computed: {
@@ -275,7 +275,7 @@ export default {
         }
         seriesData[task] = {
           name: task,
-          data
+          data,
         }
       }
 
@@ -290,7 +290,7 @@ export default {
                 x: job.cyclePoint,
                 y: time,
                 platform: job.platform,
-                startedTime: job.startedTime
+                startedTime: job.startedTime,
               })
             }
           }
@@ -320,10 +320,10 @@ export default {
                   zoomIn: 'Zoom In',
                   zoomOut: 'Zoom Out',
                   pan: 'Panning',
-                  reset: 'Reset Zoom'
-                }
-              }
-            }
+                  reset: 'Reset Zoom',
+                },
+              },
+            },
           ],
           animations: {
             enabled: this.animate && !this.reducedAnimation,
@@ -348,18 +348,18 @@ export default {
               zoomin: false,
               zoomout: false,
               pan: false,
-              reset: true
-            }
+              reset: true,
+            },
           },
           zoom: {
-            type: 'y'
-          }
+            type: 'y',
+          },
         },
         stroke: {
-          width: 2
+          width: 2,
         },
         markers: {
-          size: 4
+          size: 4,
         },
         tooltip: {
           y: {
@@ -370,8 +370,8 @@ export default {
               const y = formatDuration(value, { allowZeros: true })
               const platform = this.series[seriesIndex].data[dataPointIndex].platform
               return `${y} (${platform})`
-            }
-          }
+            },
+          },
         },
         xaxis: {
           title: {
@@ -379,7 +379,7 @@ export default {
           },
           categories: this.cyclePoints,
           min: this.xRange[0],
-          max: this.xRange[1]
+          max: this.xRange[1],
         },
         yaxis: {
           forceNiceScale: true,
@@ -388,7 +388,7 @@ export default {
             text: upperFirst(this.timingOption) + ' time',
           },
           labels: {
-            formatter: (value) => formatDuration(value, { allowZeros: true })
+            formatter: (value) => formatDuration(value, { allowZeros: true }),
           },
         },
       }
@@ -415,31 +415,31 @@ export default {
             xaxis: {
               min: 1,
               max: this.cyclePoints.length,
-            }
+            },
           },
           toolbar: {
             autoSelected: 'selection',
-            show: true
-          }
+            show: true,
+          },
         },
         legend: {
-          show: false
+          show: false,
         },
         markers: {
-          size: 3
+          size: 3,
         },
         stroke: {
-          width: 2
+          width: 2,
         },
         tooltip: {
-          enabled: false
+          enabled: false,
         },
         xaxis: {
           categories: this.cyclePoints,
           tickAmount: 4,
           labels: {
-            rotate: 0
-          }
+            rotate: 0,
+          },
         },
         yaxis: {
           tickAmount: 3,
@@ -447,9 +447,9 @@ export default {
             text: upperFirst(this.timingOption) + ' time',
           },
           labels: {
-            formatter: (value) => formatDuration(value, { allowZeros: true })
+            formatter: (value) => formatDuration(value, { allowZeros: true }),
           },
-          min: this.showOrigin ? 0 : undefined
+          min: this.showOrigin ? 0 : undefined,
         },
       }
     },
@@ -498,7 +498,7 @@ export default {
     refreshData: function () {
       this.taskNamesQuery()
       this.jobsQuery(this.displayedTasks)
-    }
+    },
   },
 
   icons: {
diff --git a/src/components/cylc/commandMenu/Menu.vue b/src/components/cylc/commandMenu/Menu.vue
index b84a19721..30d736565 100644
--- a/src/components/cylc/commandMenu/Menu.vue
+++ b/src/components/cylc/commandMenu/Menu.vue
@@ -118,7 +118,7 @@ import { nextTick, ref } from 'vue'
 import {
   filterAssociations,
   getMutationArgsFromTokens,
-  mutate
+  mutate,
 } from '@/utils/aotf'
 import Mutation from '@/components/cylc/Mutation.vue'
 import {
@@ -285,8 +285,8 @@ export default {
         this.$router.push({
           name: 'Workspace',
           params: {
-            workflowName: this.node.tokens.workflow
-          }
+            workflowName: this.node.tokens.workflow,
+          },
         }).then(() => {
           eventBus.emit(
             'add-view',
@@ -295,7 +295,7 @@ export default {
               initialOptions: {
                 relativeID: this.node.tokens.relativeID || null,
                 file: getLogFileForNode(this.node),
-              }
+              },
             }
           )
         })
@@ -303,16 +303,16 @@ export default {
         this.$router.push({
           name: 'Workspace',
           params: {
-            workflowName: this.node.tokens.workflow
-          }
+            workflowName: this.node.tokens.workflow,
+          },
         }).then(() => {
           eventBus.emit(
             'add-view',
             {
               name: 'Info',
               initialOptions: {
-                requestedTokens: this.node.tokens || undefined
-              }
+                requestedTokens: this.node.tokens || undefined,
+              },
             }
           )
         })
@@ -358,7 +358,7 @@ export default {
       } else {
         this.callMutationFromContext(mutation)
       }
-    }
+    },
   },
 }
 </script>
diff --git a/src/components/cylc/commandMenu/plugin.js b/src/components/cylc/commandMenu/plugin.js
index 778fa01aa..eb12e716e 100644
--- a/src/components/cylc/commandMenu/plugin.js
+++ b/src/components/cylc/commandMenu/plugin.js
@@ -63,7 +63,7 @@ export default {
     app.directive('command-menu', {
       beforeMount: bind,
       unmounted: unbind,
-      updated
+      updated,
     })
-  }
+  },
 }
diff --git a/src/components/cylc/common/filter.js b/src/components/cylc/common/filter.js
index 8633ba1e4..32068224e 100644
--- a/src/components/cylc/common/filter.js
+++ b/src/components/cylc/common/filter.js
@@ -24,7 +24,7 @@ import {
   WaitingStateModifierNames,
 } from '@/model/TaskState.model'
 import {
-  escapeRegExp
+  escapeRegExp,
 } from 'lodash-es'
 
 /* Convert a glob to a Regex.
diff --git a/src/components/cylc/gantt/GanttChart.vue b/src/components/cylc/gantt/GanttChart.vue
index 6c20e1cf1..2f2132b9a 100644
--- a/src/components/cylc/gantt/GanttChart.vue
+++ b/src/components/cylc/gantt/GanttChart.vue
@@ -140,7 +140,7 @@ export default {
               x: job.name,
               y: [
                 new Date(job[start]).getTime(),
-                new Date(job[end]).getTime()
+                new Date(job[end]).getTime(),
               ],
               fillColor,
             }
@@ -176,10 +176,10 @@ export default {
                   zoomIn: 'Zoom In',
                   zoomOut: 'Zoom Out',
                   pan: 'Panning',
-                  reset: 'Reset Zoom'
-                }
-              }
-            }
+                  reset: 'Reset Zoom',
+                },
+              },
+            },
           ],
           animations: {
             enabled: this.animate && !this.reducedAnimation,
@@ -203,7 +203,7 @@ export default {
               zoomin: true,
               zoomout: true,
               pan: true,
-              reset: true
+              reset: true,
             },
           },
         },
@@ -235,7 +235,7 @@ export default {
           labels: {
             formatter: function (value, timestamp, opts) {
               return new Date(value).toUTCString().slice(17, -3)
-            }
+            },
           },
           title: {
             text: 'Time (UTC)',
diff --git a/src/components/cylc/gantt/filter.js b/src/components/cylc/gantt/filter.js
index 9bee2e821..5f497df0f 100644
--- a/src/components/cylc/gantt/filter.js
+++ b/src/components/cylc/gantt/filter.js
@@ -54,7 +54,7 @@ export function platformOptions (tasks) {
         platforms.push(jobs[i].platform)
         platformOptions.push({
           value: jobs[i].platform,
-          title: jobs[i].platform
+          title: jobs[i].platform,
         })
       }
     }
diff --git a/src/components/cylc/gscan/GScan.vue b/src/components/cylc/gscan/GScan.vue
index b03582376..fd4f77014 100644
--- a/src/components/cylc/gscan/GScan.vue
+++ b/src/components/cylc/gscan/GScan.vue
@@ -100,7 +100,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
           location: 'top',
           openDelay: 400,
           eager: false,
-        }
+        },
       }">
         <Tree
           :workflows="workflows"
@@ -138,18 +138,18 @@ export default {
 
   components: {
     Tree,
-    TaskFilterSelect
+    TaskFilterSelect,
   },
 
   props: {
     workflowTree: {
       type: Object,
-      required: true
+      required: true,
     },
     isLoading: {
       type: Boolean,
-      required: true
-    }
+      required: true,
+    },
   },
 
   data: () => ({
@@ -164,7 +164,7 @@ export default {
      */
     filters: {
       'workflow state': [],
-      'task state': []
+      'task state': [],
       // 'workflow host': [], // TODO: will it be in state totals?
       // 'cylc version': [] // TODO: will it be in state totals?
     },
@@ -228,7 +228,7 @@ export default {
   // Misc options
   icons: {
     mdiFilter,
-    mdiFolderRefresh
+    mdiFolderRefresh,
   },
   /**
    * Lists of all the possible workflow and task states
diff --git a/src/components/cylc/gscan/WorkflowIcon.vue b/src/components/cylc/gscan/WorkflowIcon.vue
index c8c1dbdfd..ff2dbf992 100644
--- a/src/components/cylc/gscan/WorkflowIcon.vue
+++ b/src/components/cylc/gscan/WorkflowIcon.vue
@@ -34,8 +34,8 @@ export default {
   props: {
     status: {
       required: true,
-      type: String
-    }
+      type: String,
+    },
   },
 
   methods: {
@@ -47,7 +47,7 @@ export default {
     getIcon () {
       const state = WorkflowState.enumValues.find(({ name }) => name === this.status)
       return state?.icon || mdiHelpCircle
-    }
-  }
+    },
+  },
 }
 </script>
diff --git a/src/components/cylc/gscan/sort.js b/src/components/cylc/gscan/sort.js
index 3e57daf73..a87888165 100644
--- a/src/components/cylc/gscan/sort.js
+++ b/src/components/cylc/gscan/sort.js
@@ -16,7 +16,7 @@
  */
 
 import {
-  sortedIndexBy
+  sortedIndexBy,
 } from '@/components/cylc/common/sort'
 import { WorkflowState, WorkflowStateOrder } from '@/model/WorkflowState.model'
 
@@ -108,7 +108,7 @@ export function flattenWorkflowParts (node) {
   } else if (node.children.length > 1) {
     return {
       ...node,
-      children: node.children.map((n) => flattenWorkflowParts(n))
+      children: node.children.map((n) => flattenWorkflowParts(n)),
     }
   }
 }
diff --git a/src/components/cylc/log/Log.vue b/src/components/cylc/log/Log.vue
index fb096c5ee..13085cb86 100644
--- a/src/components/cylc/log/Log.vue
+++ b/src/components/cylc/log/Log.vue
@@ -47,7 +47,7 @@ import { useTemplateRef, watch, onBeforeUnmount, nextTick } from 'vue'
 import { useScroll, useVModel, whenever } from '@vueuse/core'
 import { when } from '@/utils/reactivity'
 import {
-  mdiMouseMoveUp
+  mdiMouseMoveUp,
 } from '@mdi/js'
 
 export default {
@@ -56,31 +56,31 @@ export default {
   props: {
     placeholder: {
       type: String,
-      required: false
+      required: false,
     },
     timestamps: {
       type: Boolean,
       required: false,
-      default: true
+      default: true,
     },
     logs: {
       type: Array,
-      required: true
+      required: true,
     },
     wordWrap: {
       type: Boolean,
       required: false,
-      default: false
+      default: false,
     },
     autoScroll: {
       type: Boolean,
       required: false,
-      default: false
-    }
+      default: false,
+    },
   },
 
   emits: [
-    'update:autoScroll'
+    'update:autoScroll',
   ],
 
   setup (props, { emit }) {
@@ -136,7 +136,7 @@ export default {
     })
 
     return {
-      scrollToTop
+      scrollToTop,
     }
   },
 
@@ -164,13 +164,13 @@ export default {
     stripTimestamp (logLine) {
       const regex = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(?:Z|[+-][\d:]+)?\s(.*\s*)/
       return logLine.match(regex)?.[1] ?? logLine
-    }
+    },
   },
 
   // Misc options
   icons: {
-    mdiMouseMoveUp
-  }
+    mdiMouseMoveUp,
+  },
 }
 
 </script>
diff --git a/src/components/cylc/table/Table.vue b/src/components/cylc/table/Table.vue
index d4a3cb726..5d0cb390c 100644
--- a/src/components/cylc/table/Table.vue
+++ b/src/components/cylc/table/Table.vue
@@ -77,7 +77,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
         size="small"
         :style="{
           visibility: (item.task.children || []).length ? null : 'hidden',
-          transform: isExpanded(internalItem) ? 'rotate(180deg)' : null
+          transform: isExpanded(internalItem) ? 'rotate(180deg)' : null,
         }"
       >
         <v-icon
@@ -151,7 +151,7 @@ import { useCyclePointsOrderDesc } from '@/composables/localStorage'
 import {
   initialOptions as initialOptionsProp,
   updateInitialOptionsEvent,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 import FlowNumsChip from '@/components/cylc/common/FlowNumsChip.vue'
 import EstimatedTime from '@/components/cylc/common/EstimatedTime.vue'
@@ -161,7 +161,7 @@ const emit = defineEmits([updateInitialOptionsEvent])
 const props = defineProps({
   tasks: {
     type: Array,
-    required: true
+    required: true,
   },
   initialOptions: initialOptionsProp,
 })
@@ -174,7 +174,7 @@ const sortBy = useInitialOptions(
   [
     {
       key: 'task.tokens.cycle',
-      order: cyclePointsOrderDesc.value ? 'desc' : 'asc'
+      order: cyclePointsOrderDesc.value ? 'desc' : 'asc',
     },
   ]
 )
@@ -285,7 +285,7 @@ const taskRunTimes = computed(() => new Map(
     {
       actual: getRunTime(latestJob?.node),
       estimate: task.node?.task?.meanElapsedTime,
-    }
+    },
   ])
 ))
 
diff --git a/src/components/cylc/tree/GScanTreeItem.vue b/src/components/cylc/tree/GScanTreeItem.vue
index 3aac13fa3..9681ed060 100644
--- a/src/components/cylc/tree/GScanTreeItem.vue
+++ b/src/components/cylc/tree/GScanTreeItem.vue
@@ -168,11 +168,11 @@ const compactMode = useCompactMode()
 const props = defineProps({
   node: {
     type: Object,
-    required: true
+    required: true,
   },
   depth: {
     type: Number,
-    default: 0
+    default: 0,
   },
   filteredOutNodesCache: {
     type: WeakMap,
diff --git a/src/components/cylc/tree/JobLeaf.vue b/src/components/cylc/tree/JobLeaf.vue
index e2efa6d8d..07d09d6bf 100644
--- a/src/components/cylc/tree/JobLeaf.vue
+++ b/src/components/cylc/tree/JobLeaf.vue
@@ -74,8 +74,8 @@ const props = defineProps({
   },
   density: {
     type: String,
-    default: 'compact'
-  }
+    default: 'compact',
+  },
 })
 
 /** Make the job details triangle point to the job icon */
@@ -87,7 +87,7 @@ const defaults = computed(() => ({
   VTable: {
     density: props.density,
     hover: true,
-  }
+  },
 }))
 
 const customOutputs = computed(() => jobMessageOutputs(props.node))
diff --git a/src/components/cylc/tree/Tree.vue b/src/components/cylc/tree/Tree.vue
index 32eca5cae..0a1157200 100644
--- a/src/components/cylc/tree/Tree.vue
+++ b/src/components/cylc/tree/Tree.vue
@@ -40,7 +40,7 @@ export default {
   props: {
     workflows: {
       type: Array,
-      required: true
+      required: true,
     },
     treeItemComponent: {
       type: String,
@@ -66,7 +66,7 @@ export default {
     /** List of node types to manually expand. */
     expandAll: {
       type: Array,
-      default: null
+      default: null,
     },
     autoStripTypes: {
       // If there is only one child of the root node and its type is listed in
@@ -77,13 +77,13 @@ export default {
       // root nodes.
       type: Array,
       required: false,
-      default: () => []
+      default: () => [],
     },
     flat: {
       type: Boolean,
       required: false,
       default: true,
-    }
+    },
   },
 
   components: {
diff --git a/src/components/cylc/tree/TreeItem.vue b/src/components/cylc/tree/TreeItem.vue
index 7f2c90f7b..c2b8bd626 100644
--- a/src/components/cylc/tree/TreeItem.vue
+++ b/src/components/cylc/tree/TreeItem.vue
@@ -54,7 +54,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
               v-if="node.familyTree?.length"
               :key="node.id"
               :task="node.familyTree[0].node"
-          />
+            />
             <span class="mx-1">{{ node.name }}</span>
           </template>
           <template v-else-if="node.type === 'family'">
@@ -113,7 +113,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
             >
               <v-defaults-provider
                 :defaults="{
-                  VChip: { size: 'small', density: 'comfortable', class: 'ml-2' }
+                  VChip: { size: 'small', density: 'comfortable', class: 'ml-2' },
                 }"
               >
                 <v-chip
@@ -199,11 +199,11 @@ export default {
   props: {
     node: {
       type: Object,
-      required: true
+      required: true,
     },
     depth: {
       type: Number,
-      default: 0
+      default: 0,
     },
     renderExpandCollapseBtn: {
       type: Boolean,
@@ -212,14 +212,14 @@ export default {
     cyclePointsOrderDesc: {
       type: Boolean,
       required: false,
-      default: true
+      default: true,
     },
     hoverable: Boolean,
     /** Render expanded initially if node is one of these types. */
     autoExpandTypes: {
       type: Array,
       required: false,
-      default: () => ['workflow', 'cycle', 'family']
+      default: () => ['workflow', 'cycle', 'family'],
     },
     /** When this changes, will expand if node is one of these types, otherwise collapse. */
     expandAll: {
@@ -275,13 +275,13 @@ export default {
     },
     nodeStyle () {
       return {
-        'padding-left': getIndent(this.depth)
+        'padding-left': getIndent(this.depth),
       }
     },
     nodeClass () {
       return {
         'node--hoverable': this.hoverable,
-        expanded: this.isExpanded
+        expanded: this.isExpanded,
       }
     },
     nodeDataClass () {
@@ -290,7 +290,7 @@ export default {
     expandCollapseBtnStyle () {
       return {
         // set visibility 'hidden' to ensure element takes up space
-        visibility: this.hasChildren ? null : 'hidden'
+        visibility: this.hasChildren ? null : 'hidden',
       }
     },
     jobMessageOutputs () {
@@ -305,7 +305,7 @@ export default {
       } else if (nodeTypes?.length === 0) {
         this.isExpanded = false // manually collapsed
       }
-    }
+    },
   },
 
   icons: {
diff --git a/src/components/cylc/workspace/Lumino.vue b/src/components/cylc/workspace/Lumino.vue
index 7a029b5b8..236d61484 100644
--- a/src/components/cylc/workspace/Lumino.vue
+++ b/src/components/cylc/workspace/Lumino.vue
@@ -72,7 +72,7 @@ import '@lumino/default-theme/style'
 const props = defineProps({
   workflowName: {
     type: String,
-    required: true
+    required: true,
   },
   /**
    * All possible view component classes that can be rendered
@@ -81,12 +81,12 @@ const props = defineProps({
    */
   allViews: {
     type: Map,
-    required: true
+    required: true,
   },
 })
 
 const emit = defineEmits([
-  'emptied'
+  'emptied',
 ])
 
 /**
diff --git a/src/components/cylc/workspace/Toolbar.vue b/src/components/cylc/workspace/Toolbar.vue
index d40437314..ff93197c5 100644
--- a/src/components/cylc/workspace/Toolbar.vue
+++ b/src/components/cylc/workspace/Toolbar.vue
@@ -273,7 +273,7 @@ import { useDrawer, useNavBtn, toolbarHeight } from '@/utils/toolbar'
 import WorkflowState from '@/model/WorkflowState.model'
 import graphql from '@/mixins/graphql'
 import {
-  mutationStatus
+  mutationStatus,
 } from '@/utils/aotf'
 import subscriptionComponentMixin from '@/mixins/subscriptionComponent'
 import SubscriptionQuery from '@/model/SubscriptionQuery.model'
@@ -363,7 +363,7 @@ export default {
 
   mixins: [
     graphql,
-    subscriptionComponentMixin
+    subscriptionComponentMixin,
   ],
 
   props: {
@@ -374,8 +374,8 @@ export default {
      */
     views: {
       type: Map,
-      required: true
-    }
+      required: true,
+    },
   },
 
   data: () => ({
@@ -383,7 +383,7 @@ export default {
       // store state from mutations in order to compute the "enabled" attrs
       play: null,
       paused: null,
-      stop: null
+      stop: null,
     },
     changingNWindow: false,
   }),
@@ -473,7 +473,7 @@ export default {
             this.expecting.stop === null ||
             this.expecting.stop === this.isStopped
           )
-        )
+        ),
       }
     },
     nWindow: {
@@ -490,7 +490,7 @@ export default {
         }
         this.changingNWindow = false
       },
-    }
+    },
   },
 
   watch: {
diff --git a/src/components/graphqlFormGenerator/EditRuntimeForm.vue b/src/components/graphqlFormGenerator/EditRuntimeForm.vue
index f7cf925fd..9fc86aea9 100644
--- a/src/components/graphqlFormGenerator/EditRuntimeForm.vue
+++ b/src/components/graphqlFormGenerator/EditRuntimeForm.vue
@@ -65,7 +65,7 @@ const NamedTypes = {
     is: VTextarea,
     rows: '1',
     autoGrow: true,
-    style: 'font-family: monospace;'
+    style: 'font-family: monospace;',
   },
   TaskRunMode: {
     is: GEnum,
@@ -81,23 +81,23 @@ export default {
     modelValue: {
       // validity of form
       type: Boolean,
-      default: () => false
+      default: () => false,
     },
     cylcObject: {
       // data store node
       type: Object,
-      required: true
+      required: true,
     },
     types: {
       // introspection types
       type: Array,
-      required: true
+      required: true,
     },
     data: {
       type: Object,
       required: false,
       default: () => { return {} }, // for ease of testing
-    }
+    },
   },
 
   emits: ['update:modelValue'],
@@ -135,8 +135,8 @@ export default {
       set (value) {
         // Update 'value' prop by notifying parent component's v-model for this component
         this.$emit('update:modelValue', value)
-      }
-    }
+      },
+    },
   },
 
   methods: {
@@ -178,7 +178,7 @@ export default {
       if (!settings.length) {
         return {
           message: 'No changes were made',
-          status: mutationStatus.WARN
+          status: mutationStatus.WARN,
         }
       }
       const args = {
@@ -187,7 +187,7 @@ export default {
         mode: 'Set',
         namespaces: [this.tokens.task],
         settings,
-        workflows: [this.tokens.workflowID]
+        workflows: [this.tokens.workflowID],
       }
       const mutation = await this.$workflowService.getMutation('broadcast')
       return await mutate(
@@ -221,7 +221,7 @@ export default {
               )) {
                 // Convert { key: x, value: y } to { x: y }
                 ret.push({
-                  [field]: { [obj.key]: obj.value }
+                  [field]: { [obj.key]: obj.value },
                 })
               }
             }
@@ -244,11 +244,11 @@ export default {
       const gqlType = findByName(this.type.fields, fieldName).type
       return {
         gqlType,
-        ...getComponentProps(gqlType, NamedTypes, VuetifyConfig.kinds)
+        ...getComponentProps(gqlType, NamedTypes, VuetifyConfig.kinds),
       }
     },
 
-    startCase
-  }
+    startCase,
+  },
 }
 </script>
diff --git a/src/components/graphqlFormGenerator/FormGenerator.vue b/src/components/graphqlFormGenerator/FormGenerator.vue
index 51a49a21b..5e17d2966 100644
--- a/src/components/graphqlFormGenerator/FormGenerator.vue
+++ b/src/components/graphqlFormGenerator/FormGenerator.vue
@@ -26,29 +26,29 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
         v-for="input in inputs"
         v-bind:key="input.label"
       >
-          <v-list-item-title class="d-flex align-center mb-2">
-            <!-- input label - the display title for this input -->
-            {{ upperFirst(lowerCase(input.label)) }}
-            <!-- help button - tooltip for more information -->
-            <v-tooltip
-              v-if="input.description"
-              :activator="null"
-            >
-              <template v-slot:activator="{ props }">
-                <v-icon v-bind="props" class="mx-2">
-                  {{ $options.icons.mdiHelpCircleOutline }}
-                </v-icon>
-              </template>
-              <Markdown
-                :markdown="input.description"
-              />
-            </v-tooltip>
-          </v-list-item-title>
-          <FormInput
-            v-model="model[input.label]"
-            :gqlType="input.gqlType"
-            :types="types"
-          />
+        <v-list-item-title class="d-flex align-center mb-2">
+          <!-- input label - the display title for this input -->
+          {{ upperFirst(lowerCase(input.label)) }}
+          <!-- help button - tooltip for more information -->
+          <v-tooltip
+            v-if="input.description"
+            :activator="null"
+          >
+            <template v-slot:activator="{ props }">
+              <v-icon v-bind="props" class="mx-2">
+                {{ $options.icons.mdiHelpCircleOutline }}
+              </v-icon>
+            </template>
+            <Markdown
+              :markdown="input.description"
+            />
+          </v-tooltip>
+        </v-list-item-title>
+        <FormInput
+          v-model="model[input.label]"
+          :gqlType="input.gqlType"
+          :types="types"
+        />
       </v-list-item>
     </v-list>
   </v-form>
@@ -68,7 +68,7 @@ export default {
 
   components: {
     Markdown,
-    FormInput
+    FormInput,
   },
 
   props: {
@@ -76,19 +76,19 @@ export default {
     modelValue: {
       type: Boolean,
       required: false,
-      default: () => false
+      default: () => false,
     },
 
     // the mutation we are operating on
     mutation: {
       type: Object,
-      required: true
+      required: true,
     },
 
     // list of GraphQL types extracted from the introspection query
     types: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
 
     // the live state of the form
@@ -126,7 +126,7 @@ export default {
         ret.push({
           gqlType: arg.type,
           label: arg.name,
-          description: arg.description
+          description: arg.description,
         })
       }
       return ret
@@ -138,8 +138,8 @@ export default {
       set (value) {
         // Update 'value' prop by notifying parent component's v-model for this component
         this.$emit('update:modelValue', value)
-      }
-    }
+      },
+    },
   },
 
   methods: {
diff --git a/src/components/graphqlFormGenerator/FormInput.vue b/src/components/graphqlFormGenerator/FormInput.vue
index f01d0f86c..0e64238a1 100644
--- a/src/components/graphqlFormGenerator/FormInput.vue
+++ b/src/components/graphqlFormGenerator/FormInput.vue
@@ -45,12 +45,12 @@ export const renderHelpIcon = (helpText) => h(
       {
         ...props,
         style: {
-          cursor: 'default'
-        }
+          cursor: 'default',
+        },
       },
       () => mdiHelpCircleOutline
     ),
-    default: () => h(Markdown, { markdown: helpText })
+    default: () => h(Markdown, { markdown: helpText }),
   }
 )
 
@@ -64,7 +64,7 @@ export default {
   mixins: [formElement],
 
   components: {
-    Markdown
+    Markdown,
   },
 
   directives: {
@@ -74,15 +74,15 @@ export default {
       if (binding.value) {
         mask(el, binding)
       }
-    }
+    },
   },
 
   props: {
     // dictionary of props for overriding default values
     propOverrides: {
       type: Object,
-      default: () => { Object() }
-    }
+      default: () => { Object() },
+    },
   },
 
   beforeCreate () {
@@ -97,7 +97,7 @@ export default {
     // merge this in with default and override props
     const propGroups = [
       componentProps,
-      this.propOverrides || {}
+      this.propOverrides || {},
     ]
     // rules is a list so needs special treatment
     const rules = propGroups.flatMap(({ rules }) => rules ?? [])
@@ -118,15 +118,15 @@ export default {
           this.model = value
         },
         gqlType: this.gqlType,
-        types: this.types
+        types: this.types,
       },
       {
         'append-inner': this.help ? () => renderHelpIcon(this.help) : null,
         // pass the "append" slot onto the child component
-        append: (slotProps) => this.$slots.append?.(slotProps)
+        append: (slotProps) => this.$slots.append?.(slotProps),
       }
     )
-  }
+  },
 
 }
 </script>
diff --git a/src/components/graphqlFormGenerator/components/BroadcastSetting.vue b/src/components/graphqlFormGenerator/components/BroadcastSetting.vue
index b0c861605..5a45feee8 100644
--- a/src/components/graphqlFormGenerator/components/BroadcastSetting.vue
+++ b/src/components/graphqlFormGenerator/components/BroadcastSetting.vue
@@ -30,7 +30,7 @@ export default {
   inheritAttrs: false,
 
   data: () => ({
-    localValue: null
+    localValue: null,
   }),
 
   methods: {
@@ -108,7 +108,7 @@ export default {
       return nonNullOutcome === true
         ? (this.modelValue != null) || 'Invalid'
         : nonNullOutcome
-    }
+    },
   },
 
   render () {
@@ -121,14 +121,14 @@ export default {
           this.localValue = val
           this.$emit('update:modelValue', this.fromString(val))
         },
-        rules: [this.isValid]
+        rules: [this.isValid],
       },
       {
         'append-inner': () => renderHelpIcon(this.help),
         // pass the "append" slot onto the VTextField component
-        append: (slotProps) => this.$slots.append?.(slotProps)
+        append: (slotProps) => this.$slots.append?.(slotProps),
       }
     )
-  }
+  },
 }
 </script>
diff --git a/src/components/graphqlFormGenerator/components/Enum.vue b/src/components/graphqlFormGenerator/components/Enum.vue
index 304b2addb..43ca28c39 100644
--- a/src/components/graphqlFormGenerator/components/Enum.vue
+++ b/src/components/graphqlFormGenerator/components/Enum.vue
@@ -57,6 +57,6 @@ export default {
         ({ name }) => name === this.modelValue
       )?.description ?? ''
     },
-  }
+  },
 }
 </script>
diff --git a/src/components/graphqlFormGenerator/components/List.vue b/src/components/graphqlFormGenerator/components/List.vue
index 8167ee359..594496c8f 100644
--- a/src/components/graphqlFormGenerator/components/List.vue
+++ b/src/components/graphqlFormGenerator/components/List.vue
@@ -66,14 +66,14 @@ export default {
   name: 'g-list',
 
   mixins: [
-    formElement
+    formElement,
   ],
 
   props: {
     addAtStart: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
   },
 
   inheritAttrs: false,
@@ -102,7 +102,7 @@ export default {
     /** Remove the item at `index` from the list. */
     remove (index) {
       this.modelValue.splice(index, 1)
-    }
+    },
   },
 
   icons: {
diff --git a/src/components/graphqlFormGenerator/components/MapItem.vue b/src/components/graphqlFormGenerator/components/MapItem.vue
index e83dbd2f5..85e5788b7 100644
--- a/src/components/graphqlFormGenerator/components/MapItem.vue
+++ b/src/components/graphqlFormGenerator/components/MapItem.vue
@@ -68,7 +68,7 @@ export default {
   name: 'g-map-item',
 
   mixins: [
-    formElement
+    formElement,
   ],
 
   inheritAttrs: false,
@@ -78,13 +78,13 @@ export default {
       return {
         location: 'top',
         disabled: !this.modelValue.frozenKey,
-        openDelay: 400
+        openDelay: 400,
       }
-    }
+    },
   },
 
   textFieldProps: {
-    hideDetails: true
-  }
+    hideDetails: true,
+  },
 }
 </script>
diff --git a/src/components/graphqlFormGenerator/components/NonNull.vue b/src/components/graphqlFormGenerator/components/NonNull.vue
index a087389be..205989d38 100644
--- a/src/components/graphqlFormGenerator/components/NonNull.vue
+++ b/src/components/graphqlFormGenerator/components/NonNull.vue
@@ -40,6 +40,6 @@ export default {
 
   mixins: [formElement],
 
-  nonNullRule
+  nonNullRule,
 }
 </script>
diff --git a/src/components/graphqlFormGenerator/components/Object.vue b/src/components/graphqlFormGenerator/components/Object.vue
index ce56f040c..6bc408840 100644
--- a/src/components/graphqlFormGenerator/components/Object.vue
+++ b/src/components/graphqlFormGenerator/components/Object.vue
@@ -19,11 +19,11 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
   <v-input>
     <template>
       <FormInput
-       v-for="input in inputs"
-       v-bind:key="input.label"
-       v-model="model[input.label]"
-       :gqlType="input.gqlType"
-       :types="types"
+        v-for="input in inputs"
+        v-bind:key="input.label"
+        v-model="model[input.label]"
+        :gqlType="input.gqlType"
+        :types="types"
       />
     </template>
     <template v-slot:append>
@@ -45,9 +45,9 @@ export default {
     inputs () {
       return this.type.fields.map(field => ({
         gqlType: field.type,
-        label: field.name
+        label: field.name,
       }))
-    }
-  }
+    },
+  },
 }
 </script>
diff --git a/src/components/graphqlFormGenerator/components/vuetify.js b/src/components/graphqlFormGenerator/components/vuetify.js
index a4514638a..684ce32f8 100644
--- a/src/components/graphqlFormGenerator/components/vuetify.js
+++ b/src/components/graphqlFormGenerator/components/vuetify.js
@@ -30,8 +30,8 @@ const NumberFieldProps = {
   is: VTextField,
   type: 'number',
   modelModifiers: {
-    number: true
-  }
+    number: true,
+  },
 }
 
 export const RE = {
@@ -51,7 +51,7 @@ export const RULES = {
   taskID:
     (x) => Boolean(!x || x.match(/^(.){1,}\/(.){1,}$/)) || 'Invalid',
   flow:
-    (x) => Boolean(!x || x.match(/(^\d+$|^(all|new|none)$)/)) || 'Invalid'
+    (x) => Boolean(!x || x.match(/(^\d+$|^(all|new|none)$)/)) || 'Invalid',
 }
 
 export const RUNTIME_SETTING = 'RuntimeSetting'
@@ -63,7 +63,7 @@ export const inputDefaults = Object.fromEntries(
     {
       variant: 'filled',
       hideDetails: false,
-    }
+    },
   ])
 )
 
@@ -74,21 +74,21 @@ export default {
     //
     // * GraphQL types *
     String: {
-      is: VTextField
+      is: VTextField,
     },
     Int: {
       ...NumberFieldProps,
       rules: [
-        RULES.integer
-      ]
+        RULES.integer,
+      ],
     },
     Float: {
-      ...NumberFieldProps
+      ...NumberFieldProps,
     },
     Boolean: {
       is: VSwitch,
       color: 'primary',
-      class: 'mx-3'
+      class: 'mx-3',
     },
 
     // * Cylc types *
@@ -96,113 +96,113 @@ export default {
     WorkflowID: {
       is: VTextField,
       rules: [
-        RULES.noSpaces
-      ]
+        RULES.noSpaces,
+      ],
     },
     User: {
       is: VTextField,
       rules: [
-        RULES.noSpaces
-      ]
+        RULES.noSpaces,
+      ],
     },
     CyclePoint: {
       is: VTextField,
       rules: [
         RULES.noSpaces,
         // character whitelist
-        x => Boolean(!x || x.match(String.raw`^${RE.cyclePoint}$`)) || 'Invalid Cycle Point'
-      ]
+        x => Boolean(!x || x.match(String.raw`^${RE.cyclePoint}$`)) || 'Invalid Cycle Point',
+      ],
     },
     CyclePointGlob: {
       is: VTextField,
       rules: [
         RULES.noSpaces,
         // character whitelist
-        x => Boolean(!x || x.match(/^[\dT*]+$/)) || 'Invalid Cycle Point Glob'
-      ]
+        x => Boolean(!x || x.match(/^[\dT*]+$/)) || 'Invalid Cycle Point Glob',
+      ],
     },
     BroadcastSetting: {
-      is: GBroadcastSetting
+      is: GBroadcastSetting,
     },
     BroadcastCyclePoint: {
       is: VTextField,
       rules: [
-        x => Boolean(!x || x.match(String.raw`^(${RE.cyclePoint}|\*)$`)) || 'Must be "*" or a valid cycle point'
-      ]
+        x => Boolean(!x || x.match(String.raw`^(${RE.cyclePoint}|\*)$`)) || 'Must be "*" or a valid cycle point',
+      ],
     },
     // TaskStatus
     // TaskState
     TaskName: {
       is: VTextField,
       rules: [
-        RULES.noSpaces
-      ]
+        RULES.noSpaces,
+      ],
     },
     TaskID: {
       is: VTextField,
       placeholder: 'cycle/task',
       rules: [
         RULES.noSpaces,
-        RULES.taskID
-      ]
+        RULES.taskID,
+      ],
     },
     NamespaceName: {
       is: VTextField,
       rules: [
-        RULES.noSpaces
-      ]
+        RULES.noSpaces,
+      ],
     },
     NamespaceIDGlob: {
       is: VTextField,
       placeholder: 'cycle[/task][:status]',
       rules: [
-        RULES.noSpaces
-      ]
+        RULES.noSpaces,
+      ],
     },
     TimePoint: {
       is: VTextField,
       placeholder: 'yyyy-mm-ddThh:mm:ss',
       mask: '####-##-##T##:##:##',
       rules: [
-        x => Boolean(!x || x.match(/^\d{4}(-\d{2}(-\d{2}(T\d{2}(:\d{2}(:\d{2})?)?)?)?)?$/)) || 'Invalid'
-      ]
+        x => Boolean(!x || x.match(/^\d{4}(-\d{2}(-\d{2}(T\d{2}(:\d{2}(:\d{2})?)?)?)?)?$/)) || 'Invalid',
+      ],
     },
     RuntimeConfiguration: {
       is: VTextField,
       placeholder: '[section]setting',
       rules: [
-        RULES.cylcConfigItem
-      ]
+        RULES.cylcConfigItem,
+      ],
     },
     Flow: {
       is: VTextField,
       placeholder: 'flow number',
       rules: [
-        RULES.flow
-      ]
+        RULES.flow,
+      ],
     },
     [RUNTIME_SETTING]: {
-      is: GMapItem
-    }
+      is: GMapItem,
+    },
   },
 
   kinds: {
     // registry of GraphQL "kinds" (e.g. LIST)
     // { kind: (ofType) => ({ is: ComponentClass, prop1: value, ... }) }
     ENUM: (ofType) => ({
-      is: GEnum
+      is: GEnum,
     }),
     NON_NULL: (ofType) => ({
-      is: GNonNull
+      is: GNonNull,
     }),
     LIST: (ofType) => ({
       is: GList,
-      addAtStart: ofType?.name === RUNTIME_SETTING
+      addAtStart: ofType?.name === RUNTIME_SETTING,
     }),
     OBJECT: (ofType) => ({
-      is: GObject // happy naming coincidence
-    })
-  }
+      is: GObject, // happy naming coincidence
+    }),
+  },
 }
 
 export function getComponentProps (gqlType, namedTypes, kinds) {
diff --git a/src/components/graphqlFormGenerator/mixins.js b/src/components/graphqlFormGenerator/mixins.js
index 1249aae07..3cf908b6d 100644
--- a/src/components/graphqlFormGenerator/mixins.js
+++ b/src/components/graphqlFormGenerator/mixins.js
@@ -24,17 +24,17 @@ export const formElement = {
     // the GraphQL type this input represents
     gqlType: {
       type: Object,
-      required: true
+      required: true,
     },
     // array of all GraphQL types in the schema
     types: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     // the value (v-model is actually syntactic sugar for this)
     modelValue: {
-      required: true
-    }
+      required: true,
+    },
   },
 
   emits: ['update:modelValue'],
@@ -62,7 +62,7 @@ export const formElement = {
       },
       set (val) {
         this.$emit('update:modelValue', val)
-      }
+      },
     },
 
     type () {
@@ -80,6 +80,6 @@ export const formElement = {
         return this.type.description.trim()
       }
       return null
-    }
-  }
+    },
+  },
 }
diff --git a/src/graphql/graphiql.js b/src/graphql/graphiql.js
index 26916c0a0..90f72e166 100644
--- a/src/graphql/graphiql.js
+++ b/src/graphql/graphiql.js
@@ -76,7 +76,7 @@ const graphQLFetcher = function (subscriptionsClient, fallbackFetcher, component
           observer.next('Your subscription data will appear here after server publication!')
           const subscription = subscriptionsClient.request({
             query: graphQLParams.query,
-            variables: graphQLParams.variables
+            variables: graphQLParams.variables,
           }, function (error, result) {
             if (error) {
               observer.error(error)
@@ -92,7 +92,7 @@ const graphQLFetcher = function (subscriptionsClient, fallbackFetcher, component
             }
           })
           return component.subscription
-        }
+        },
       }
     } else {
       return fallbackFetcher(graphQLParams)
@@ -115,10 +115,10 @@ function fallbackGraphQLFetcher (graphQLParams) {
       headers: {
         Accept: 'application/json',
         'Content-Type': 'application/json',
-        ...getXSRFHeaders()
+        ...getXSRFHeaders(),
       },
       body: JSON.stringify(graphQLParams),
-      credentials: 'include'
+      credentials: 'include',
     }
   ).then(function (response) {
     return response.json().catch(function () {
@@ -129,5 +129,5 @@ function fallbackGraphQLFetcher (graphQLParams) {
 
 export {
   graphQLFetcher,
-  fallbackGraphQLFetcher
+  fallbackGraphQLFetcher,
 }
diff --git a/src/graphql/index.js b/src/graphql/index.js
index ab3591d0e..b4aea4cd0 100644
--- a/src/graphql/index.js
+++ b/src/graphql/index.js
@@ -21,7 +21,7 @@ import {
   ApolloLink,
   HttpLink,
   InMemoryCache,
-  split
+  split,
 } from '@apollo/client/core'
 import { getMainDefinition } from '@apollo/client/utilities'
 import { WebSocketLink } from '@apollo/client/link/ws'
@@ -42,7 +42,7 @@ export function createGraphQLUrls () {
   const wsUrl = createUrl('subscriptions', true)
   return {
     httpUrl,
-    wsUrl
+    wsUrl,
   }
 }
 
@@ -112,7 +112,7 @@ export function createSubscriptionClient (wsUrl, options = {}, wsImpl = null) {
  */
 export function createApolloClient (httpUrl, subscriptionClient) {
   const httpLink = new HttpLink({
-    uri: httpUrl
+    uri: httpUrl,
   })
 
   const wsLink = subscriptionClient !== null
@@ -133,8 +133,8 @@ export function createApolloClient (httpUrl, subscriptionClient) {
     return {
       headers: {
         ...headers,
-        ...getXSRFHeaders()
-      }
+        ...getXSRFHeaders(),
+      },
     }
   })
 
@@ -144,12 +144,12 @@ export function createApolloClient (httpUrl, subscriptionClient) {
     defaultOptions: {
       query: {
         fetchPolicy: 'no-cache',
-        errorPolicy: 'all'
+        errorPolicy: 'all',
       },
       watchQuery: {
         fetchPolicy: 'no-cache',
-        errorPolicy: 'all'
-      }
+        errorPolicy: 'all',
+      },
     },
     devtools: {
       enabled: import.meta.env.MODE !== 'production',
diff --git a/src/graphql/merge.js b/src/graphql/merge.js
index 016242333..9ebda6e65 100644
--- a/src/graphql/merge.js
+++ b/src/graphql/merge.js
@@ -68,7 +68,7 @@ function mergeQueries (queryA, queryB) {
   // Finally return the merged definitions and fragments (loc in the AST nodes is not important).
   queryA.definitions = [
     definition,
-    ...fragments
+    ...fragments,
   ]
   return queryA
 }
diff --git a/src/i18n/index.js b/src/i18n/index.js
index fa493e950..150a2c3c1 100644
--- a/src/i18n/index.js
+++ b/src/i18n/index.js
@@ -30,5 +30,5 @@ export const i18n = createI18n({
   legacy: false,
   locale: 'en-GB',
   fallbackLocale: 'en-GB',
-  messages
+  messages,
 })
diff --git a/src/layouts/Default.vue b/src/layouts/Default.vue
index 533be965e..08ad01c2d 100644
--- a/src/layouts/Default.vue
+++ b/src/layouts/Default.vue
@@ -88,19 +88,19 @@ export default {
     CommandMenu,
     Alert,
     Drawer,
-    Toolbar
+    Toolbar,
   },
 
   props: {
     showSidebar: {
       type: Boolean,
       required: false,
-      default: true
-    }
+      default: true,
+    },
   },
 
   computed: {
-    ...mapState(['offline'])
+    ...mapState(['offline']),
   },
 
   errorCaptured (error, vm, info) {
@@ -109,6 +109,6 @@ export default {
     }
     // Stop error propagating further:
     return false
-  }
+  },
 }
 </script>
diff --git a/src/layouts/Empty.vue b/src/layouts/Empty.vue
index 64f2dee0d..f53a1a49f 100644
--- a/src/layouts/Empty.vue
+++ b/src/layouts/Empty.vue
@@ -23,7 +23,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 <script>
 export default {
-  name: 'Empty'
+  name: 'Empty',
 }
 </script>
 
diff --git a/src/mixins/graphql.js b/src/mixins/graphql.js
index 26d208000..7be8b24e7 100644
--- a/src/mixins/graphql.js
+++ b/src/mixins/graphql.js
@@ -29,8 +29,8 @@ export default {
     /** This is set by vue-router */
     workflowName: {
       type: String,
-      required: true
-    }
+      required: true,
+    },
   },
   computed: {
     /**
@@ -57,8 +57,8 @@ export default {
      */
     variables () {
       return {
-        workflowId: this.workflowId
+        workflowId: this.workflowId,
       }
-    }
-  }
+    },
+  },
 }
diff --git a/src/mixins/subscription.js b/src/mixins/subscription.js
index 15a8872bc..7ca8451a5 100644
--- a/src/mixins/subscription.js
+++ b/src/mixins/subscription.js
@@ -31,7 +31,7 @@ import { mapActions } from 'vuex'
 export default {
   data () {
     return {
-      viewState: ViewState.NO_STATE
+      viewState: ViewState.NO_STATE,
     }
   },
   computed: {
@@ -39,9 +39,9 @@ export default {
       // Note: this.viewState is Proxy object so comparison
       // doesn't work without toRaw()
       return toRaw(this.viewState) === ViewState.LOADING
-    }
+    },
   },
   methods: {
-    ...mapActions(['setAlert'])
-  }
+    ...mapActions(['setAlert']),
+  },
 }
diff --git a/src/mixins/subscriptionComponent.js b/src/mixins/subscriptionComponent.js
index 876287e3a..4f51194dd 100644
--- a/src/mixins/subscriptionComponent.js
+++ b/src/mixins/subscriptionComponent.js
@@ -32,7 +32,7 @@ import { uniqueId } from 'lodash'
  */
 export default {
   mixins: [
-    subscriptionMixin
+    subscriptionMixin,
   ],
   beforeCreate () {
     // Uniquely identify this component/view so we can keep track of which
@@ -61,7 +61,7 @@ export default {
         this.$workflowService.subscribe(this)
         this.$workflowService.startSubscriptions()
       }
-    }
+    },
   },
   watch: {
     query: {
@@ -73,5 +73,5 @@ export default {
       // (this is needed to prevent subscription mismatches):
       flush: 'post',
     },
-  }
+  },
 }
diff --git a/src/model/TaskOutput.model.js b/src/model/TaskOutput.model.js
index e6fe99c7c..631cf5b02 100644
--- a/src/model/TaskOutput.model.js
+++ b/src/model/TaskOutput.model.js
@@ -48,7 +48,7 @@ export const TASK_OUTPUT_NAMES = [
   TaskOutput.SUCCEEDED.name,
   TaskOutput.SUBMIT_FAILED.name,
   TaskOutput.FAILED.name,
-  TaskOutput.EXPIRED.name
+  TaskOutput.EXPIRED.name,
 ]
 
 export default TaskOutput
diff --git a/src/model/TaskState.model.js b/src/model/TaskState.model.js
index 87614438e..03a77a958 100644
--- a/src/model/TaskState.model.js
+++ b/src/model/TaskState.model.js
@@ -53,7 +53,7 @@ export const TaskStateUserOrder = [
   TaskState.SUCCEEDED,
   TaskState.SUBMIT_FAILED,
   TaskState.FAILED,
-  TaskState.EXPIRED
+  TaskState.EXPIRED,
 ]
 
 export const TaskStateNames = TaskStateUserOrder.map(({ name }) => name)
diff --git a/src/model/WorkflowState.model.js b/src/model/WorkflowState.model.js
index daa22eb7b..68b11bbc9 100644
--- a/src/model/WorkflowState.model.js
+++ b/src/model/WorkflowState.model.js
@@ -21,7 +21,7 @@ import {
   mdiPauseCircle,
   mdiPlayCircle,
   mdiSkipNextCircle,
-  mdiStopCircle
+  mdiStopCircle,
 } from '@mdi/js'
 
 /**
@@ -56,7 +56,7 @@ export const WorkflowStateOrder = new Map([
   [WorkflowState.PAUSED.name, 1],
   [WorkflowState.STOPPING.name, 1],
   [WorkflowState.STOPPED.name, 2],
-  [undefined, 9]
+  [undefined, 9],
 ])
 
 /** @type {string[]} */
diff --git a/src/plugins/vuetify.js b/src/plugins/vuetify.js
index 3b4f8410e..55c9f1074 100644
--- a/src/plugins/vuetify.js
+++ b/src/plugins/vuetify.js
@@ -44,7 +44,7 @@ const inputDefaults = Object.fromEntries(
       variant: 'outlined',
       clearIcon: mdiClose,
       hideDetails: 'auto',
-    }
+    },
   ])
 )
 
@@ -61,20 +61,20 @@ export const vuetifyOptions = {
           primary: colors.lightBlue.accent4,
           'primary-darken-1': colors.lightBlue.darken4,
           secondary: colors.teal.accent4,
-          'secondary-darken-1': colors.teal.darken3
-        }
-      }
-    }
+          'secondary-darken-1': colors.teal.darken3,
+        },
+      },
+    },
   },
   display: {
-    mobileBreakpoint: 991
+    mobileBreakpoint: 991,
   },
   icons: {
     defaultSet: 'mdi',
     aliases,
     sets: {
-      mdi
-    }
+      mdi,
+    },
   },
   aliases: {
     VSelectActions: VCardActions,
@@ -88,9 +88,9 @@ export const vuetifyOptions = {
       slim: true,
     },
     VSelectActions: {
-      class: 'mt-n2'
+      class: 'mt-n2',
     },
-    ...inputDefaults
+    ...inputDefaults,
   },
 }
 
diff --git a/src/router/index.js b/src/router/index.js
index 8381a14cf..69e751b20 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -40,7 +40,7 @@ function getRoute (path) {
   return {
     ...path,
     name: path.name || path.view,
-    component: () => import(`@/views/${path.view}.vue`)
+    component: () => import(`@/views/${path.view}.vue`),
   }
 }
 
@@ -67,7 +67,7 @@ const router = createRouter({
       return { selector: to.hash }
     }
     return { left: 0, top: 0 }
-  }
+  },
 })
 
 router.beforeEach(async (to, from) => {
diff --git a/src/router/paths.js b/src/router/paths.js
index 8b70e8a83..f0a9a470a 100644
--- a/src/router/paths.js
+++ b/src/router/paths.js
@@ -33,16 +33,16 @@ export default [
     view: 'Dashboard',
     meta: {
       title: i18n.global.t('App.dashboard'),
-      layout: 'default'
-    }
+      layout: 'default',
+    },
   },
   {
     path: '/workflow-table',
     view: 'WorkflowsTable',
     meta: {
       title: 'Workflow Table',
-      layout: 'default'
-    }
+      layout: 'default',
+    },
   },
   {
     path: '/workspace/:workflowName(.*)',
@@ -50,41 +50,41 @@ export default [
     meta: {
       getTitle: workflowTitle,
       layout: 'default',
-      toolbar: true
+      toolbar: true,
     },
-    props: true
+    props: true,
   },
   {
     path: '/user-profile',
     view: 'UserProfile',
     meta: {
       title: i18n.global.t('App.userProfile'),
-      layout: 'default'
-    }
+      layout: 'default',
+    },
   },
   {
     path: '/guide',
     view: 'Guide',
     meta: {
       title: i18n.global.t('App.guide'),
-      layout: 'default'
-    }
+      layout: 'default',
+    },
   },
   {
     path: '/graphiql',
     view: 'GraphiQL',
     meta: {
       title: 'GraphiQL',
-      layout: 'empty'
-    }
+      layout: 'empty',
+    },
   },
   {
     path: '/:catchAll(.*)',
     view: 'NotFound',
     meta: {
       title: i18n.global.t('App.notFound'),
-      layout: 'empty'
-    }
+      layout: 'empty',
+    },
   },
 
   // the standalone views
@@ -95,8 +95,8 @@ export default [
       title: i18n.global.t('App.workflows'),
       layout: 'default',
       toolbar: false,
-      showSidebar: false
-    }
+      showSidebar: false,
+    },
   },
   {
     path: '/tree/:workflowName(.*)',
@@ -105,9 +105,9 @@ export default [
       getTitle: workflowTitle,
       layout: 'default',
       toolbar: true,
-      showSidebar: false
+      showSidebar: false,
     },
-    props: true
+    props: true,
   },
   {
     path: '/table/:workflowName(.*)',
@@ -116,9 +116,9 @@ export default [
       getTitle: workflowTitle,
       layout: 'default',
       toolbar: true,
-      showSidebar: false
+      showSidebar: false,
     },
-    props: true
+    props: true,
   },
   {
     path: '/graph/:workflowName(.*)',
@@ -127,9 +127,9 @@ export default [
       getTitle: workflowTitle,
       layout: 'default',
       toolbar: true,
-      showSidebar: false
+      showSidebar: false,
     },
-    props: true
+    props: true,
   },
   {
     path: '/log/:workflowName(.*)',
@@ -138,9 +138,9 @@ export default [
       getTitle: workflowTitle,
       layout: 'default',
       toolbar: true,
-      showSidebar: false
+      showSidebar: false,
     },
-    props: true
+    props: true,
   },
   {
     path: '/analysis/:workflowName(.*)',
@@ -149,9 +149,9 @@ export default [
       getTitle: workflowTitle,
       layout: 'default',
       toolbar: true,
-      showSidebar: false
+      showSidebar: false,
     },
-    props: true
+    props: true,
   },
   {
     path: '/gantt/:workflowName(.*)',
@@ -160,9 +160,9 @@ export default [
       getTitle: workflowTitle,
       layout: 'default',
       toolbar: true,
-      showSidebar: false
+      showSidebar: false,
     },
-    props: true
+    props: true,
   },
   {
     path: '/noAuth',
diff --git a/src/services/mock/.eslintrc.cjs b/src/services/mock/.eslintrc.cjs
index a40aaa8ca..0c567a861 100644
--- a/src/services/mock/.eslintrc.cjs
+++ b/src/services/mock/.eslintrc.cjs
@@ -1,5 +1,5 @@
 module.exports = {
   rules: {
-    'no-console': 'off'
-  }
+    'no-console': 'off',
+  },
 }
diff --git a/src/services/mock/graphql.cjs b/src/services/mock/graphql.cjs
index 17fc59797..f3a97f091 100644
--- a/src/services/mock/graphql.cjs
+++ b/src/services/mock/graphql.cjs
@@ -90,5 +90,5 @@ async function handleGraphQLRequest (request) {
 module.exports = {
   getOperationName,
   getGraphQLQueryResponse,
-  handleGraphQLRequest
+  handleGraphQLRequest,
 }
diff --git a/src/services/mock/json-server.cjs b/src/services/mock/json-server.cjs
index 26ad862df..0bbcae4c2 100644
--- a/src/services/mock/json-server.cjs
+++ b/src/services/mock/json-server.cjs
@@ -36,8 +36,8 @@ const middlewares = [
   ...jsonServer.defaults({ logger: false }),
   // Customize logger to hide successful XHR requests:
   logger('dev', {
-    skip: (req, res) => res.statusCode < 400
-  })
+    skip: (req, res) => res.statusCode < 400,
+  }),
 ]
 
 server.use(middlewares)
diff --git a/src/services/mock/json/index.cjs b/src/services/mock/json/index.cjs
index 15bb30871..a1a8d988c 100644
--- a/src/services/mock/json/index.cjs
+++ b/src/services/mock/json/index.cjs
@@ -39,5 +39,5 @@ module.exports = {
   analysisJobQuery: analysisQuery.jobQuery,
   analysisQuery,
   ganttQuery,
-  InfoViewSubscription
+  InfoViewSubscription,
 }
diff --git a/src/services/mock/json/logData.cjs b/src/services/mock/json/logData.cjs
index fdad6f213..730e7bb8f 100644
--- a/src/services/mock/json/logData.cjs
+++ b/src/services/mock/json/logData.cjs
@@ -25,7 +25,7 @@ const jobLogLines = [
   'two\n',
   'three\n',
   'four\n',
-  'five\n'
+  'five\n',
 ]
 
 const workflowLogLines = [
@@ -58,7 +58,7 @@ const LogData = async ({ id, file }) => {
         : undefined,
       path: `my-host:${path}`,
       lines: isJob ? jobLogLines : workflowLogLines,
-    }
+    },
   }
 }
 
diff --git a/src/services/mock/json/logFiles.cjs b/src/services/mock/json/logFiles.cjs
index 50ffbf799..e3cca5365 100644
--- a/src/services/mock/json/logFiles.cjs
+++ b/src/services/mock/json/logFiles.cjs
@@ -44,9 +44,9 @@ const LogFiles = async ({ id }) => {
       logFiles: {
         files: id == null
           ? []
-          : id.includes('//') ? jobLogFiles : workflowLogFiles
-      }
-    }
+          : id.includes('//') ? jobLogFiles : workflowLogFiles,
+      },
+    },
   }
 }
 
@@ -69,8 +69,8 @@ const Jobs = async ({ id, workflowId }) => {
   await simulatedDelay(500)
   return {
     data: {
-      jobs: node.state ? [{ id, ...node }] : []
-    }
+      jobs: node.state ? [{ id, ...node }] : [],
+    },
   }
 }
 
diff --git a/src/services/mock/websockets.cjs b/src/services/mock/websockets.cjs
index 1334d9b0d..2750b3542 100644
--- a/src/services/mock/websockets.cjs
+++ b/src/services/mock/websockets.cjs
@@ -29,12 +29,12 @@ const graphql = require('./graphql.cjs')
 function wsResponse (id, type, data = null) {
   const response = {
     id,
-    type
+    type,
   }
   // connection ack does not include a payload
   if (data) {
     response.payload = {
-      data
+      data,
     }
   }
   return JSON.stringify(response)
diff --git a/src/services/workflow.service.js b/src/services/workflow.service.js
index 2f8314f96..a90b772d4 100644
--- a/src/services/workflow.service.js
+++ b/src/services/workflow.service.js
@@ -30,7 +30,7 @@ import {
   primaryMutations,
   processMutations,
   query,
-  tokenise
+  tokenise,
 } from '@/utils/aotf'
 import { store } from '@/store/index'
 import { createApolloClient } from '@/graphql/index'
@@ -118,7 +118,7 @@ class WorkflowService {
           mutation,
           tokenise(id),
         ),
-        ...args
+        ...args,
       },
       this.apolloClient
     )
@@ -146,7 +146,7 @@ class WorkflowService {
     const response = await this.apolloClient.query({
       query,
       variables,
-      fetchPolicy: 'no-cache'
+      fetchPolicy: 'no-cache',
     })
     return response
   }
@@ -163,7 +163,7 @@ class WorkflowService {
     try {
       response = await this.apolloClient.query({
         query: getIntrospectionQuery(),
-        fetchPolicy: 'no-cache'
+        fetchPolicy: 'no-cache',
       })
     } catch (err) {
       console.error(err)
@@ -208,7 +208,7 @@ class WorkflowService {
     return {
       name: queryName,
       args: queryObj.args.filter(({ name }) => argNames.includes(name)),
-      fields: extractFields(type, fields, types)
+      fields: extractFields(type, fields, types),
     }
   }
 
@@ -306,7 +306,7 @@ class WorkflowService {
             },
             error: function error (err) {
               subscription.handleViewState(ViewState.ERROR, err)
-            }
+            },
           }
         )
         this.subscriptions[subscription.query.name] = subscription
@@ -363,7 +363,7 @@ class WorkflowService {
             },
             error: function error (err) {
               subscription.handleViewState(ViewState.ERROR, err)
-            }
+            },
           }
         )
         this.subscriptions[subscription.query.name] = subscription
@@ -402,14 +402,14 @@ class WorkflowService {
     return this.apolloClient.subscribe({
       query,
       variables,
-      fetchPolicy: 'no-cache'
+      fetchPolicy: 'no-cache',
     }).subscribe({
       next (value) {
         subscriptionOptions.next(value)
       },
       error (errorValue) {
         subscriptionOptions.error(errorValue)
-      }
+      },
     })
   }
 
diff --git a/src/store/app.module.js b/src/store/app.module.js
index b47b45de9..fff40b860 100644
--- a/src/store/app.module.js
+++ b/src/store/app.module.js
@@ -28,5 +28,5 @@ const mutations = {
 export const app = {
   namespaced: true,
   state,
-  mutations
+  mutations,
 }
diff --git a/src/store/options.js b/src/store/options.js
index b66e703b4..47428da0f 100644
--- a/src/store/options.js
+++ b/src/store/options.js
@@ -34,7 +34,7 @@ const state = () => ({
    * Number of references that have set the loading state.
    * TODO: we can probably remove it and use a different approach for alerts (see bootstrap toast).
    */
-  refCount: 0
+  refCount: 0,
 })
 
 // Actions
@@ -53,7 +53,7 @@ const actions = {
       console.log(alert.err)
     }
     commit('SET_ALERT', alert)
-  }
+  },
 }
 
 // Mutations
@@ -63,7 +63,7 @@ const mutations = {
   },
   SET_OFFLINE (state, offline) {
     state.offline = offline
-  }
+  },
 }
 
 // Create a new store
@@ -71,9 +71,9 @@ export default {
   modules: {
     app,
     workflows,
-    user
+    user,
   },
   actions,
   mutations,
-  state
+  state,
 }
diff --git a/src/store/user.module.js b/src/store/user.module.js
index 2a6a8bf3c..f3510a033 100644
--- a/src/store/user.module.js
+++ b/src/store/user.module.js
@@ -22,7 +22,7 @@ export const state = () => ({
 export const mutations = {
   SET_USER (state, user) {
     state.user = user
-  }
+  },
 }
 
 export const user = {
diff --git a/src/store/workflows.module.js b/src/store/workflows.module.js
index 7469ea70d..a031a37d8 100644
--- a/src/store/workflows.module.js
+++ b/src/store/workflows.module.js
@@ -25,13 +25,13 @@ const NODE_TYPES = [
   'workflow',
   'cycle',
   'task',
-  'job'
+  'job',
 ]
 
 const state = () => ({
   cylcTree: {
     $index: {},
-    children: []
+    children: [],
   },
 })
 
@@ -73,7 +73,7 @@ const getters = {
       }
     }
     return ret
-  }
+  },
 }
 
 /* Initialise the data store. */
@@ -187,11 +187,11 @@ function removeTree (state, node, removeParent = true) {
   let pointer
   const stack = [
     ...node.children || [],
-    ...node.familyTree || []
+    ...node.familyTree || [],
   ]
   const removeIndicies = [
     ...node.$namespaces || [],
-    ...node.$edges || []
+    ...node.$edges || [],
   ]
   const removeNodes = []
   while (stack.length) {
@@ -390,7 +390,7 @@ function getFamilyTree (tokens, node) {
     ret.push([
       'family',
       ancestor.name,
-      lastTokens.clone({ task: ancestor.name })
+      lastTokens.clone({ task: ancestor.name }),
     ])
   }
 
@@ -398,7 +398,7 @@ function getFamilyTree (tokens, node) {
   ret.push([
     'family',
     tokens[tokens.lowestToken()],
-    tokens
+    tokens,
   ])
 
   return ret
@@ -463,7 +463,7 @@ function createTreeNode (state, id, tokens, node) {
           // create a blank node with just the ID in it
           // when this item is added to the store later this node will be
           // updated in place
-          id: partTokens.id
+          id: partTokens.id,
         },
         parent: pointer.id,
         tokens: partTokens,
@@ -586,7 +586,7 @@ const mutations = {
     }
     // console.log('@@')
   },
-  CLEAR: clearTree
+  CLEAR: clearTree,
 }
 
 // NOTE: deltas are applied in the order listed here
@@ -606,5 +606,5 @@ export const workflows = {
   state,
   getters,
   mutations,
-  actions
+  actions,
 }
diff --git a/src/utils/aotf.js b/src/utils/aotf.js
index 805232bec..8426c7199 100644
--- a/src/utils/aotf.js
+++ b/src/utils/aotf.js
@@ -25,7 +25,7 @@ import dedent from 'dedent'
 import gql from 'graphql-tag'
 import {
   getIntrospectionQuery as getGraphQLIntrospectionQuery,
-  print
+  print,
 } from 'graphql'
 import {
   mdiBullhorn,
@@ -167,7 +167,7 @@ export const cylcObjects = Object.freeze({
   CyclePoint: 'cycle',
   Family: 'family',
   Task: 'task',
-  Job: 'job'
+  Job: 'job',
 })
 
 /**
@@ -181,7 +181,7 @@ export const primaryMutations = {
     'stop',
     'reload',
     'clean',
-    'log'
+    'log',
   ],
   [cylcObjects.CyclePoint]: [
     'hold',
@@ -249,7 +249,7 @@ export const compoundFields = {
     (tokens[cylcObjects.CyclePoint] || '*') +
     '/' +
     tokens[cylcObjects.Task]
-  )
+  ),
 }
 
 /**
@@ -260,7 +260,7 @@ export const compoundFields = {
  */
 export const alternateFields = {
   // cycle points can be used as namespace identifiers
-  NamespaceIDGlob: cylcObjects.CyclePoint
+  NamespaceIDGlob: cylcObjects.CyclePoint,
 }
 
 /**
@@ -271,7 +271,7 @@ export const alternateFields = {
 export const mutationStatus = Object.freeze({
   FAILED: 'FAILED',
   SUCCEEDED: 'SUCCEEDED',
-  WARN: 'WARN'
+  WARN: 'WARN',
 })
 
 /**
@@ -305,7 +305,7 @@ export const dummyMutations = [
     description: 'View task information.',
     args: [],
     _appliesTo: [cylcObjects.Task],
-    _requiresInfo: false
+    _requiresInfo: false,
   },
 ]
 
@@ -316,7 +316,7 @@ export const dummyMutations = [
  */
 const dummyMutationsPermissionsMap = Object.freeze({
   broadcast: Object.freeze(['editRuntime']),
-  read: Object.freeze(['log', 'info'])
+  read: Object.freeze(['log', 'info']),
 })
 
 /**
@@ -378,7 +378,7 @@ export function extractFields (type, fields, types) {
     const fieldType = findByName(types, getBaseType(gqlField.type).name)
     return {
       name: field.name,
-      fields: extractFields(fieldType, field.fields, types)
+      fields: extractFields(fieldType, field.fields, types),
     }
   })
 }
@@ -785,7 +785,7 @@ export function constructQueryStr (query) {
     `  ${query.name}(${argNames.join(', ')}) {`,
     constructFieldsStr(query.fields, 2),
     '  }',
-    '}'
+    '}',
   ].join('\n').trim()
 }
 
@@ -838,7 +838,7 @@ export function getMutationArgsFromTokens (mutation, tokens) {
 function _mutateSuccess (message) {
   return {
     status: mutationStatus.SUCCEEDED,
-    message
+    message,
   }
 }
 
@@ -896,7 +896,7 @@ export async function mutate (mutation, variables, apolloClient, cylcID) {
     // call the mutation
     response = await apolloClient.mutate({
       mutation: gql(mutationStr),
-      variables
+      variables,
     })
   } catch (err) {
     // mutation failed (client-server error e.g. variable format, syntax error)
@@ -954,12 +954,12 @@ export async function query (query, variables, apolloClient) {
   console.debug([
     `query(${query.name})`,
     queryStr,
-    variables
+    variables,
   ])
 
   const response = await apolloClient.query({
     query: gql(queryStr),
-    variables
+    variables,
   })
   return response.data
 }
diff --git a/src/utils/initialOptions.js b/src/utils/initialOptions.js
index 75a6f4a39..9d51dee4a 100644
--- a/src/utils/initialOptions.js
+++ b/src/utils/initialOptions.js
@@ -31,7 +31,7 @@ import { ref, watch } from 'vue'
 export const initialOptions = {
   type: Object,
   required: false,
-  default: () => ({})
+  default: () => ({}),
 }
 
 export const updateInitialOptionsEvent = 'update:initialOptions'
diff --git a/src/utils/tasks.js b/src/utils/tasks.js
index 9b0b9bc69..3d0824d45 100644
--- a/src/utils/tasks.js
+++ b/src/utils/tasks.js
@@ -30,7 +30,7 @@ const isStoppedOrderedStates = [
   TaskState.EXPIRED,
   TaskState.PREPARING,
   TaskState.SUCCEEDED,
-  TaskState.WAITING
+  TaskState.WAITING,
 ]
 
 /**
diff --git a/src/utils/uid.js b/src/utils/uid.js
index 02092ea15..63b25ce6d 100644
--- a/src/utils/uid.js
+++ b/src/utils/uid.js
@@ -318,7 +318,7 @@ export class Tokens {
         // wipe the relative tokens in-case they were set
         cycle: undefined,
         task: undefined,
-        job: undefined
+        job: undefined,
       })
       tokensList.push([part, tokens])
     }
diff --git a/src/utils/viewToolbar.js b/src/utils/viewToolbar.js
index a768b5cd9..a6f35e4a2 100644
--- a/src/utils/viewToolbar.js
+++ b/src/utils/viewToolbar.js
@@ -44,7 +44,7 @@ export const btnProps = (size) => ({
   variant: 'text',
   size,
   style: {
-    fontSize: btnIconFontSize(size)
+    fontSize: btnIconFontSize(size),
   },
 })
 
@@ -68,9 +68,9 @@ export const taskStateItems = [
         return {
           title: modifier.title,
           value: modifier.field,
-          taskProps: getProps(modifier)
+          taskProps: getProps(modifier),
         }
-      })
+      }),
   },
   ...TaskStateNames
     .filter((name) => name !== TaskState.WAITING.name)
@@ -78,7 +78,7 @@ export const taskStateItems = [
       return {
         title: name,
         value: name,
-        taskProps: { state: name }
+        taskProps: { state: name },
       }
     }),
   { type: 'divider' },
@@ -87,7 +87,7 @@ export const taskStateItems = [
       return {
         title: modifier.title,
         value: modifier.field,
-        taskProps: getProps(modifier)
+        taskProps: getProps(modifier),
       }
     }),
 ]
diff --git a/src/views/Analysis.vue b/src/views/Analysis.vue
index 30d846637..b09cfa040 100644
--- a/src/views/Analysis.vue
+++ b/src/views/Analysis.vue
@@ -158,7 +158,7 @@ import graphqlMixin from '@/mixins/graphql'
 import {
   initialOptions,
   updateInitialOptionsEvent,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 import DeltasCallback from '@/services/callbacks'
 import AnalysisTable from '@/components/cylc/analysis/AnalysisTable.vue'
@@ -166,7 +166,7 @@ import BoxPlot from '@/components/cylc/analysis/BoxPlot.vue'
 import TimeSeries from '@/components/cylc/analysis/TimeSeries.vue'
 import {
   matchTask,
-  platformOptions
+  platformOptions,
 } from '@/components/cylc/analysis/filter'
 import {
   mdiChartTimeline,
@@ -195,7 +195,7 @@ const taskFields = [
   'stdDevQueueTime',
   'minQueueTime',
   'queueQuartiles',
-  'maxQueueTime'
+  'maxQueueTime',
 ]
 
 /** The one-off query which retrieves historical task timing statistics */
@@ -249,13 +249,13 @@ export default {
   name: 'Analysis',
 
   mixins: [
-    graphqlMixin
+    graphqlMixin,
   ],
 
   components: {
     AnalysisTable,
     BoxPlot,
-    TimeSeries
+    TimeSeries,
   },
 
   beforeMount () {
@@ -336,7 +336,7 @@ export default {
 
     timingOption () {
       return this.tasksFilter.timingOption.replace(/Times/, '')
-    }
+    },
   },
 
   methods: {
@@ -355,7 +355,7 @@ export default {
         this.callback.onAdded(ret.data)
       },
       200 // only re-run this once every 0.2 seconds
-    )
+    ),
   },
 
   icons: {
diff --git a/src/views/Dashboard.vue b/src/views/Dashboard.vue
index a502689c5..3ef941595 100644
--- a/src/views/Dashboard.vue
+++ b/src/views/Dashboard.vue
@@ -171,7 +171,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
               <v-icon size="1.6em">{{ $options.icons.mdiGraphql }}</v-icon>
             </template>
             <v-list-item-title class="text-h6 font-weight-light">
-             GraphiQL
+              GraphiQL
             </v-list-item-title>
             <v-list-item-subtitle>
               Explore the Cylc GraphQL API
@@ -242,7 +242,7 @@ export default {
   name: 'Dashboard',
 
   mixins: [
-    subscriptionComponentMixin
+    subscriptionComponentMixin,
   ],
 
   components: {
@@ -280,7 +280,7 @@ export default {
         .map(state => {
           return {
             text: state.name.charAt(0).toUpperCase() + state.name.slice(1),
-            count: count[state.name] || 0
+            count: count[state.name] || 0,
           }
         })
     },
@@ -296,18 +296,18 @@ export default {
         }
       }
       return events.reverse()
-    }
+    },
   },
 
   workflowsHeader: [
     { value: 'count' },
-    { value: 'text' }
+    { value: 'text' },
   ],
 
   eventsHeader: [
     { value: 'level' },
     { value: 'workflow' },
-    { value: 'message' }
+    { value: 'message' },
   ],
 
   hubUrl: createUrl('/hub/home', false, true),
diff --git a/src/views/Gantt.vue b/src/views/Gantt.vue
index e7d79b2c5..0f6e4894f 100644
--- a/src/views/Gantt.vue
+++ b/src/views/Gantt.vue
@@ -92,19 +92,19 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 <script>
 import {
-  debounce
+  debounce,
 } from 'lodash'
 import gql from 'graphql-tag'
 import graphqlMixin from '@/mixins/graphql'
 import {
   initialOptions,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 import GanttChart from '@/components/cylc/gantt/GanttChart.vue'
 import DeltasCallback from '@/services/callbacks'
 import {
   matchTasks,
-  platformOptions
+  platformOptions,
 } from '@/components/cylc/gantt/filter'
 
 /** List of fields to request for each job */
@@ -114,7 +114,7 @@ const jobFields = [
   'submittedTime',
   'startedTime',
   'finishedTime',
-  'platform'
+  'platform',
 ]
 
 /** The query which retrieves historical Job timing statistics */
@@ -162,7 +162,7 @@ export default {
   name: 'Gantt',
 
   mixins: [
-    graphqlMixin
+    graphqlMixin,
   ],
 
   components: {
@@ -247,7 +247,7 @@ export default {
   },
 
   taskChoices: [
-    10, 25, 50, 100
+    10, 25, 50, 100,
   ],
 }
 </script>
diff --git a/src/views/Graph.vue b/src/views/Graph.vue
index 61ebaa135..478aa0d18 100644
--- a/src/views/Graph.vue
+++ b/src/views/Graph.vue
@@ -107,7 +107,7 @@ import graphqlMixin from '@/mixins/graphql'
 import subscriptionComponentMixin from '@/mixins/subscriptionComponent'
 import {
   initialOptions,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 import SubscriptionQuery from '@/model/SubscriptionQuery.model'
 // import CylcTreeCallback from '@/services/treeCallback'
@@ -116,7 +116,7 @@ import GraphSubgraph from '@/components/cylc/GraphSubgraph.vue'
 import ViewToolbar from '@/components/cylc/ViewToolbar.vue'
 import {
   posToPath,
-  nonCryptoHash
+  nonCryptoHash,
 } from '@/utils/graph-utils'
 import { Graphviz } from '@hpcc-js/wasm/graphviz'
 import svgPanZoom from 'svg-pan-zoom'
@@ -127,7 +127,7 @@ import {
   mdiArrowExpand,
   mdiRefresh,
   mdiFileRotateRight,
-  mdiVectorSelection
+  mdiVectorSelection,
 } from '@mdi/js'
 import { isFlowNone } from '@/utils/tasks'
 
@@ -230,13 +230,13 @@ export default {
 
   mixins: [
     graphqlMixin,
-    subscriptionComponentMixin
+    subscriptionComponentMixin,
   ],
 
   components: {
     GraphNode,
     GraphSubgraph,
-    ViewToolbar
+    ViewToolbar,
   },
 
   props: { initialOptions },
@@ -349,51 +349,51 @@ export default {
               icon: mdiRefresh,
               action: 'callback',
               callback: this.refresh,
-              disableIf: ['autoRefresh']
+              disableIf: ['autoRefresh'],
             },
             {
               title: 'Auto Refresh',
               icon: mdiTimer,
               action: 'toggle',
               value: this.autoRefresh,
-              key: 'autoRefresh'
+              key: 'autoRefresh',
             },
             {
               title: 'Transpose',
               icon: mdiFileRotateRight,
               action: 'toggle',
               value: this.transpose,
-              key: 'transpose'
+              key: 'transpose',
             },
             {
               title: 'Centre',
               icon: mdiImageFilterCenterFocus,
               action: 'callback',
-              callback: this.reset
+              callback: this.reset,
             },
             {
               title: 'Increase Spacing',
               icon: mdiArrowExpand,
               action: 'callback',
-              callback: this.increaseSpacing
+              callback: this.increaseSpacing,
             },
             {
               title: 'Decrease Spacing',
               icon: mdiArrowCollapse,
               action: 'callback',
-              callback: this.decreaseSpacing
+              callback: this.decreaseSpacing,
             },
             {
               title: 'Group by cycle point',
               icon: mdiVectorSelection,
               action: 'toggle',
               value: this.groupCycle,
-              key: 'groupCycle'
-            }
-          ]
-        }
+              key: 'groupCycle',
+            },
+          ],
+        },
       ]
-    }
+    },
   },
 
   methods: {
@@ -439,7 +439,7 @@ export default {
           fit: false,
           contain: false,
           center: true,
-          refreshRate: 'auto'
+          refreshRate: 'auto',
         }
       )
 
@@ -634,7 +634,7 @@ export default {
       // pan to center
       this.panZoomWidget.pan({
         x: -realZoom * (bbox.x - width / (realZoom * 2) + bbox.width / 2),
-        y: -realZoom * (bbox.y - height / (realZoom * 2) + bbox.height / 2)
+        y: -realZoom * (bbox.y - height / (realZoom * 2) + bbox.height / 2),
       })
 
       // zoom to fit
@@ -773,7 +773,7 @@ export default {
               y: -top,
               width: right - left,
               height: top - bottom,
-              label: obj.label
+              label: obj.label,
             }
           }
         } else {
@@ -797,7 +797,7 @@ export default {
         // mount the svgPanZoom widget on first load
         this.mountSVGPanZoom()
       }
-    }
+    },
   },
 
   watch: {
@@ -826,8 +826,8 @@ export default {
       // refresh the graph when group by cycle point option is changed
       this.graphID = null
       this.refresh()
-    }
-  }
+    },
+  },
 }
 </script>
 
diff --git a/src/views/GraphiQL.vue b/src/views/GraphiQL.vue
index 2ec02cb97..52a0282db 100644
--- a/src/views/GraphiQL.vue
+++ b/src/views/GraphiQL.vue
@@ -30,7 +30,7 @@ export default {
   data () {
     return {
       fetcher: null,
-      subscription: null
+      subscription: null,
     }
   },
   mounted () {
@@ -38,7 +38,7 @@ export default {
     render(
       createElement(GraphiQL, {
         fetcher: this.fetcher,
-        defaultVariableEditorOpen: false
+        defaultVariableEditorOpen: false,
       }),
       this.$refs.graphiql
     )
@@ -57,8 +57,8 @@ export default {
       return subscriptionClient !== null
         ? graphQLFetcher(subscriptionClient, fallbackGraphQLFetcher, this)
         : fallbackGraphQLFetcher
-    }
-  }
+    },
+  },
 }
 </script>
 
diff --git a/src/views/Guide.vue b/src/views/Guide.vue
index 1269fc298..1ac7d6c67 100644
--- a/src/views/Guide.vue
+++ b/src/views/Guide.vue
@@ -50,35 +50,35 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
               One task can have multiple jobs, by automatic retry or manual
               triggering.
             </p>
-         </v-card-text>
-            <table id="task-job-state-table">
-              <tr>
-                <td>Task</td>
-                <td></td>
-                <td>Job</td>
-              </tr>
-              <tr
-                v-bind:key="state.name.name"
-                v-for="state of states"
-              >
-                <td style="font-size: 2em;">
-                  <!-- set times to make the progress change -->
-                  <task
-                    :task="{
-                      state: state.name,
-                      task: {meanElapsedTime: 30}
-                    }"
-                    :startTime="String(Date.now())"
-                  />
-                </td>
-                <td>
-                  <span>{{ state.name }}</span>
-                </td>
-                <td style="font-size: 2em;">
-                  <job :status="state.name" />
-                </td>
-              </tr>
-            </table>
+          </v-card-text>
+          <table id="task-job-state-table">
+            <tr>
+              <td>Task</td>
+              <td></td>
+              <td>Job</td>
+            </tr>
+            <tr
+              v-bind:key="state.name.name"
+              v-for="state of states"
+            >
+              <td style="font-size: 2em;">
+                <!-- set times to make the progress change -->
+                <task
+                  :task="{
+                    state: state.name,
+                    task: {meanElapsedTime: 30},
+                  }"
+                  :startTime="String(Date.now())"
+                />
+              </td>
+              <td>
+                <span>{{ state.name }}</span>
+              </td>
+              <td style="font-size: 2em;">
+                <job :status="state.name" />
+              </td>
+            </tr>
+          </table>
           <v-card-text>
             <p>
               A <b>waiting task</b> with <b>failed jobs</b> will
@@ -103,7 +103,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
               back from running by some other factor (e.g, if they are held).
             </p>
             <v-list
-               lines="three"
+              lines="three"
             >
               <v-list-item>
                 <template v-slot:prepend>
@@ -187,7 +187,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
             <p>
               Why has my task not started to run yet?
             </p>
-           <v-list
+            <v-list
               lines="three"
             >
               <v-list-item>
@@ -305,10 +305,10 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
               </v-list-item>
             </v-list>
             <p>
-            <em>Note: tasks downstream of queued (or runahead limited) tasks
-               are not themselves shown as queued (or runahead limited)
-               because they are not otherwise ready to run yet.</em>
-             </p>
+              <em>Note: tasks downstream of queued (or runahead limited) tasks
+                are not themselves shown as queued (or runahead limited)
+                because they are not otherwise ready to run yet.</em>
+            </p>
           </v-card-text>
         </v-card>
 
@@ -362,9 +362,9 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
                   </marker>
                 </defs>
                 <g
-                ref="graph"
+                  ref="graph"
                   v-on:click.stop.prevent=""
-                  >
+                >
 
                   <g
                     v-for="(task, index) in exampleTasks"
@@ -397,7 +397,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
                       stroke-width="5"
                       fill="none"
                       :marker-end="`url(#${uid}-arrow-end)`"
-                    :transform="`translate(0, ${ (240 * index) + 120 })`"
+                      :transform="`translate(0, ${ (240 * index) + 120 })`"
                     />
 
                   </g>
@@ -489,7 +489,7 @@ export default {
         },
         jobs: [],
       },
-    ]
+    ],
   }),
 
   methods: {
diff --git a/src/views/Info.vue b/src/views/Info.vue
index b9744fa7c..512c5b224 100644
--- a/src/views/Info.vue
+++ b/src/views/Info.vue
@@ -33,7 +33,7 @@ import SubscriptionQuery from '@/model/SubscriptionQuery.model'
 import DeltasCallback from '@/services/callbacks'
 import {
   initialOptions,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 import { Tokens } from '@/utils/uid'
 
@@ -198,7 +198,7 @@ export default {
 
   mixins: [
     graphqlMixin,
-    subscriptionComponentMixin
+    subscriptionComponentMixin,
   ],
 
   components: {
@@ -208,7 +208,7 @@ export default {
   head () {
     return {
       // This sets the page title.
-      title: getPageTitle('App.workflow', { name: this.workflowName })
+      title: getPageTitle('App.workflow', { name: this.workflowName }),
     }
   },
 
@@ -249,7 +249,7 @@ export default {
         { ...this.variables, taskID: this.requestedTokens?.relativeID },
         `info-query-${this._uid}`,
         [
-          new InfoCallback(this.task, this.taskNode)
+          new InfoCallback(this.task, this.taskNode),
         ],
         /* isDelta */ true,
         /* isGlobalCallback */ false
@@ -260,7 +260,7 @@ export default {
   methods: {
     updatePanelExpansion (value) {
       this.panelExpansion = value
-    }
-  }
+    },
+  },
 }
 </script>
diff --git a/src/views/Log.vue b/src/views/Log.vue
index 7a2aa101c..38b1674f8 100644
--- a/src/views/Log.vue
+++ b/src/views/Log.vue
@@ -153,7 +153,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
             } : {
               color: 'error',
               prependIcon: $options.icons.mdiPowerPlugOff,
-              onClick: updateQuery
+              onClick: updateQuery,
             }"
           >
             {{ results.connected ? 'Connected' : 'Reconnect' }}
@@ -223,7 +223,7 @@ import subscriptionComponentMixin from '@/mixins/subscriptionComponent'
 import {
   initialOptions,
   updateInitialOptionsEvent,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 import LogComponent from '@/components/cylc/log/Log.vue'
 import SubscriptionQuery from '@/model/SubscriptionQuery.model'
@@ -343,7 +343,7 @@ export default {
 
   mixins: [
     graphqlMixin,
-    subscriptionComponentMixin
+    subscriptionComponentMixin,
   ],
 
   components: {
@@ -384,7 +384,7 @@ export default {
     const inputID = refWithControl(relativeID.value, {
       onChanged: debounce((value) => {
         relativeID.value = value
-      }, 500)
+      }, 500),
     })
 
     function validateInputID (id) {
@@ -479,7 +479,7 @@ export default {
     this.$watch(
       () => ({
         id: this.id ?? undefined, // (do not trigger the callback on null ⇄ undefined)
-        file: this.file ?? undefined
+        file: this.file ?? undefined,
       }),
       async ({ id, file }, old) => {
         // update the widget tab caption when the id or file change
@@ -527,7 +527,7 @@ export default {
               icon: mdiClockOutline,
               action: 'toggle',
               value: this.timestamps,
-              key: 'timestamps'
+              key: 'timestamps',
             },
             {
               title: 'Word wrap',
@@ -543,10 +543,10 @@ export default {
               value: this.autoScroll,
               key: 'autoScroll',
             },
-          ]
-        }
+          ],
+        },
       ]
-    }
+    },
   },
 
   methods: {
@@ -569,7 +569,7 @@ export default {
         { id: this.id, file: this.file },
         `log-query-${this._uid}`,
         [
-          new LogsCallback(this.results)
+          new LogsCallback(this.results),
         ],
         /* isDelta */ false,
         /* isGlobalCallback */ false
@@ -590,7 +590,7 @@ export default {
             JOB_QUERY,
             {
               id: this.relativeTokens.id,
-              workflowId: this.workflowTokens.workflow
+              workflowId: this.workflowTokens.workflow,
             }
           )
         }
@@ -625,7 +625,7 @@ export default {
         // get the list of available log files
         result = await this.$workflowService.apolloClient.query({
           query: LOG_FILE_QUERY,
-          variables: { id: this.id }
+          variables: { id: this.id },
         })
       } catch (err) {
         // the query failed
@@ -690,7 +690,7 @@ export default {
       this.file = null
       // go back to last chosen job if we are switching back to job logs
       this.relativeID = val ? this.previousRelativeID : null
-    }
+    },
   },
 
   // Misc options
@@ -700,6 +700,6 @@ export default {
     mdiPowerPlugOff,
     mdiFileAlertOutline,
     mdiInformationOutline,
-  }
+  },
 }
 </script>
diff --git a/src/views/SimpleTree.vue b/src/views/SimpleTree.vue
index ca2565a58..988edc739 100644
--- a/src/views/SimpleTree.vue
+++ b/src/views/SimpleTree.vue
@@ -189,7 +189,7 @@ export default {
   // These mixins enable various functionalities.
   mixins: [
     graphqlMixin,
-    subscriptionComponentMixin
+    subscriptionComponentMixin,
   ],
 
   computed: {
@@ -219,8 +219,8 @@ export default {
     // in the store and to keep it up to date.
     query () {
       return new SubscriptionQuery(QUERY, this.variables, 'workflow', [])
-    }
-  }
+    },
+  },
 
 }
 </script>
diff --git a/src/views/Table.vue b/src/views/Table.vue
index 1d9710248..af5f4f430 100644
--- a/src/views/Table.vue
+++ b/src/views/Table.vue
@@ -42,7 +42,7 @@ import subscriptionComponentMixin from '@/mixins/subscriptionComponent'
 import {
   initialOptions,
   updateInitialOptionsEvent,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 import { matchNode, groupStateFilters, globToRegex } from '@/components/cylc/common/filter'
 import ViewToolbar from '@/components/cylc/ViewToolbar.vue'
@@ -143,7 +143,7 @@ export default {
 
   mixins: [
     graphqlMixin,
-    subscriptionComponentMixin
+    subscriptionComponentMixin,
   ],
 
   components: {
@@ -236,7 +236,7 @@ export default {
               title: 'Filter By ID',
               action: 'taskIDFilter',
               key: 'taskIDFilter',
-              value: this.tasksFilter.id
+              value: this.tasksFilter.id,
             },
             {
               title: 'Filter By State',
diff --git a/src/views/Tree.vue b/src/views/Tree.vue
index d0a77db9a..f708b2615 100644
--- a/src/views/Tree.vue
+++ b/src/views/Tree.vue
@@ -48,7 +48,7 @@ import graphqlMixin from '@/mixins/graphql'
 import subscriptionComponentMixin from '@/mixins/subscriptionComponent'
 import {
   initialOptions,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 import SubscriptionQuery from '@/model/SubscriptionQuery.model'
 import TreeComponent from '@/components/cylc/tree/Tree.vue'
@@ -172,7 +172,7 @@ export default {
 
   mixins: [
     graphqlMixin,
-    subscriptionComponentMixin
+    subscriptionComponentMixin,
   ],
 
   components: {
@@ -239,7 +239,7 @@ export default {
               title: 'Filter By ID',
               action: 'taskIDFilter',
               key: 'taskIDFilter',
-              value: this.tasksFilter.id
+              value: this.tasksFilter.id,
             },
             {
               title: 'Filter By State',
@@ -256,11 +256,11 @@ export default {
               title: 'Toggle Families',
               icon: {
                 true: mdiFormatAlignJustify,
-                false: mdiFormatAlignRight
+                false: mdiFormatAlignRight,
               },
               action: 'toggle',
               value: this.flat,
-              key: 'flat'
+              key: 'flat',
             },
             {
               title: 'Expand All',
@@ -276,8 +276,8 @@ export default {
               action: 'callback',
               callback: this.treeCollapseAll,
             },
-          ]
-        }
+          ],
+        },
       ]
     },
   },
diff --git a/src/views/UserProfile.vue b/src/views/UserProfile.vue
index bfa308cfc..a11ac908c 100644
--- a/src/views/UserProfile.vue
+++ b/src/views/UserProfile.vue
@@ -302,7 +302,7 @@ export default {
   jobThemes: [
     'default',
     'greyscale',
-    'colour_blind'
+    'colour_blind',
   ],
 
   icons: {
diff --git a/src/views/Workflows.vue b/src/views/Workflows.vue
index 52818c756..da3d5b480 100644
--- a/src/views/Workflows.vue
+++ b/src/views/Workflows.vue
@@ -81,7 +81,7 @@ export default {
   name: 'Workflows',
 
   mixins: [
-    subscriptionComponentMixin
+    subscriptionComponentMixin,
   ],
 
   components: {
@@ -95,12 +95,12 @@ export default {
         {},
         'root',
         []
-      )
+      ),
     }
   },
 
   computed: {
-    ...mapState('workflows', ['cylcTree'])
-  }
+    ...mapState('workflows', ['cylcTree']),
+  },
 }
 </script>
diff --git a/src/views/WorkflowsTable.vue b/src/views/WorkflowsTable.vue
index d1d95979f..0a84e6a00 100644
--- a/src/views/WorkflowsTable.vue
+++ b/src/views/WorkflowsTable.vue
@@ -123,7 +123,7 @@ export default {
   ],
 
   components: {
-    WorkflowIcon
+    WorkflowIcon,
   },
 
   setup () {
@@ -164,7 +164,7 @@ export default {
     },
     workflowsTable () {
       return Object.values(this.workflows)
-    }
+    },
   },
 
   methods: {
@@ -180,49 +180,49 @@ export default {
       if (timestamp) {
         return humanDuration(new Date(timestamp * 1000))
       }
-    }
+    },
   },
 
   headers: [
     {
       sortable: false,
       title: '',
-      key: 'icon'
+      key: 'icon',
     },
     {
       sortable: true,
       title: i18n.global.t('Workflows.tableColumnName'),
-      key: 'tokens.workflow'
+      key: 'tokens.workflow',
     },
     {
       sortable: true,
       title: 'Status',
-      key: 'node.status'
+      key: 'node.status',
     },
     {
       sortable: true,
       title: 'Cylc Version',
-      key: 'node.cylcVersion'
+      key: 'node.cylcVersion',
     },
     {
       sortable: true,
       title: i18n.global.t('Workflows.tableColumnOwner'),
-      key: 'node.owner'
+      key: 'node.owner',
     },
     {
       sortable: true,
       title: i18n.global.t('Workflows.tableColumnHost'),
-      key: 'node.host'
+      key: 'node.host',
     },
     {
       sortable: false,
       title: i18n.global.t('Workflows.tableColumnPort'),
-      key: 'node.port'
+      key: 'node.port',
     },
     {
       sortable: true,
       title: 'Last Activity',
-      key: 'node.lastUpdated'
+      key: 'node.lastUpdated',
     },
   ],
 }
diff --git a/src/views/Workspace.vue b/src/views/Workspace.vue
index afd22e6ee..94013f2e1 100644
--- a/src/views/Workspace.vue
+++ b/src/views/Workspace.vue
@@ -49,12 +49,12 @@ export default {
 
   mixins: [
     graphqlMixin,
-    subscriptionMixin
+    subscriptionMixin,
   ],
 
   components: {
     Lumino,
-    Toolbar
+    Toolbar,
   },
 
   setup () {
@@ -70,7 +70,7 @@ export default {
       // but back to beginning. When a widget is added, if it uses a query, then the mixins will
       // take care to set the state to LOADING and then COMPLETE (and hopefully not ERROR).
       this.viewState = ViewState.NO_STATE
-    }
+    },
   },
 
   panelStyle: {
diff --git a/tests/.eslintrc.cjs b/tests/.eslintrc.cjs
index c535b4bfe..dac36db23 100644
--- a/tests/.eslintrc.cjs
+++ b/tests/.eslintrc.cjs
@@ -17,10 +17,10 @@
 
 module.exports = {
   env: {
-    mocha: true
+    mocha: true,
   },
   plugins: [
-    'no-only-tests'
+    'no-only-tests',
   ],
   rules: {
     'no-console': 'off',
@@ -31,8 +31,8 @@ module.exports = {
       files: ['*.spec.js', '*.cy.js'],
       rules: {
         // Don't complain about certain chai assertions:
-        'no-unused-expressions': 'off'
-      }
-    }
-  ]
+        'no-unused-expressions': 'off',
+      },
+    },
+  ],
 }
diff --git a/tests/component/.eslintrc.cjs b/tests/component/.eslintrc.cjs
index 0667e7b35..65d06fbfd 100644
--- a/tests/component/.eslintrc.cjs
+++ b/tests/component/.eslintrc.cjs
@@ -17,9 +17,9 @@
 
 module.exports = {
   plugins: [
-    'cypress'
+    'cypress',
   ],
   env: {
-    'cypress/globals': true
+    'cypress/globals': true,
   },
 }
diff --git a/tests/component/specs/boxPlot.cy.js b/tests/component/specs/boxPlot.cy.js
index 2b770d6e8..454634120 100644
--- a/tests/component/specs/boxPlot.cy.js
+++ b/tests/component/specs/boxPlot.cy.js
@@ -74,7 +74,7 @@ const mountOpts = {
   props: {
     timingOption: 'total',
     animate: false,
-  }
+  },
 }
 
 describe('BoxPlot', () => {
@@ -99,7 +99,7 @@ describe('BoxPlot', () => {
       props: {
         tasks: Array.from(Array(7).keys(), (i) => ({
           ...task1,
-          name: `task_${i}`
+          name: `task_${i}`,
         })),
         itemsPerPage: 4,
       },
diff --git a/tests/component/specs/cylc-graph-node.cy.js b/tests/component/specs/cylc-graph-node.cy.js
index dc4520661..6975ccf34 100644
--- a/tests/component/specs/cylc-graph-node.cy.js
+++ b/tests/component/specs/cylc-graph-node.cy.js
@@ -22,7 +22,7 @@ import GraphNode from '@/components/cylc/GraphNode.vue'
 import { Tokens } from '@/utils/uid'
 import {
   MEAN_ELAPSED_TIME,
-  getStartTime
+  getStartTime,
 } from './utils/task'
 
 function makeTaskNode (id, state, jobStates) {
@@ -36,8 +36,8 @@ function makeTaskNode (id, state, jobStates) {
       id: jobTokens.id,
       name: jobTokens.job,
       node: {
-        state: jobState
-      }
+        state: jobState,
+      },
     }
     if (jobState === 'running') { // TODO constant
       job.node.startedTime = getStartTime(50)
@@ -55,9 +55,9 @@ function makeTaskNode (id, state, jobStates) {
       isHeld: false,
       state,
       task: {
-        meanElapsedTime: MEAN_ELAPSED_TIME
-      }
-    }
+        meanElapsedTime: MEAN_ELAPSED_TIME,
+      },
+    },
   }
 
   return [task, jobs]
@@ -73,13 +73,13 @@ const GraphNodeSVG = defineComponent({
         width: '100%',
         height: '100%',
         // the "-40" bit is to account for the task modifiers
-        viewBox: '-40,-40,450,150'
+        viewBox: '-40,-40,450,150',
       },
       [
-        h(GraphNode, this.$attrs)
+        h(GraphNode, this.$attrs),
       ]
     )
-  }
+  },
 })
 
 describe('graph node component', () => {
@@ -92,7 +92,7 @@ describe('graph node component', () => {
     cy.mount(
       GraphNodeSVG,
       {
-        props: { task, jobs }
+        props: { task, jobs },
       }
     )
     // there should be 4 jobs
@@ -117,7 +117,7 @@ describe('graph node component', () => {
     cy.mount(
       GraphNodeSVG,
       {
-        props: { task, jobs, maxJobs: 4 }
+        props: { task, jobs, maxJobs: 4 },
       }
     )
     // there should be <maxJobs> jobs
diff --git a/tests/component/specs/cylc-icons.cy.js b/tests/component/specs/cylc-icons.cy.js
index 159985caa..2200d3fd3 100644
--- a/tests/component/specs/cylc-icons.cy.js
+++ b/tests/component/specs/cylc-icons.cy.js
@@ -21,7 +21,7 @@ import Task from '@/components/cylc/Task.vue'
 import Job from '@/components/cylc/Job.vue'
 import {
   MEAN_ELAPSED_TIME,
-  getStartTime
+  getStartTime,
 } from './utils/task'
 import { defineComponent, h } from 'vue'
 
@@ -33,10 +33,10 @@ const JobComponent = defineComponent({
       'span',
       { style: 'font-size: 200px;', id: 'app', class: 'job_theme--default' },
       [
-        h(Job, this.$attrs)
+        h(Job, this.$attrs),
       ]
     )
-  }
+  },
 })
 
 // wrap the Task component to allow us to bump up the font-size for a
@@ -47,10 +47,10 @@ const TaskComponent = defineComponent({
       'span',
       { style: 'font-size: 200px; margin-left: 100px; margin-top: 50px; display: inline-block' },
       [
-        h(Task, this.$attrs)
+        h(Task, this.$attrs),
       ]
     )
-  }
+  },
 })
 
 function makeTask (
@@ -73,8 +73,8 @@ function makeTask (
     isWallclock,
     isXtriggered,
     task: {
-      meanElapsedTime: MEAN_ELAPSED_TIME // NOTE time in seconds
-    }
+      meanElapsedTime: MEAN_ELAPSED_TIME, // NOTE time in seconds
+    },
   }
 }
 
@@ -97,8 +97,8 @@ describe('Task component', () => {
         {
           props: {
             task,
-            startTime: getStartTime(percent)
-          }
+            startTime: getStartTime(percent),
+          },
         }
       )
       cy.get('.c8-task').last().parent().screenshot(
@@ -132,7 +132,7 @@ describe('Task component', () => {
       'isQueued',
       'isXtriggered',
       'isRetry',
-      'isWallclock'
+      'isWallclock',
     ]) {
       task = makeTask()
       let filename
@@ -149,7 +149,7 @@ describe('Task component', () => {
         {
           overwrite: true,
           disableTimersAndAnimations: false,
-          padding: [10, 10, 15, 10]
+          padding: [10, 10, 15, 10],
         }
       )
     }
@@ -164,7 +164,7 @@ describe('Task component', () => {
         {
           overwrite: true,
           disableTimersAndAnimations: false,
-          padding: [10, 5, 5, 10]
+          padding: [10, 5, 5, 10],
         }
       )
     }
diff --git a/tests/component/specs/ganttchart.cy.js b/tests/component/specs/ganttchart.cy.js
index 822470005..b2b9fb702 100644
--- a/tests/component/specs/ganttchart.cy.js
+++ b/tests/component/specs/ganttchart.cy.js
@@ -29,7 +29,7 @@ const jobs = {
     submittedTime: '2023-02-23T11:10:09Z',
     startedTime: '2023-02-23T11:10:13Z',
     finishedTime: '2023-02-23T11:10:20Z',
-    platform: 'localhost'
+    platform: 'localhost',
   }],
   yet_another_test_job: [{
     name: 'yet_another_test_job',
@@ -37,8 +37,8 @@ const jobs = {
     submittedTime: '2023-02-23T11:10:21Z',
     startedTime: '2023-02-23T11:10:24Z',
     finishedTime: '2023-02-23T11:10:26Z',
-    platform: 'localhost'
-  }]
+    platform: 'localhost',
+  }],
 }
 
 const mountOpts = {
@@ -50,15 +50,15 @@ const mountOpts = {
   },
   props: {
     timingOption: 'total',
-    animate: false
-  }
+    animate: false,
+  },
 }
 describe('GanttChart correctly', () => {
   it('renders', () => {
     // see: https://on.cypress.io/mounting-vue
     cy.mount(GanttChart, merge(mountOpts, {
       props: {
-        jobs
+        jobs,
       },
     }))
     cy.get('.vue-apexcharts')
@@ -80,7 +80,7 @@ describe('GanttChart correctly', () => {
     cy.mount(GanttChart, merge(mountOpts, {
       props: {
         tasksPerPage: 1,
-        jobs
+        jobs,
       },
     }))
     cy.get('[data-test="v-pagination-item"]')
diff --git a/tests/component/specs/info.cy.js b/tests/component/specs/info.cy.js
index 3fb2b4f86..df8ef2018 100644
--- a/tests/component/specs/info.cy.js
+++ b/tests/component/specs/info.cy.js
@@ -37,8 +37,8 @@ const TASK = {
         customMeta: {
           answer: '42',
           question: 'mutually exclusive',
-        }
-      }
+        },
+      },
     },
     namespace: [
       'root',
@@ -108,7 +108,7 @@ const TASK = {
         label: 'x',
         message: 'xxx',
         satisfied: true,
-      }
+      },
     ],
     runtime: {
       completion: '(succeeded and x) or failed',
@@ -118,19 +118,19 @@ const TASK = {
       {
         label: 'xtrigger',
         id: 'my-xtrigger(foo=99)',
-        satisfied: false
+        satisfied: false,
       },
       {
         label: 'xtrigger',
         id: 'my-xtrigger(foo=42)',
-        satisfied: false
+        satisfied: false,
       },
       {
         label: 'wallclock-xtrigger',
         id: 'wall_clock(trigger_time=634737600)',
-        satisfied: true
-      }
-    ]
+        satisfied: true,
+      },
+    ],
   },
   children: [
     {
@@ -138,16 +138,16 @@ const TASK = {
       tokens: TOKENS.clone({ job: '02' }),
       name: '02',
       node: {
-        state: 'succeeded'
-      }
+        state: 'succeeded',
+      },
     },
     {
       id: TOKENS.clone({ job: '01' }).id,
       tokens: TOKENS.clone({ job: '01' }),
       name: '01',
       node: {
-        state: 'failed'
-      }
+        state: 'failed',
+      },
     },
   ],
 }
@@ -169,7 +169,7 @@ describe('Info component', () => {
             'outputs',
             'completion',
           ],
-        }
+        },
       })
     })
 
@@ -291,11 +291,11 @@ describe('Info component', () => {
     cy.vmount(InfoComponent, {
       props: {
         task: TASK,
-        class: 'job_theme--default'
+        class: 'job_theme--default',
       },
       listeners: {
         'update:panelExpansion': spy,
-      }
+      },
     }).as('wrapper')
 
     // ONLY the metadata panel should be expanded by default
@@ -327,13 +327,13 @@ describe('Info component', () => {
       node: {
         task: {
           meta: {
-            customMeta: {}
-          }
+            customMeta: {},
+          },
         },
         prerequisites: [],
         outputs: [],
         runtime: {},
-        xtriggers: []
+        xtriggers: [],
       },
       children: [],
     }
@@ -344,7 +344,7 @@ describe('Info component', () => {
         class: 'job_theme--default',
         // NOTE: expand all sections by default
         panelExpansion: [0, 1, 2, 3],
-      }
+      },
     })
   })
 
@@ -358,13 +358,13 @@ describe('Info component', () => {
         node: {
           task: {
             meta: {
-              customMeta: {}
-            }
+              customMeta: {},
+            },
           },
           prerequisites: [],
           outputs: [],
           runtime: { runMode: mode },
-          xtriggers: []
+          xtriggers: [],
         },
         children: [],
       }
@@ -375,7 +375,7 @@ describe('Info component', () => {
           class: 'job_theme--default',
           // Expand just the run mode panel
           panelExpansion: ['runMode'],
-        }
+        },
       })
 
       cy.get('.run-mode-panel.v-expansion-panel--active').should('be.visible')
diff --git a/tests/component/specs/log.cy.js b/tests/component/specs/log.cy.js
index cbef683d3..f3699dfb6 100644
--- a/tests/component/specs/log.cy.js
+++ b/tests/component/specs/log.cy.js
@@ -29,7 +29,7 @@ const mountOpts = {
       createVuetify(vuetifyOptions),
     ],
   },
-  props: {}
+  props: {},
 }
 
 function logLines (length) {
@@ -66,7 +66,7 @@ describe('Log Component', () => {
     // turn autoscroll on
     cy.get('@component').then(({ wrapper }) => {
       wrapper.setProps({
-        autoScroll: true
+        autoScroll: true,
       })
     })
     cy.get('span').contains('Line 30')
@@ -75,7 +75,7 @@ describe('Log Component', () => {
     // update the log
     cy.get('@component').then(({ wrapper }) => {
       wrapper.setProps({
-        logs: logLines(50)
+        logs: logLines(50),
       })
     })
     // log file should now have scrolled to the bottom
diff --git a/tests/component/specs/treeItem.cy.js b/tests/component/specs/treeItem.cy.js
index 4302d0539..34db2a952 100644
--- a/tests/component/specs/treeItem.cy.js
+++ b/tests/component/specs/treeItem.cy.js
@@ -49,14 +49,14 @@ describe('TreeItem component', () => {
       .should('deep.equal', {
         // Auto expand everything down to task nodes by default
         all: ['cycle', 'task'],
-        visible: ['cycle', 'task']
+        visible: ['cycle', 'task'],
       })
 
     cy.toggleNode('task')
     cy.getNodeTypes()
       .should('deep.equal', {
         all: ['cycle', 'task', 'job', 'job'],
-        visible: ['cycle', 'task', 'job', 'job']
+        visible: ['cycle', 'task', 'job', 'job'],
       })
 
     cy.toggleNode('cycle')
@@ -64,7 +64,7 @@ describe('TreeItem component', () => {
       .should('deep.equal', {
         // All previously expanded nodes under cycle should be hidden but remain rendered
         all: ['cycle', 'task', 'job', 'job'],
-        visible: ['cycle']
+        visible: ['cycle'],
       })
 
     cy.toggleNode('cycle')
@@ -73,7 +73,7 @@ describe('TreeItem component', () => {
       .should('deep.equal', {
         // Job node does not use a child TreeItem
         all: ['cycle', 'task', 'job', 'job'],
-        visible: ['cycle', 'task', 'job', 'job']
+        visible: ['cycle', 'task', 'job', 'job'],
       })
   })
 })
diff --git a/tests/component/specs/viewToolbar.cy.js b/tests/component/specs/viewToolbar.cy.js
index 45be90dbc..6b2004a41 100644
--- a/tests/component/specs/viewToolbar.cy.js
+++ b/tests/component/specs/viewToolbar.cy.js
@@ -18,7 +18,7 @@
 import {
   mdiCog,
   mdiGestureTap,
-  mdiToggleSwitch
+  mdiToggleSwitch,
 } from '@mdi/js'
 import ViewToolbar from '@/components/cylc/ViewToolbar.vue'
 
@@ -51,17 +51,17 @@ describe('View Toolbar Component', () => {
             icon: mdiToggleSwitch,
             action: 'toggle',
             value: true,
-            key: 'toggle'
+            key: 'toggle',
           },
           {
             title: 'Callback',
             icon: mdiGestureTap,
             action: 'callback',
             callback: myCallback,
-            key: 'callback'
-          }
-        ]
-      }
+            key: 'callback',
+          },
+        ],
+      },
     ])
 
     // test all controls rendered
@@ -128,24 +128,24 @@ describe('View Toolbar Component', () => {
             value: true,
             key: 'foo',
             enableIf: ['bar'],
-            disableIf: ['baz']
+            disableIf: ['baz'],
           },
           {
             title: 'Bar',
             icon: mdiCog,
             action: 'toggle',
             value: true,
-            key: 'bar'
+            key: 'bar',
           },
           {
             title: 'Baz',
             icon: mdiCog,
             action: 'toggle',
             value: false,
-            key: 'baz'
-          }
-        ]
-      }
+            key: 'baz',
+          },
+        ],
+      },
     ])
 
     cy
@@ -190,16 +190,16 @@ describe('View Toolbar Component', () => {
             icon: mdiCog,
             action: 'toggle',
             value: true,
-            key: 'foo'
+            key: 'foo',
           },
           {
             title: 'Bar',
             icon: mdiCog,
             action: 'toggle',
             value: false,
-            key: 'bar'
-          }
-        ]
+            key: 'bar',
+          },
+        ],
       },
       {
         title: 'Group 2',
@@ -209,17 +209,17 @@ describe('View Toolbar Component', () => {
             icon: mdiCog,
             action: 'toggle',
             value: true,
-            key: 'baz'
+            key: 'baz',
           },
           {
             title: 'Pub',
             icon: mdiCog,
             action: 'toggle',
             value: false,
-            key: 'pub'
-          }
-        ]
-      }
+            key: 'pub',
+          },
+        ],
+      },
     ])
     // TODO: visual regression test
     // https://github.com/cylc/cylc-ui/issues/178
diff --git a/tests/component/specs/warning-icon.cy.js b/tests/component/specs/warning-icon.cy.js
index 60fc1cd3f..25402a8a1 100644
--- a/tests/component/specs/warning-icon.cy.js
+++ b/tests/component/specs/warning-icon.cy.js
@@ -25,10 +25,10 @@ const WarningComponent = defineComponent({
       'span',
       { style: 'font-size: 200px; margin: 100px;' },
       [
-        h(WarningIcon, this.$attrs)
+        h(WarningIcon, this.$attrs),
       ]
     )
-  }
+  },
 })
 
 // data-store workflow node with no warnings
@@ -42,10 +42,10 @@ const workflowWithWarning = {
   ...workflowWithoutWarning,
   node: {
     logRecords: [
-      { level: 'INFO', message: 'Hello Warning!' }
+      { level: 'INFO', message: 'Hello Warning!' },
     ],
     warningActive: true,
-  }
+  },
 }
 
 describe('Warning Icon', () => {
diff --git a/tests/component/support/index.js b/tests/component/support/index.js
index 990aeadb4..aea41c6aa 100644
--- a/tests/component/support/index.js
+++ b/tests/component/support/index.js
@@ -36,9 +36,9 @@ Cypress.Commands.add('vmount', (component, options = {}) => {
     component,
     {
       global: {
-        plugins: [createVuetify(vuetifyOptions)]
+        plugins: [createVuetify(vuetifyOptions)],
       },
-      ...options
+      ...options,
     }
   )
 })
diff --git a/tests/e2e/.eslintrc.cjs b/tests/e2e/.eslintrc.cjs
index 0667e7b35..65d06fbfd 100644
--- a/tests/e2e/.eslintrc.cjs
+++ b/tests/e2e/.eslintrc.cjs
@@ -17,9 +17,9 @@
 
 module.exports = {
   plugins: [
-    'cypress'
+    'cypress',
   ],
   env: {
-    'cypress/globals': true
+    'cypress/globals': true,
   },
 }
diff --git a/tests/e2e/specs/aotf.cy.js b/tests/e2e/specs/aotf.cy.js
index 3742a92ed..5d7797e2c 100644
--- a/tests/e2e/specs/aotf.cy.js
+++ b/tests/e2e/specs/aotf.cy.js
@@ -17,7 +17,7 @@
 
 import {
   mutationStatus,
-  processMutations
+  processMutations,
 } from '@/utils/aotf'
 import {
   MUTATIONS,
@@ -36,9 +36,9 @@ function mockApolloClient () {
       return {
         data: {
           [args.mutation.definitions[0].name.value]: {
-            result: []
-          }
-        }
+            result: [],
+          },
+        },
       }
     }
   })
@@ -76,10 +76,10 @@ describe('Api On The Fly', () => {
       service.introspection = Promise.resolve({
         mutations,
         types: [],
-        queries: []
+        queries: [],
       })
       service.primaryMutations = {
-        workflow: ['workflowMutation']
+        workflow: ['workflowMutation'],
       }
     })
   })
@@ -98,32 +98,32 @@ describe('Api On The Fly', () => {
         {
           selector: '.node-data-cycle .c-task:first',
           mutationTitle: 'Cycle Mutation',
-          mutationText: 'cycle'
+          mutationText: 'cycle',
         },
         // family
         {
           selector: '.node-data-family .c-task:first',
           mutationTitle: 'Namespace Mutation',
-          mutationText: 'namespace'
+          mutationText: 'namespace',
         },
         // task
         {
           selector: '.node-data-task .c-task:first',
           mutationTitle: 'Namespace Mutation',
-          mutationText: 'namespace'
+          mutationText: 'namespace',
         },
         // job (in task summary)
         {
           selector: '.node-data-task .node-summary .c-job:first',
           mutationTitle: 'Job Mutation',
-          mutationText: 'job'
+          mutationText: 'job',
         },
         // job (expanded)
         {
           selector: '.node-data-job:visible .c-job',
           mutationTitle: 'Job Mutation',
-          mutationText: 'job'
-        }
+          mutationText: 'job',
+        },
       ]
 
       for (const test of tests) {
diff --git a/tests/e2e/specs/editRuntimeForm.cy.js b/tests/e2e/specs/editRuntimeForm.cy.js
index 7cde58897..70838d74f 100644
--- a/tests/e2e/specs/editRuntimeForm.cy.js
+++ b/tests/e2e/specs/editRuntimeForm.cy.js
@@ -32,9 +32,9 @@ describe('Edit Runtime form', () => {
           data: {
             [body.operationName]: {
               result: [true, {}],
-              __typename: upperFirst(body.operationName)
-            }
-          }
+              __typename: upperFirst(body.operationName),
+            },
+          },
         })
       }
     })
@@ -124,8 +124,8 @@ describe('Edit Runtime form', () => {
           settings: [
             { init_script: 'echo Kalgan' },
             { environment: { HORSE: 'Dorothy' } },
-            { environment: { FACTION: '2nd Foundation' } }
-          ]
+            { environment: { FACTION: '2nd Foundation' } },
+          ],
         })
       })
       // Form should close
diff --git a/tests/e2e/specs/header.cy.js b/tests/e2e/specs/header.cy.js
index 7e4841144..981a93900 100644
--- a/tests/e2e/specs/header.cy.js
+++ b/tests/e2e/specs/header.cy.js
@@ -35,8 +35,8 @@ describe('Header Component multiuser', () => {
           'read',
         ],
         mode: 'multi user',
-        owner: 'userTest'
-      }
+        owner: 'userTest',
+      },
     }).as('test-data-server-owner-input')
     cy.visit('/#/')
   })
diff --git a/tests/e2e/specs/mutation.cy.js b/tests/e2e/specs/mutation.cy.js
index 9988257e4..8fde669de 100644
--- a/tests/e2e/specs/mutation.cy.js
+++ b/tests/e2e/specs/mutation.cy.js
@@ -59,10 +59,10 @@ describe('Mutations component', () => {
       service.introspection = Promise.resolve({
         mutations,
         types: [],
-        queries: []
+        queries: [],
       })
       service.primaryMutations = {
-        workflow: ['workflowMutation']
+        workflow: ['workflowMutation'],
       }
     })
   }
@@ -79,9 +79,9 @@ describe('Mutations component', () => {
             data: {
               [req.body.operationName]: {
                 result: [true, {}],
-                __typename: upperFirst(req.body.operationName)
-              }
-            }
+                __typename: upperFirst(req.body.operationName),
+              },
+            },
           })
         }
       })
diff --git a/tests/e2e/specs/toolbar.cy.js b/tests/e2e/specs/toolbar.cy.js
index 331de5afe..ef4f251e5 100644
--- a/tests/e2e/specs/toolbar.cy.js
+++ b/tests/e2e/specs/toolbar.cy.js
@@ -51,10 +51,10 @@ describe('Toolbar Component authenticated user', () => {
         owner: 'user',
         permissions: [
           'read',
-          'write'
+          'write',
         ],
-        mode: 'single user'
-      }
+        mode: 'single user',
+      },
     }).as('test-data-server-owner-input')
     cy.visit('/#/workspace/one')
   })
diff --git a/tests/e2e/specs/url.cy.js b/tests/e2e/specs/url.cy.js
index 44885017c..e91b9f1e0 100644
--- a/tests/e2e/specs/url.cy.js
+++ b/tests/e2e/specs/url.cy.js
@@ -42,8 +42,8 @@ describe('URL handling', () => {
         username: 'user',
         permissions: [],
         mode: 'single user',
-        owner: 'user'
-      }
+        owner: 'user',
+      },
     })
     cy.visit('/#').get('#app')
     cy.url().should('contain', 'noAuth')
diff --git a/tests/e2e/support/graphql.js b/tests/e2e/support/graphql.js
index 7f1e55c00..f97ecceba 100644
--- a/tests/e2e/support/graphql.js
+++ b/tests/e2e/support/graphql.js
@@ -28,7 +28,7 @@ export function patchUserprofile () {
         'jobMutation',
         'namespaceMutation',
       ],
-    }
+    },
   })
 }
 
@@ -50,10 +50,10 @@ export const MUTATIONS = [
         name: 'workflow',
         type: {
           name: 'WorkflowID',
-          kind: null
-        }
-      }
-    ]
+          kind: null,
+        },
+      },
+    ],
   },
   {
     name: 'unauthorisedMutation',
@@ -66,10 +66,10 @@ export const MUTATIONS = [
         name: 'workflow',
         type: {
           name: 'WorkflowID',
-          kind: null
-        }
-      }
-    ]
+          kind: null,
+        },
+      },
+    ],
   },
   {
     name: 'cycleMutation',
@@ -79,17 +79,17 @@ export const MUTATIONS = [
         name: 'workflow',
         type: {
           name: 'WorkflowID',
-          kind: null
-        }
+          kind: null,
+        },
       },
       {
         name: 'cycle',
         type: {
           name: 'CyclePoint',
-          kind: null
-        }
-      }
-    ]
+          kind: null,
+        },
+      },
+    ],
   },
   {
     name: 'namespaceMutation',
@@ -99,17 +99,17 @@ export const MUTATIONS = [
         name: 'workflow',
         type: {
           name: 'WorkflowID',
-          kind: null
-        }
+          kind: null,
+        },
       },
       {
         name: 'namespace',
         type: {
           name: 'NamespaceName',
-          kind: null
-        }
-      }
-    ]
+          kind: null,
+        },
+      },
+    ],
   },
   {
     name: 'jobMutation',
@@ -119,16 +119,16 @@ export const MUTATIONS = [
         name: 'workflow',
         type: {
           name: 'WorkflowID',
-          kind: null
-        }
+          kind: null,
+        },
       },
       {
         name: 'job',
         type: {
           name: 'JobID',
-          kind: null
-        }
-      }
-    ]
-  }
+          kind: null,
+        },
+      },
+    ],
+  },
 ]
diff --git a/tests/unit/components/app.vue.spec.js b/tests/unit/components/app.vue.spec.js
index 3472fa337..6ffe25138 100644
--- a/tests/unit/components/app.vue.spec.js
+++ b/tests/unit/components/app.vue.spec.js
@@ -28,9 +28,9 @@ vi.mock('vue-router', () => ({
   useRoute: () => ({
     name: 'app',
     meta: {
-      layout: 'empty'
-    }
-  })
+      layout: 'empty',
+    },
+  }),
 }))
 
 describe('App', () => {
@@ -42,10 +42,10 @@ describe('App', () => {
           createStore(storeOptions),
         ],
         components: {
-          'empty-layout': Empty
+          'empty-layout': Empty,
         },
         stubs: ['router-view'],
-      }
+      },
     })
   }
 
@@ -65,18 +65,18 @@ describe('App', () => {
       value: true,
       expected: {
         transition: 'no',
-        ripple: false
-      }
+        ripple: false,
+      },
     },
     {
       value: false,
-      expected: {}
+      expected: {},
     },
   ])('applies reduced animation = $value from localStorage', ({ value, expected }) => {
     localStorage.setItem('reducedAnimation', value)
     const wrapper = mountFunction()
     expect(wrapper.vm.vuetifyDefaults).toMatchObject({
-      global: expected
+      global: expected,
     })
   })
 })
diff --git a/tests/unit/components/cylc/analysis/analysistable.vue.spec.js b/tests/unit/components/cylc/analysis/analysistable.vue.spec.js
index 65b91b0a9..3fb6a7623 100644
--- a/tests/unit/components/cylc/analysis/analysistable.vue.spec.js
+++ b/tests/unit/components/cylc/analysis/analysistable.vue.spec.js
@@ -37,7 +37,7 @@ describe('AnalysisTable component', () => {
         plugins: [vuetify],
         mocks: { $workflowService },
       },
-      ...options
+      ...options,
     })
   }
 
@@ -45,15 +45,15 @@ describe('AnalysisTable component', () => {
     const wrapper = mountFunction({
       props: {
         tasks: analysisTasks,
-        timingOption: 'total'
-      }
+        timingOption: 'total',
+      },
     })
 
     // check the the raw task data doesn't have the names in order
     expect(wrapper.vm.tasks.map((task) => task.name)).to.deep.equal([
       'succeeded',
       'eventually_succeeded',
-      'waiting'
+      'waiting',
     ])
 
     // check that the html have the names in alphabetical order
@@ -67,8 +67,8 @@ describe('AnalysisTable component', () => {
     const wrapper = mountFunction({
       props: {
         tasks: analysisTasks,
-        timingOption: 'total'
-      }
+        timingOption: 'total',
+      },
     })
     expect(wrapper.props().tasks[0].name).to.equal('succeeded')
     expect(wrapper.find('div')).to.not.equal(null)
@@ -79,8 +79,8 @@ describe('AnalysisTable component', () => {
       const wrapper = mountFunction({
         props: {
           tasks: analysisTasks,
-          timingOption: 'total'
-        }
+          timingOption: 'total',
+        },
       })
       expect(wrapper.vm.timingOption).to.equal('total')
       expect(wrapper.vm.tasks.length).to.equal(3)
@@ -95,8 +95,8 @@ describe('AnalysisTable component', () => {
       const wrapper = mountFunction({
         props: {
           tasks: analysisTasks,
-          timingOption: 'run'
-        }
+          timingOption: 'run',
+        },
       })
       expect(wrapper.vm.timingOption).to.equal('run')
       expect(wrapper.vm.tasks.length).to.equal(3)
@@ -111,8 +111,8 @@ describe('AnalysisTable component', () => {
       const wrapper = mountFunction({
         props: {
           tasks: analysisTasks,
-          timingOption: 'queue'
-        }
+          timingOption: 'queue',
+        },
       })
       expect(wrapper.vm.timingOption).to.equal('queue')
       expect(wrapper.vm.tasks.length).to.equal(3)
diff --git a/tests/unit/components/cylc/analysis/analysistimeseries.vue.spec.js b/tests/unit/components/cylc/analysis/analysistimeseries.vue.spec.js
index a4df9265e..9b6c10620 100644
--- a/tests/unit/components/cylc/analysis/analysistimeseries.vue.spec.js
+++ b/tests/unit/components/cylc/analysis/analysistimeseries.vue.spec.js
@@ -34,7 +34,7 @@ describe('TimeSeries component', () => {
         mocks: { $workflowService },
       },
       shallow: true,
-      ...options
+      ...options,
     })
   }
 
@@ -44,7 +44,7 @@ describe('TimeSeries component', () => {
         workflowIDs: ['one'],
         platformOption: -1,
         timingOption: 'total',
-      }
+      },
     })
 
     expect(wrapper.vm.jobs).to.deep.equal([])
@@ -59,7 +59,7 @@ describe('TimeSeries component', () => {
         workflowIDs: ['one'],
         platformOption: -1,
         timingOption: 'total',
-      }
+      },
     })
 
     // Retrieve job data and check that nothing is displayed
@@ -84,7 +84,7 @@ describe('TimeSeries component', () => {
         workflowIDs: ['one'],
         platformOption: -1,
         timingOption: 'total',
-      }
+      },
     })
 
     wrapper.vm.jobs = analysisJobs
@@ -98,14 +98,14 @@ describe('TimeSeries component', () => {
     )).to.deep.equal([
       '20240101T1200Z',
       '20240101T0000Z',
-      '20240102T0000Z'
+      '20240102T0000Z',
     ])
 
     // Check that cyclePoints is in order
     expect(wrapper.vm.cyclePoints).to.deep.equal([
       '20240101T0000Z',
       '20240101T1200Z',
-      '20240102T0000Z'
+      '20240102T0000Z',
     ])
     expect(wrapper.vm.series[0].data[0].x).to.equal('20240101T0000Z')
     expect(wrapper.vm.series[0].data[1].x).to.equal('20240101T1200Z')
@@ -118,7 +118,7 @@ describe('TimeSeries component', () => {
         workflowIDs: ['one'],
         platformOption: -1,
         timingOption: 'total',
-      }
+      },
     })
 
     wrapper.vm.jobs = analysisJobs
@@ -128,14 +128,14 @@ describe('TimeSeries component', () => {
     expect(wrapper.vm.cyclePoints).to.deep.equal([
       '20240101T0000Z',
       '20240101T1200Z',
-      '20240102T0000Z'
+      '20240102T0000Z',
     ])
 
     // waiting only has data on two of the cycle points
     wrapper.vm.displayedTasks = ['waiting']
     expect(wrapper.vm.cyclePoints).to.deep.equal([
       '20240101T0000Z',
-      '20240102T0000Z'
+      '20240102T0000Z',
     ])
   })
 
@@ -145,7 +145,7 @@ describe('TimeSeries component', () => {
         workflowIDs: ['one'],
         platformOption: -1,
         timingOption: 'total',
-      }
+      },
     })
 
     wrapper.vm.jobs = analysisJobs
@@ -161,7 +161,7 @@ describe('TimeSeries component', () => {
         workflowIDs: ['one'],
         platformOption: -1,
         timingOption: 'total',
-      }
+      },
     })
 
     wrapper.vm.jobs = analysisJobs
@@ -178,7 +178,7 @@ describe('TimeSeries component', () => {
         workflowIDs: ['one'],
         platformOption: -1,
         timingOption: 'total',
-      }
+      },
     })
 
     wrapper.vm.jobs = analysisJobs
diff --git a/tests/unit/components/cylc/analysis/filter.spec.js b/tests/unit/components/cylc/analysis/filter.spec.js
index 5de09a50c..d5ea8677d 100644
--- a/tests/unit/components/cylc/analysis/filter.spec.js
+++ b/tests/unit/components/cylc/analysis/filter.spec.js
@@ -17,13 +17,13 @@
 
 import {
   matchTask,
-  platformOptions
+  platformOptions,
 } from '@/components/cylc/analysis/filter'
 
 describe('matchTask', () => {
   const task = {
     name: 'task_name',
-    platform: 'task_platform'
+    platform: 'task_platform',
   }
 
   it('should match with default or matching filter values', () => {
@@ -31,7 +31,7 @@ describe('matchTask', () => {
       { name: [], platformOption: -1 },
       { name: ['task_name'], platformOption: -1 },
       { name: [], platformOption: 'task_platform' },
-      { name: ['task_name'], platformOption: 'task_platform' }
+      { name: ['task_name'], platformOption: 'task_platform' },
     ]
     filters.forEach(filter => {
       expect(matchTask(task, filter)).to.equal(true)
@@ -42,7 +42,7 @@ describe('matchTask', () => {
     const filters = [
       { name: ['task_name'], platformOption: 'wrong_platform' },
       { name: ['wrong_task'], platformOption: 'task_platform' },
-      { name: ['wrong_task'], platformOption: 'wrong_platform' }
+      { name: ['wrong_task'], platformOption: 'wrong_platform' },
     ]
     filters.forEach(filter => {
       expect(matchTask(task, filter)).to.equal(false)
@@ -55,12 +55,12 @@ describe('platformOptions', () => {
     const tasks = [
       { platform: 'platform_1' },
       { platform: 'platform_1' },
-      { platform: 'platform_2' }
+      { platform: 'platform_2' },
     ]
     const expected = [
       { title: 'All', value: -1 },
       { title: 'platform_1', value: 'platform_1' },
-      { title: 'platform_2', value: 'platform_2' }
+      { title: 'platform_2', value: 'platform_2' },
     ]
     expect(platformOptions([])).to.deep.equal([{ title: 'All', value: -1 }])
     expect(platformOptions(tasks)).to.deep.equal(expected)
diff --git a/tests/unit/components/cylc/commandMenu/menu.vue.spec.js b/tests/unit/components/cylc/commandMenu/menu.vue.spec.js
index b7a164b82..ab4b1416d 100644
--- a/tests/unit/components/cylc/commandMenu/menu.vue.spec.js
+++ b/tests/unit/components/cylc/commandMenu/menu.vue.spec.js
@@ -31,7 +31,7 @@ describe('Command menu', () => {
     const id = '~neil.armstrong/apollo//11/eagle'
     wrapper.vm.node = {
       id,
-      tokens: new Tokens(id)
+      tokens: new Tokens(id),
     }
     expect(wrapper.vm.title).toEqual('apollo//11/eagle')
   })
@@ -51,8 +51,8 @@ describe('Command menu', () => {
       {
         testID: 'workflow node',
         node: simpleWorkflowNode,
-        expected: undefined
-      }
+        expected: undefined,
+      },
     ])('$testID', ({ node, expected }) => {
       expect(getLogFileForNode(node)).toEqual(expected)
     })
diff --git a/tests/unit/components/cylc/common/SVGTask.vue.spec.js b/tests/unit/components/cylc/common/SVGTask.vue.spec.js
index 4cffa70b6..5e8c7879a 100644
--- a/tests/unit/components/cylc/common/SVGTask.vue.spec.js
+++ b/tests/unit/components/cylc/common/SVGTask.vue.spec.js
@@ -47,7 +47,7 @@ describe('modifier', () => {
           // switchedOn.map((modifier) => [modifier, true])
           switchedOn.map(mapper)
         ),
-      }
+      },
     })
     function mapper (key) {
       if (key === 'skip') {
diff --git a/tests/unit/components/cylc/common/estimatedTime.vue.spec.js b/tests/unit/components/cylc/common/estimatedTime.vue.spec.js
index 1b621d1fd..14b2b4fca 100644
--- a/tests/unit/components/cylc/common/estimatedTime.vue.spec.js
+++ b/tests/unit/components/cylc/common/estimatedTime.vue.spec.js
@@ -47,8 +47,8 @@ describe('Estimated Time component', () => {
     const wrapper = mount(EstimatedTime, {
       props,
       global: {
-        plugins: [createVuetify(vuetifyOptions)]
-      }
+        plugins: [createVuetify(vuetifyOptions)],
+      },
     })
     expect(wrapper.text()).toBe(expected)
   })
diff --git a/tests/unit/components/cylc/common/filter.spec.js b/tests/unit/components/cylc/common/filter.spec.js
index caaa41cc9..d923ab01e 100644
--- a/tests/unit/components/cylc/common/filter.spec.js
+++ b/tests/unit/components/cylc/common/filter.spec.js
@@ -146,7 +146,7 @@ describe('task filtering', () => {
       { glob: '\\w\\d\\s', regex: /\\w\\d\\s/ },
 
       // nasty
-      { glob: 'a*[bc]d[!ef]*g?h.*i(j)', regex: /a.*[bc]d[^ef].*g.h\..*i\(j\)/ }
+      { glob: 'a*[bc]d[!ef]*g?h.*i(j)', regex: /a.*[bc]d[^ef].*g.h\..*i\(j\)/ },
     ])('globToRegex($glob) => $regex', ({ glob, regex }) => {
       expect(String(globToRegex(glob))).toBe(String(regex))
     })
diff --git a/tests/unit/components/cylc/gantt/filter.spec.js b/tests/unit/components/cylc/gantt/filter.spec.js
index f54dce275..262cfedfd 100644
--- a/tests/unit/components/cylc/gantt/filter.spec.js
+++ b/tests/unit/components/cylc/gantt/filter.spec.js
@@ -17,7 +17,7 @@
 
 import {
   matchTasks,
-  platformOptions
+  platformOptions,
 } from '@/components/cylc/gantt/filter'
 
 describe('matchTasks', () => {
@@ -41,7 +41,7 @@ describe('matchTasks', () => {
       name: 'task3',
       platform: 'test_platform', // 2nd job submitted on different platform
       id: 'task3/02',
-    }
+    },
   ]
   const task4 = [{
     name: 'task4',
@@ -94,12 +94,12 @@ describe('platformOptions', () => {
     const tasks = {
       test_entry_1: [{ name: 'test_entry_1', platform: 'platform_1' }],
       test_entry_2: [{ name: 'test_entry_2', platform: 'platform_1' }],
-      test_entry_3: [{ name: 'test_entry_3', platform: 'platform_2' }]
+      test_entry_3: [{ name: 'test_entry_3', platform: 'platform_2' }],
     }
     const expected = [
       { title: 'All', value: -1 },
       { title: 'platform_1', value: 'platform_1' },
-      { title: 'platform_2', value: 'platform_2' }
+      { title: 'platform_2', value: 'platform_2' },
     ]
     expect(platformOptions([])).to.deep.equal([{ title: 'All', value: -1 }])
     expect(platformOptions(tasks)).to.deep.equal(expected)
diff --git a/tests/unit/components/cylc/gantt/ganttChart.vue.spec.js b/tests/unit/components/cylc/gantt/ganttChart.vue.spec.js
index 59b9c2e4d..0d837f4cf 100644
--- a/tests/unit/components/cylc/gantt/ganttChart.vue.spec.js
+++ b/tests/unit/components/cylc/gantt/ganttChart.vue.spec.js
@@ -28,7 +28,7 @@ const jobs = {
     submittedTime: '2023-02-23T11:10:09Z',
     startedTime: '2023-02-23T11:10:13Z',
     finishedTime: '2023-02-23T11:10:20Z',
-    platform: 'localhost'
+    platform: 'localhost',
   }],
   yet_another_test_job: [{
     name: 'yet_another_test_job',
@@ -36,8 +36,8 @@ const jobs = {
     submittedTime: '2023-02-23T11:10:21Z',
     startedTime: '2023-02-23T11:10:24Z',
     finishedTime: '2023-02-23T11:10:26Z',
-    platform: 'localhost'
-  }]
+    platform: 'localhost',
+  }],
 }
 
 const vuetify = createVuetify()
@@ -51,7 +51,7 @@ describe('GanttChart component', () => {
         mocks: { $workflowService },
       },
       shallow: true,
-      ...options
+      ...options,
     })
   }
 
@@ -62,22 +62,22 @@ describe('GanttChart component', () => {
     const wrapper = mountFunction({
       props: {
         jobs,
-      }
+      },
     })
 
     expect(wrapper.vm.series[0].data[0].y).to.deep.equal([
       expectedSubmittedTime,
-      expectedFinishedTime
+      expectedFinishedTime,
     ])
     await wrapper.setProps({ timingOption: 'queue' })
     expect(wrapper.vm.series[0].data[0].y).to.deep.equal([
       expectedSubmittedTime,
-      expectedStartedTime
+      expectedStartedTime,
     ])
     await wrapper.setProps({ timingOption: 'run' })
     expect(wrapper.vm.series[0].data[0].y).to.deep.equal([
       expectedStartedTime,
-      expectedFinishedTime
+      expectedFinishedTime,
     ])
   })
 })
diff --git a/tests/unit/components/cylc/gscan/gscan.vue.spec.js b/tests/unit/components/cylc/gscan/gscan.vue.spec.js
index f33108ffd..0fb678626 100644
--- a/tests/unit/components/cylc/gscan/gscan.vue.spec.js
+++ b/tests/unit/components/cylc/gscan/gscan.vue.spec.js
@@ -21,17 +21,17 @@ import GScan from '@/components/cylc/gscan/GScan.vue'
 import CommandMenuPlugin from '@/components/cylc/commandMenu/plugin'
 import {
   WorkflowState,
-  WorkflowStateOrder
+  WorkflowStateOrder,
 } from '@/model/WorkflowState.model'
 import TaskState from '@/model/TaskState.model'
 import {
   getWorkflowTreeSortValue,
-  sortedWorkflowTree
+  sortedWorkflowTree,
 } from '@/components/cylc/gscan/sort.js'
 
 import {
   TEST_TREE,
-  listTree
+  listTree,
 } from './utils'
 import { getIDMap } from '$tests/util'
 
@@ -56,7 +56,7 @@ describe('GScan component', () => {
           getWorkflowTreeSortValue({
             type: 'workflow',
             node: { status: workflowState.name },
-            children: []
+            children: [],
           })
         ).to.equal(WorkflowStateOrder.get(workflowState.name))
 
@@ -69,15 +69,15 @@ describe('GScan component', () => {
               {
                 type: 'workflow',
                 node: { status: workflowState.name },
-                children: []
+                children: [],
               },
               {
                 // a workflow with no state shouldn't mess with the sort order
                 type: 'workflow',
                 node: { status: undefined },
-                children: []
-              }
-            ]
+                children: [],
+              },
+            ],
           })
         ).to.equal(WorkflowStateOrder.get(workflowState.name))
       }
@@ -88,7 +88,7 @@ describe('GScan component', () => {
       expect(
         listTree(sortedWorkflowTree(TEST_TREE))
       ).to.deep.equal([
-        '~u/b', '~u/c', '~u/a/x1', '~u/a/x2'
+        '~u/b', '~u/c', '~u/a/x1', '~u/a/x2',
       ])
     })
   })
@@ -102,7 +102,7 @@ describe('GScan component', () => {
         workflowTree: TEST_TREE,
         isLoading: false,
       },
-      ...options
+      ...options,
     })
 
     it('has null filterState when filters are empty', async () => {
@@ -117,7 +117,7 @@ describe('GScan component', () => {
         filters: {
           'workflow state': [],
           'task state': [],
-        }
+        },
       })
       expect(wrapper.vm.filterState).toBeNull()
     })
@@ -160,7 +160,7 @@ describe('GScan component', () => {
           'workflow state': [
             WorkflowState.STOPPING.name,
             WorkflowState.STOPPED.name,
-          ]
+          ],
         },
       })
       filterNodes(wrapper, filteredOutNodesCache)
@@ -203,7 +203,7 @@ describe('GScan component', () => {
       const filteredOutNodesCache = new Map()
 
       await wrapper.setData({
-        filters: { 'task state': [TaskState.RUNNING.name] }
+        filters: { 'task state': [TaskState.RUNNING.name] },
       })
       filterNodes(wrapper, filteredOutNodesCache)
       expect(getIDMap(filteredOutNodesCache)).toEqual({
@@ -215,7 +215,7 @@ describe('GScan component', () => {
       })
 
       await wrapper.setData({
-        filters: { 'task state': [TaskState.SUBMITTED.name] }
+        filters: { 'task state': [TaskState.SUBMITTED.name] },
       })
       filterNodes(wrapper, filteredOutNodesCache)
       expect(getIDMap(filteredOutNodesCache)).toEqual({
diff --git a/tests/unit/components/cylc/gscan/sort.spec.js b/tests/unit/components/cylc/gscan/sort.spec.js
index a22fdf9d3..20fd4b68c 100644
--- a/tests/unit/components/cylc/gscan/sort.spec.js
+++ b/tests/unit/components/cylc/gscan/sort.spec.js
@@ -51,9 +51,9 @@ describe('flattenWorkflowParts()', () => {
           type: 'workflow-part',
           name: 'dark/place',
           parent: '~awake/dark',
-          children: [run1, run2]
-        }
-      ]
+          children: [run1, run2],
+        },
+      ],
     }
     expect(flattenWorkflowParts(node)).toStrictEqual({
       ...node.children[0],
@@ -73,9 +73,9 @@ describe('flattenWorkflowParts()', () => {
           type: 'workflow-part',
           name: 'dark/place',
           parent: '~awake/dark',
-          children: [run1]
-        }
-      ]
+          children: [run1],
+        },
+      ],
     })).toStrictEqual({
       ...run1,
       parent: '~awake',
@@ -94,7 +94,7 @@ describe('flattenWorkflowParts()', () => {
           type: 'workflow-part',
           name: 'dark/place',
           parent: '~awake/dark',
-          children: [run1]
+          children: [run1],
         },
         {
           id: '~awake/dark/presence',
@@ -104,9 +104,9 @@ describe('flattenWorkflowParts()', () => {
           children: [
             { type: 'workflow', id: 'barry' },
             { type: 'workflow', id: 'stucky' },
-          ]
-        }
-      ]
+          ],
+        },
+      ],
     }
     const result = flattenWorkflowParts(node)
     expect(result).toStrictEqual({
@@ -120,8 +120,8 @@ describe('flattenWorkflowParts()', () => {
           name: 'place/run1',
           parent: '~awake/dark',
         },
-        node.children[1]
-      ]
+        node.children[1],
+      ],
     })
   })
 
diff --git a/tests/unit/components/cylc/gscan/utils.js b/tests/unit/components/cylc/gscan/utils.js
index aaa6fd976..a8335a36f 100644
--- a/tests/unit/components/cylc/gscan/utils.js
+++ b/tests/unit/components/cylc/gscan/utils.js
@@ -56,7 +56,7 @@ export const TEST_TREE = {
                 status: WorkflowState.STOPPED.name,
                 stateTotals: SUBMIT_FAILED_STATE_TOTALS,
                 latestStateTasks: [],
-              }
+              },
             },
             {
               id: '~u/a/x2',
@@ -66,9 +66,9 @@ export const TEST_TREE = {
               node: {
                 status: WorkflowState.STOPPED.name,
                 latestStateTasks: [],
-              }
-            }
-          ]
+              },
+            },
+          ],
         },
         {
           id: '~u/b',
@@ -79,7 +79,7 @@ export const TEST_TREE = {
             status: WorkflowState.STOPPING.name,
             stateTotals: RUNNING_STATE_TOTALS,
             latestStateTasks: [],
-          }
+          },
         },
         {
           id: '~u/c',
@@ -90,11 +90,11 @@ export const TEST_TREE = {
             status: WorkflowState.RUNNING.name,
             stateTotals: SUBMITTED_STATE_TOTALS,
             latestStateTasks: [],
-          }
-        }
-      ]
-    }
-  ]
+          },
+        },
+      ],
+    },
+  ],
 }
 
 /**
diff --git a/tests/unit/components/cylc/gscan/workflowicon.spec.js b/tests/unit/components/cylc/gscan/workflowicon.spec.js
index be4226129..0497f1981 100644
--- a/tests/unit/components/cylc/gscan/workflowicon.spec.js
+++ b/tests/unit/components/cylc/gscan/workflowicon.spec.js
@@ -27,20 +27,20 @@ describe('WorkflowIcon', () => {
   it.each([
     {
       status: '',
-      expected: mdiHelpCircle
+      expected: mdiHelpCircle,
     },
     {
       status: WorkflowState.STOPPED.name,
-      expected: WorkflowState.STOPPED.icon
+      expected: WorkflowState.STOPPED.icon,
     },
   ])('uses the right icon for state: $status', ({ status, expected }) => {
     const wrapper = shallowMount(WorkflowIcon, {
       global: {
-        plugins: [vuetify]
+        plugins: [vuetify],
       },
       props: {
         status,
-      }
+      },
     })
     expect(wrapper.vm.getIcon()).to.equal(expected)
   })
diff --git a/tests/unit/components/cylc/job.vue.spec.js b/tests/unit/components/cylc/job.vue.spec.js
index 6a0113b62..90546e5de 100644
--- a/tests/unit/components/cylc/job.vue.spec.js
+++ b/tests/unit/components/cylc/job.vue.spec.js
@@ -23,8 +23,8 @@ describe('Job component', () => {
     const wrapper = mount(Job, {
       props: {
         status: '',
-        multiple: false
-      }
+        multiple: false,
+      },
     })
     expect(wrapper.element.className).to.equal('c-job')
     expect(wrapper.get('.job').element.childElementCount).to.equal(1)
@@ -33,8 +33,8 @@ describe('Job component', () => {
     const wrapper = mount(Job, {
       props: {
         status: 'failed',
-        'previous-state': 'submit-failed'
-      }
+        'previous-state': 'submit-failed',
+      },
     })
     // The shadow is added as an extra child element for the Job SVG (two rects).
     expect(wrapper.get('.job').element.childElementCount).to.equal(2)
diff --git a/tests/unit/components/cylc/mutation.vue.spec.js b/tests/unit/components/cylc/mutation.vue.spec.js
index 751c560ee..d47e97da5 100644
--- a/tests/unit/components/cylc/mutation.vue.spec.js
+++ b/tests/unit/components/cylc/mutation.vue.spec.js
@@ -30,18 +30,18 @@ const BASIC_MUTATION = {
       defaultValue: '"MyDefault"',
       type: {
         name: 'String',
-        kind: 'SCALAR'
-      }
+        kind: 'SCALAR',
+      },
     },
     {
       name: 'MyInteger',
       type: {
         name: 'Int',
-        kind: 'SCALAR'
-      }
-    }
+        kind: 'SCALAR',
+      },
+    },
   ],
-  _title: 'My Mutation'
+  _title: 'My Mutation',
 }
 
 describe('Mutation Component', () => {
@@ -53,9 +53,9 @@ describe('Mutation Component', () => {
     const vuetify = createVuetify()
     return mount(Mutation, {
       global: {
-        plugins: [vuetify]
+        plugins: [vuetify],
       },
-      ...options
+      ...options,
     })
   }
 
@@ -66,8 +66,8 @@ describe('Mutation Component', () => {
           cylcObject,
           mutation: BASIC_MUTATION,
         },
-        cancel: () => {}
-      }
+        cancel: () => {},
+      },
     })
     const html = wrapper.html()
     expect(html).to.contain('My Mutation')
@@ -83,11 +83,11 @@ describe('Mutation Component', () => {
             name: 'Darmok',
             description: desc,
             args: [],
-            _title: 'Darmok'
+            _title: 'Darmok',
           },
         },
-        cancel: () => {}
-      }
+        cancel: () => {},
+      },
     })
     describe('For a single line description', () => {
       const desc = 'Lorem ipsum.'
diff --git a/tests/unit/components/cylc/table/table.data.js b/tests/unit/components/cylc/table/table.data.js
index f51dc8276..591243697 100644
--- a/tests/unit/components/cylc/table/table.data.js
+++ b/tests/unit/components/cylc/table/table.data.js
@@ -21,7 +21,7 @@ import { Tokens } from '@/utils/uid'
 const tk = {
   taskA: new Tokens('~cylc/workflow//20000101T0000Z/taskA'),
   taskB: new Tokens('~cylc/workflow//20000102T0000Z/taskB'),
-  taskC: new Tokens('~cylc/workflow//20000103T0000Z/taskC')
+  taskC: new Tokens('~cylc/workflow//20000103T0000Z/taskC'),
 }
 
 export const simpleTableTasks = [
@@ -49,11 +49,11 @@ export const simpleTableTasks = [
             submittedTime: new Date().toISOString(),
             startedTime: new Date().toISOString(),
             finishedTime: null,
-            state: JobState.RUNNING.name
+            state: JobState.RUNNING.name,
           },
-          children: []
-        }
-      ]
+          children: [],
+        },
+      ],
     },
     latestJob: {
       id: tk.taskA.clone({ job: '01' }).id,
@@ -66,11 +66,11 @@ export const simpleTableTasks = [
         submittedTime: new Date().toISOString(),
         startedTime: new Date().toISOString(),
         finishedTime: null,
-        state: JobState.RUNNING.name
+        state: JobState.RUNNING.name,
       },
-      children: []
+      children: [],
     },
-    previousJob: null
+    previousJob: null,
   },
   {
     task: {
@@ -82,10 +82,10 @@ export const simpleTableTasks = [
         state: TaskState.WAITING.name,
         name: 'taskB',
       },
-      children: []
+      children: [],
     },
     latestJob: null,
-    previousJob: null
+    previousJob: null,
   },
   {
     task: {
@@ -97,9 +97,9 @@ export const simpleTableTasks = [
         state: TaskState.SUBMITTED.name,
         name: 'taskC',
       },
-      children: []
+      children: [],
     },
     latestJob: null,
-    previousJob: null
-  }
+    previousJob: null,
+  },
 ]
diff --git a/tests/unit/components/cylc/table/table.vue.spec.js b/tests/unit/components/cylc/table/table.vue.spec.js
index 1d9ad60c6..c4162609f 100644
--- a/tests/unit/components/cylc/table/table.vue.spec.js
+++ b/tests/unit/components/cylc/table/table.vue.spec.js
@@ -36,17 +36,17 @@ describe('Table component', () => {
     global: {
       plugins: [vuetify, CommandMenuPlugin],
       mocks: {
-        $workflowService
-      }
+        $workflowService,
+      },
     },
-    ...options
+    ...options,
   })
 
   it('should sort cycle point column descending by default', async () => {
     const wrapper = mountFunction({
       props: {
-        tasks: simpleTableTasks
-      }
+        tasks: simpleTableTasks,
+      },
     })
     // check the the raw task data has the cycle points from lowest to highest
     expect(wrapper.vm.tasks[wrapper.vm.tasks.length - 1].task.tokens.cycle).to.equal('20000103T0000Z')
@@ -61,8 +61,8 @@ describe('Table component', () => {
   it('should display the table with valid data', () => {
     const wrapper = mountFunction({
       props: {
-        tasks: simpleTableTasks
-      }
+        tasks: simpleTableTasks,
+      },
     })
     expect(wrapper.props().tasks[0].task.name).to.equal('taskA')
     expect(wrapper.find('div')).to.not.equal(null)
@@ -76,11 +76,11 @@ describe('Table component', () => {
       localStorage.setItem('cyclePointsOrderDesc', cyclePointsOrderDesc)
       const wrapper = mountFunction({
         props: {
-          tasks: simpleTableTasks
-        }
+          tasks: simpleTableTasks,
+        },
       })
       expect(wrapper.vm.sortBy).toMatchObject([
-        { order: expected }
+        { order: expected },
       ])
     })
 
@@ -108,9 +108,9 @@ describe('Table component', () => {
           props: {
             tasks: [],
             initialOptions: {
-              sortBy: [{ key, order }]
-            }
-          }
+              sortBy: [{ key, order }],
+            },
+          },
         })
         const comparator = (x, y) => {
           return order === 'asc' ? x.localeCompare(y) : y.localeCompare(x)
diff --git a/tests/unit/components/cylc/toolbar.vue.spec.js b/tests/unit/components/cylc/toolbar.vue.spec.js
index a615d3617..701ea9c31 100644
--- a/tests/unit/components/cylc/toolbar.vue.spec.js
+++ b/tests/unit/components/cylc/toolbar.vue.spec.js
@@ -24,10 +24,10 @@ import storeOptions from '@/store/options'
 
 describe('Toolbar component', () => {
   const vuetify = createVuetify({
-    display: {}
+    display: {},
   })
   const $route = {
-    name: 'testRoute'
+    name: 'testRoute',
   }
   let store
   let mountFunction
@@ -37,16 +37,16 @@ describe('Toolbar component', () => {
     mountFunction = () => mount(Toolbar, {
       global: {
         plugins: [vuetify, store],
-        mocks: { $route }
-      }
+        mocks: { $route },
+      },
     })
 
     store.state.workflows.workflows = [
       {
         id: 'user/id',
         name: 'test',
-        status: WorkflowState.RUNNING.name
-      }
+        status: WorkflowState.RUNNING.name,
+      },
     ]
   })
 
diff --git a/tests/unit/components/cylc/tree/tree.data.js b/tests/unit/components/cylc/tree/tree.data.js
index 331c5abaf..f6f3cb34f 100644
--- a/tests/unit/components/cylc/tree/tree.data.js
+++ b/tests/unit/components/cylc/tree/tree.data.js
@@ -25,7 +25,7 @@ export const stateTotalsTestWorkflowNodes = {
   id: '~cylc/double',
   name: 'double',
   node: {
-    id: '~cylc/double'
+    id: '~cylc/double',
   },
   parent: '~cylc',
   tokens: {
@@ -33,7 +33,7 @@ export const stateTotalsTestWorkflowNodes = {
     workflow: 'double',
     id: '~cylc/double',
     workflowID: '~cylc/double',
-    relativeID: ''
+    relativeID: '',
   },
   type: 'workflow-part',
   children: [
@@ -41,7 +41,7 @@ export const stateTotalsTestWorkflowNodes = {
       id: '~cylc/double/mid',
       name: 'mid',
       node: {
-        id: '~cylc/double/mid'
+        id: '~cylc/double/mid',
       },
       parent: '~cylc/double',
       tokens: {
@@ -49,7 +49,7 @@ export const stateTotalsTestWorkflowNodes = {
         workflow: 'double/mid',
         id: '~cylc/double/mid',
         workflowID: '~cylc/double/mid',
-        relativeID: ''
+        relativeID: '',
       },
       type: 'workflow-part',
       children: [
@@ -57,7 +57,7 @@ export const stateTotalsTestWorkflowNodes = {
           id: '~cylc/double/mid/first',
           name: 'first',
           node: {
-            id: '~cylc/double/mid/first'
+            id: '~cylc/double/mid/first',
           },
           parent: '~cylc/double/mid',
           tokens: {
@@ -65,7 +65,7 @@ export const stateTotalsTestWorkflowNodes = {
             workflow: 'double/mid/first',
             id: '~cylc/double/mid/first',
             workflowID: '~cylc/double/mid/first',
-            relativeID: ''
+            relativeID: '',
           },
           type: 'workflow-part',
           children: [
@@ -76,7 +76,7 @@ export const stateTotalsTestWorkflowNodes = {
                 workflow: 'double/mid/first/run1',
                 id: '~cylc/double/mid/first/run1',
                 workflowID: '~cylc/double/mid/first/run1',
-                relativeID: ''
+                relativeID: '',
               },
               name: 'run1',
               type: 'workflow',
@@ -96,7 +96,7 @@ export const stateTotalsTestWorkflowNodes = {
                   submitted: 3,
                   running: 6,
                   failed: 0,
-                  succeeded: 0
+                  succeeded: 0,
                 },
                 latestStateTasks: {
                   failed: [],
@@ -105,7 +105,7 @@ export const stateTotalsTestWorkflowNodes = {
                     '2022-03-15/prep',
                     '2022-03-15/get-data',
                     '2022-03-16/get-data',
-                    '2022-03-17/get-data'
+                    '2022-03-17/get-data',
                   ],
                   'submit-failed': [],
                   submitted: [
@@ -113,29 +113,29 @@ export const stateTotalsTestWorkflowNodes = {
                     '2022-03-18/get-data',
                     '2022-03-17/get-data',
                     '2022-03-16/get-data',
-                    '2022-03-15/prep'
+                    '2022-03-15/prep',
                   ],
                   running: [
                     '2022-03-17/get-data',
                     '2022-03-19/get-data',
                     '2022-03-18/get-data',
                     '2022-03-16/get-data',
-                    '2022-03-15/get-data'
-                  ]
+                    '2022-03-15/get-data',
+                  ],
                 },
-                __typename: 'Workflow'
+                __typename: 'Workflow',
               },
               children: [],
               $edges: [],
-              $namespaces: []
-            }
-          ]
+              $namespaces: [],
+            },
+          ],
         },
         {
           id: '~cylc/double/mid/second',
           name: 'second',
           node: {
-            id: '~cylc/double/mid/second'
+            id: '~cylc/double/mid/second',
           },
           parent: '~cylc/double/mid',
           tokens: {
@@ -143,7 +143,7 @@ export const stateTotalsTestWorkflowNodes = {
             workflow: 'double/mid/second',
             id: '~cylc/double/mid/second',
             workflowID: '~cylc/double/mid/second',
-            relativeID: ''
+            relativeID: '',
           },
           type: 'workflow-part',
           children: [
@@ -154,7 +154,7 @@ export const stateTotalsTestWorkflowNodes = {
                 workflow: 'double/mid/second/run1',
                 id: '~cylc/double/mid/second/run1',
                 workflowID: '~cylc/double/mid/second/run1',
-                relativeID: ''
+                relativeID: '',
               },
               name: 'run1',
               type: 'workflow',
@@ -174,7 +174,7 @@ export const stateTotalsTestWorkflowNodes = {
                   submitted: 2,
                   running: 6,
                   failed: 0,
-                  succeeded: 0
+                  succeeded: 0,
                 },
                 latestStateTasks: {
                   failed: [],
@@ -183,7 +183,7 @@ export const stateTotalsTestWorkflowNodes = {
                     '2022-01-15/prep',
                     '2022-01-15/get-data',
                     '2022-01-16/get-data',
-                    '2022-01-17/get-data'
+                    '2022-01-17/get-data',
                   ],
                   'submit-failed': [],
                   submitted: [
@@ -191,27 +191,27 @@ export const stateTotalsTestWorkflowNodes = {
                     '2022-01-18/get-data',
                     '2022-01-17/get-data',
                     '2022-01-16/get-data',
-                    '2022-01-15/prep'
+                    '2022-01-15/prep',
                   ],
                   running: [
                     '2022-01-19/get-data',
                     '2022-01-18/get-data',
                     '2022-01-17/get-data',
                     '2022-01-15/prep',
-                    '2022-01-16/get-data'
-                  ]
+                    '2022-01-16/get-data',
+                  ],
                 },
-                __typename: 'Workflow'
+                __typename: 'Workflow',
               },
               children: [],
               $edges: [],
-              $namespaces: []
-            }
-          ]
-        }
-      ]
-    }
-  ]
+              $namespaces: [],
+            },
+          ],
+        },
+      ],
+    },
+  ],
 }
 
 export const simpleWorkflowTree4Nodes = [
@@ -224,8 +224,8 @@ export const simpleWorkflowTree4Nodes = [
       __typename: 'Workflow',
       state: 'running',
       node: {
-        status: 'running'
-      }
+        status: 'running',
+      },
     },
     children: [
       {
@@ -235,7 +235,7 @@ export const simpleWorkflowTree4Nodes = [
         type: 'cycle',
         node: {
           __typename: 'CyclePoint',
-          state: 'failed'
+          state: 'failed',
         },
         children: ['stub'],
         familyTree: [
@@ -245,7 +245,7 @@ export const simpleWorkflowTree4Nodes = [
             tokens: new Tokens('~user/workflow1//20100101T0000Z/root'),
             type: 'family',
             node: {
-              state: 'failed'
+              state: 'failed',
             },
             children: [
               {
@@ -255,7 +255,7 @@ export const simpleWorkflowTree4Nodes = [
                 type: 'task',
                 node: {
                   __typename: 'TaskProxy',
-                  state: 'failed'
+                  state: 'failed',
                 },
                 children: [
                   {
@@ -268,9 +268,9 @@ export const simpleWorkflowTree4Nodes = [
                       startedTime: '2019-08-19T22:51:06Z',
                       state: 'submit-failed',
                       submitNum: 2,
-                      customOutputs: []
+                      customOutputs: [],
                     },
-                    children: []
+                    children: [],
                   },
                   {
                     id: '~user/workflow1//20100101T0000Z/foo/01',
@@ -285,20 +285,20 @@ export const simpleWorkflowTree4Nodes = [
                       customOutputs: [
                         {
                           label: 'out1',
-                          message: 'Aliquam a lectus euismod, vehicula leo vel, ultricies odio.'
-                        }
-                      ]
+                          message: 'Aliquam a lectus euismod, vehicula leo vel, ultricies odio.',
+                        },
+                      ],
                     },
-                    children: []
-                  }
-                ]
-              }
-            ]
-          }
-        ]
-      }
-    ]
-  }
+                    children: [],
+                  },
+                ],
+              },
+            ],
+          },
+        ],
+      },
+    ],
+  },
 ]
 
 export const simpleWorkflowNode = simpleWorkflowTree4Nodes[0]
@@ -313,19 +313,19 @@ export const sampleWorkflow1 = {
     status: 'running',
     owner: 'cylc',
     host: 'ranma',
-    port: 43066
+    port: 43066,
   },
   cyclePoints: [
     {
       __typename: 'FamilyProxy',
       id: '~cylc/one//20000101T0000Z/root',
-      cyclePoint: '20000101T0000Z'
+      cyclePoint: '20000101T0000Z',
     },
     {
       __typename: 'FamilyProxy',
       id: '~cylc/one//20000102T0000Z/root',
-      cyclePoint: '20000102T0000Z'
-    }
+      cyclePoint: '20000102T0000Z',
+    },
   ],
   familyProxies: [
     {
@@ -339,8 +339,8 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'succeeded',
         name: 'GOOD',
-        cyclePoint: '20000101T0000Z'
-      }
+        cyclePoint: '20000101T0000Z',
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/BAD',
@@ -353,8 +353,8 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'root',
-        cyclePoint: '20000101T0000Z'
-      }
+        cyclePoint: '20000101T0000Z',
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/GOOD',
@@ -367,8 +367,8 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'root',
-        cyclePoint: '20000101T0000Z'
-      }
+        cyclePoint: '20000101T0000Z',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/SUCCEEDED',
@@ -381,8 +381,8 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'succeeded',
         name: 'GOOD',
-        cyclePoint: '20000102T0000Z'
-      }
+        cyclePoint: '20000102T0000Z',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/GOOD',
@@ -395,8 +395,8 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'root',
-        cyclePoint: '20000102T0000Z'
-      }
+        cyclePoint: '20000102T0000Z',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/BAD',
@@ -409,9 +409,9 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         name: 'root',
         cyclePoint: '20000102T0000Z',
-        state: 'failed'
-      }
-    }
+        state: 'failed',
+      },
+    },
   ],
   taskProxies: [
     {
@@ -425,13 +425,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'succeeded',
         name: 'SUCCEEDED',
-        cyclePoint: '20000101T0000Z'
+        cyclePoint: '20000101T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 0.5,
-        name: 'eventually_succeeded'
-      }
+        name: 'eventually_succeeded',
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/sleepy',
@@ -443,13 +443,13 @@ export const sampleWorkflow1 = {
         id: '~cylc/one//20000101T0000Z/root',
         state: 'failed',
         name: 'root',
-        cyclePoint: '20000101T0000Z'
+        cyclePoint: '20000101T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 1.0,
-        name: 'sleepy'
-      }
+        name: 'sleepy',
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/succeeded',
@@ -462,13 +462,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'succeeded',
         name: 'SUCCEEDED',
-        cyclePoint: '20000101T0000Z'
+        cyclePoint: '20000101T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 1.0,
-        name: 'succeeded'
-      }
+        name: 'succeeded',
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/retrying',
@@ -481,13 +481,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'BAD',
-        cyclePoint: '20000101T0000Z'
+        cyclePoint: '20000101T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 0.0,
-        name: 'retrying'
-      }
+        name: 'retrying',
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/checkpoint',
@@ -500,13 +500,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'root',
-        cyclePoint: '20000101T0000Z'
+        cyclePoint: '20000101T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 7.0,
-        name: 'checkpoint'
-      }
+        name: 'checkpoint',
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/failed',
@@ -519,13 +519,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'BAD',
-        cyclePoint: '20000101T0000Z'
+        cyclePoint: '20000101T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 0.0,
-        name: 'failed'
-      }
+        name: 'failed',
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/waiting',
@@ -538,13 +538,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'root',
-        cyclePoint: '20000101T0000Z'
+        cyclePoint: '20000101T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 1.0,
-        name: 'waiting'
-      }
+        name: 'waiting',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/sleepy',
@@ -557,13 +557,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'root',
-        cyclePoint: '20000102T0000Z'
+        cyclePoint: '20000102T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 1.0,
-        name: 'sleepy'
-      }
+        name: 'sleepy',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/succeeded',
@@ -576,13 +576,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'succeeded',
         name: 'SUCCEEDED',
-        cyclePoint: '20000102T0000Z'
+        cyclePoint: '20000102T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 1.0,
-        name: 'succeeded'
-      }
+        name: 'succeeded',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/failed',
@@ -595,13 +595,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'BAD',
-        cyclePoint: '20000102T0000Z'
+        cyclePoint: '20000102T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 0.0,
-        name: 'failed'
-      }
+        name: 'failed',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/waiting',
@@ -614,13 +614,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'root',
-        cyclePoint: '20000102T0000Z'
+        cyclePoint: '20000102T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 1.0,
-        name: 'waiting'
-      }
+        name: 'waiting',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/checkpoint',
@@ -633,13 +633,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'root',
-        cyclePoint: '20000102T0000Z'
+        cyclePoint: '20000102T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 7.0,
-        name: 'checkpoint'
-      }
+        name: 'checkpoint',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/checkpoint2',
@@ -652,13 +652,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'root',
-        cyclePoint: '20000102T0000Z'
+        cyclePoint: '20000102T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 0.0,
-        name: 'checkpoint2'
-      }
+        name: 'checkpoint2',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/eventually_succeeded',
@@ -671,13 +671,13 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'succeeded',
         name: 'SUCCEEDED',
-        cyclePoint: '20000102T0000Z'
+        cyclePoint: '20000102T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 0.5,
-        name: 'eventually_succeeded'
-      }
+        name: 'eventually_succeeded',
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/retrying',
@@ -690,14 +690,14 @@ export const sampleWorkflow1 = {
         __typename: 'FamilyProxy',
         state: 'failed',
         name: 'BAD',
-        cyclePoint: '20000102T0000Z'
+        cyclePoint: '20000102T0000Z',
       },
       task: {
         __typename: 'Task',
         meanElapsedTime: 0.0,
-        name: 'retrying'
-      }
-    }
+        name: 'retrying',
+      },
+    },
   ],
   jobs: [
     {
@@ -705,7 +705,7 @@ export const sampleWorkflow1 = {
       name: '04',
       firstParent: {
         id: '~cylc/one//20000101T0000Z/eventually_succeeded',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -720,29 +720,29 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'succeeded',
-            message: 'succeeded'
+            message: 'succeeded',
           },
           {
             label: 'out1',
-            message: 'Aliquam a lectus euismod, vehicula leo vel, ultricies odio.'
-          }
-        ]
-      }
+            message: 'Aliquam a lectus euismod, vehicula leo vel, ultricies odio.',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/eventually_succeeded/03',
       name: '03',
       firstParent: {
         id: '~cylc/one//20000101T0000Z/eventually_succeeded',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -757,25 +757,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'failed',
-            message: 'failed'
-          }
-        ]
-      }
+            message: 'failed',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/eventually_succeeded/02',
       name: '02',
       firstParent: {
         id: '~cylc/one//20000101T0000Z/eventually_succeeded',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -790,25 +790,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'succeeded',
-            message: 'succeeded'
-          }
-        ]
-      }
+            message: 'succeeded',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/eventually_succeeded/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000101T0000Z/eventually_succeeded',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -823,25 +823,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'failed',
-            message: 'failed'
-          }
-        ]
-      }
+            message: 'failed',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/sleepy/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000101T0000Z/sleepy',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -856,25 +856,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'succeeded',
-            message: 'succeeded'
-          }
-        ]
-      }
+            message: 'succeeded',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/succeeded/1',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000101T0000Z/succeeded',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -889,25 +889,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'succeeded',
-            message: 'succeeded'
-          }
-        ]
-      }
+            message: 'succeeded',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/retrying/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000101T0000Z/retrying',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -922,25 +922,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'failed',
-            message: 'failed'
-          }
-        ]
-      }
+            message: 'failed',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/checkpoint/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000101T0000Z/checkpoint',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -955,25 +955,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'succeeded',
-            message: 'succeeded'
-          }
-        ]
-      }
+            message: 'succeeded',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/failed/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000101T0000Z/failed',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -988,25 +988,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'failed',
-            message: 'failed'
-          }
-        ]
-      }
+            message: 'failed',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000101T0000Z/waiting/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000101T0000Z/waiting',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -1021,25 +1021,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'succeeded',
-            message: 'succeeded'
-          }
-        ]
-      }
+            message: 'succeeded',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/succeeded/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000102T0000Z/succeeded',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -1054,25 +1054,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'succeeded',
-            message: 'succeeded'
-          }
-        ]
-      }
+            message: 'succeeded',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/failed/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000102T0000Z/failed',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -1087,25 +1087,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'failed',
-            message: 'failed'
-          }
-        ]
-      }
+            message: 'failed',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/checkpoint/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000102T0000Z/checkpoint',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -1120,25 +1120,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'failed',
-            message: 'failed'
-          }
-        ]
-      }
+            message: 'failed',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/checkpoint2/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000102T0000Z/checkpoint2',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'TaskProxy',
       jobRunnerName: 'background',
@@ -1153,21 +1153,21 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
-          }
-        ]
-      }
+            message: 'started',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/eventually_succeeded/04',
       name: '04',
       firstParent: {
         id: '~cylc/one//20000102T0000Z/eventually_succeeded',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -1182,25 +1182,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'succeeded',
-            message: 'succeeded'
-          }
-        ]
-      }
+            message: 'succeeded',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/eventually_succeeded/03',
       name: '03',
       firstParent: {
         id: '~cylc/one//20000102T0000Z/eventually_succeeded',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -1215,25 +1215,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'failed',
-            message: 'failed'
-          }
-        ]
-      }
+            message: 'failed',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/eventually_succeeded/02',
       name: '02',
       firstParent: {
         id: '~cylc/one//20000102T0000Z/eventually_succeeded',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -1248,25 +1248,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'failed',
-            message: 'failed'
-          }
-        ]
-      }
+            message: 'failed',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/eventually_succeeded/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000102T0000Z/eventually_succeeded',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -1281,25 +1281,25 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'failed',
-            message: 'failed'
-          }
-        ]
-      }
+            message: 'failed',
+          },
+        ],
+      },
     },
     {
       id: '~cylc/one//20000102T0000Z/retrying/01',
       name: '01',
       firstParent: {
         id: '~cylc/one//20000102T0000Z/retrying',
-        __typename: 'TaskProxy'
+        __typename: 'TaskProxy',
       },
       __typename: 'Job',
       jobRunnerName: 'background',
@@ -1314,18 +1314,18 @@ export const sampleWorkflow1 = {
         outputs: [
           {
             label: 'submitted',
-            message: 'submitted'
+            message: 'submitted',
           },
           {
             label: 'started',
-            message: 'started'
+            message: 'started',
           },
           {
             label: 'failed',
-            message: 'failed'
-          }
-        ]
-      }
-    }
-  ]
+            message: 'failed',
+          },
+        ],
+      },
+    },
+  ],
 }
diff --git a/tests/unit/components/cylc/tree/treeitem.vue.spec.js b/tests/unit/components/cylc/tree/treeitem.vue.spec.js
index b7ca95c48..e4eade515 100644
--- a/tests/unit/components/cylc/tree/treeitem.vue.spec.js
+++ b/tests/unit/components/cylc/tree/treeitem.vue.spec.js
@@ -26,7 +26,7 @@ import {
   stateTotalsTestWorkflowNodes,
   simpleWorkflowNode,
   simpleCyclepointNode,
-  simpleTaskNode
+  simpleTaskNode,
 } from './tree.data'
 import CommandMenuPlugin from '@/components/cylc/commandMenu/plugin'
 import WorkflowService from '@/services/workflow.service'
@@ -61,9 +61,9 @@ describe('TreeItem component', () => {
   const mountFunction = (options) => mount(TreeItem, {
     global: {
       plugins: [createVuetify(), CommandMenuPlugin],
-      mock: { $workflowService }
+      mock: { $workflowService },
     },
-    ...options
+    ...options,
   })
 
   it('should display the treeitem with valid data', () => {
@@ -85,8 +85,8 @@ describe('TreeItem component', () => {
         props: {
           node,
           filteredOutNodesCache: new WeakMap(),
-          autoExpandTypes: ['cycle']
-        }
+          autoExpandTypes: ['cycle'],
+        },
       })
       expected
         ? expect(wrapper).to.be.expanded()
@@ -99,7 +99,7 @@ describe('TreeItem component', () => {
       props: {
         node: simpleTaskNode,
         filteredOutNodesCache: new WeakMap(),
-      }
+      },
     })
     expect(wrapper).to.not.be.expanded()
     const expandCollapseBtn = wrapper.find('.node-expand-collapse-button')
@@ -139,9 +139,9 @@ describe('GScanTreeItem', () => {
   const mountFunction = (options) => mount(GScanTreeItem, {
     global: {
       plugins: [createVuetify(), CommandMenuPlugin],
-      mock: { $workflowService }
+      mock: { $workflowService },
     },
-    ...options
+    ...options,
   })
 
   describe('computed properties', () => {
@@ -149,7 +149,7 @@ describe('GScanTreeItem', () => {
       props: {
         node: flattenWorkflowParts(stateTotalsTestWorkflowNodes),
         filteredOutNodesCache: new WeakMap(),
-      }
+      },
     })
     it('does not combine descendant latest state tasks', () => {
       expect(wrapper.vm.statesInfo.latestTasks).to.deep.equal({})
@@ -184,7 +184,7 @@ describe('GScanTreeItem', () => {
         props: {
           node: {
             type: 'workflow',
-            tokens: { workflow: 'a/b/c' }
+            tokens: { workflow: 'a/b/c' },
           },
           filteredOutNodesCache: new WeakMap(),
         },
diff --git a/tests/unit/components/cylc/workspace/luminoWidget.spec.js b/tests/unit/components/cylc/workspace/luminoWidget.spec.js
index d79ba173a..6c37ed116 100644
--- a/tests/unit/components/cylc/workspace/luminoWidget.spec.js
+++ b/tests/unit/components/cylc/workspace/luminoWidget.spec.js
@@ -20,7 +20,7 @@ import { LuminoWidget } from '@/components/cylc/workspace/luminoWidget'
 describe('LuminoWidget', () => {
   it('stringifies to JSON and revives to new instance', () => {
     const layout = {
-      widgets: [new LuminoWidget('widget71', 'Treadstone')]
+      widgets: [new LuminoWidget('widget71', 'Treadstone')],
     }
     const stringified = JSON.stringify(layout)
     expect(JSON.parse(stringified).widgets[0]).toEqual({
diff --git a/tests/unit/components/graphqlFormGenerator/editRuntimeForm.vue.spec.js b/tests/unit/components/graphqlFormGenerator/editRuntimeForm.vue.spec.js
index c412457cc..1511d0c1d 100644
--- a/tests/unit/components/graphqlFormGenerator/editRuntimeForm.vue.spec.js
+++ b/tests/unit/components/graphqlFormGenerator/editRuntimeForm.vue.spec.js
@@ -42,25 +42,25 @@ const INITIAL_DATA = {
     {
       key: '--nodes',
       value: '5',
-      frozenKey: true
+      frozenKey: true,
     },
     {
       key: '--account',
       value: 'h_seldon',
-      frozenKey: true
-    }
+      frozenKey: true,
+    },
   ],
   environment: [
     {
       key: 'FACTION',
       value: 'Foundation',
-      frozenKey: true
+      frozenKey: true,
     },
     {
       key: 'MAYOR',
       value: 'Hardin',
-      frozenKey: true
-    }
+      frozenKey: true,
+    },
   ],
   outputs: [],
   runMode: 'Live',
@@ -69,7 +69,7 @@ const INITIAL_DATA = {
 const $workflowService = {
   query () {
     return Promise.resolve(taskProxy.data)
-  }
+  },
 }
 
 const vuetify = createVuetify()
@@ -79,10 +79,10 @@ describe('EditRuntimeForm Component', () => {
     cylcObject: {
       id: '~u/w//1/t',
       isFamily: false,
-      tokens: { id: '~u/w//1/t' }
+      tokens: { id: '~u/w//1/t' },
     },
     value: false,
-    types: cloneDeep(IntrospectionQuery.data.__schema.types)
+    types: cloneDeep(IntrospectionQuery.data.__schema.types),
   }
 
   /**
@@ -92,9 +92,9 @@ describe('EditRuntimeForm Component', () => {
   const mountFunction = (options) => shallowMount(EditRuntimeForm, {
     global: {
       plugins: [vuetify],
-      mocks: { $workflowService }
+      mocks: { $workflowService },
     },
-    ...options
+    ...options,
   })
 
   describe('reset()', () => {
@@ -118,39 +118,39 @@ describe('EditRuntimeForm Component', () => {
         environment: [
           { // new item
             key: 'HORSE',
-            value: '22'
+            value: '22',
           },
           { // altered item
             key: 'FACTION',
             value: 'Empire',
-            frozenKey: true
+            frozenKey: true,
           },
           {
             key: 'MAYOR',
             value: 'Hardin',
-            frozenKey: true
-          }
+            frozenKey: true,
+          },
         ],
         outputs: [
           {
             key: 'planet',
-            value: 'Trantor'
-          }
-        ]
+            value: 'Trantor',
+          },
+        ],
       }
       const expected = [
         { execution_time_limit: 'PT30M' },
         { environment: { HORSE: '22' } },
         { environment: { FACTION: 'Empire' } },
-        { outputs: { planet: 'Trantor' } }
+        { outputs: { planet: 'Trantor' } },
       ]
       const wrapper = mountFunction({
         props,
         data: () => ({
           initialData: INITIAL_DATA,
-          model
+          model,
         }),
-        created () {}
+        created () {},
       })
       expect(wrapper.vm.getBroadcastData()).to.deep.equal(expected)
     })
@@ -160,20 +160,20 @@ describe('EditRuntimeForm Component', () => {
         ...INITIAL_DATA,
         environment: [
           { key: null, value: null },
-          { key: undefined, value: undefined }
+          { key: undefined, value: undefined },
         ],
         outputs: [
-          {}
-        ]
+          {},
+        ],
       }
       const expected = []
       const wrapper = mountFunction({
         props,
         data: () => ({
           initialData: INITIAL_DATA,
-          model
+          model,
         }),
-        created () {}
+        created () {},
       })
       expect(wrapper.vm.getBroadcastData()).to.deep.equal(expected)
     })
diff --git a/tests/unit/components/graphqlFormGenerator/formgenerator.vue.spec.js b/tests/unit/components/graphqlFormGenerator/formgenerator.vue.spec.js
index 9b2047cb2..f346f9c86 100644
--- a/tests/unit/components/graphqlFormGenerator/formgenerator.vue.spec.js
+++ b/tests/unit/components/graphqlFormGenerator/formgenerator.vue.spec.js
@@ -29,17 +29,17 @@ const BASIC_MUTATION = {
       defaultValue: '"MyDefault"',
       type: {
         name: 'String',
-        kind: 'SCALAR'
-      }
+        kind: 'SCALAR',
+      },
     },
     {
       name: 'MyInteger',
       type: {
         name: 'Int',
-        kind: 'SCALAR'
-      }
-    }
-  ]
+        kind: 'SCALAR',
+      },
+    },
+  ],
 }
 
 const CUSTOM_OBJECT = {
@@ -50,17 +50,17 @@ const CUSTOM_OBJECT = {
       name: 'MyString',
       type: {
         name: 'String',
-        kind: 'SCALAR'
-      }
+        kind: 'SCALAR',
+      },
     },
     {
       name: 'MyInteger',
       type: {
         name: 'Int',
-        kind: 'SCALAR'
-      }
-    }
-  ]
+        kind: 'SCALAR',
+      },
+    },
+  ],
 }
 
 const NESTED_TYPES = [
@@ -75,11 +75,11 @@ const NESTED_TYPES = [
         kind: 'NON_NULL',
         ofType: {
           name: 'String',
-          kind: 'SCALAR'
-        }
-      }
+          kind: 'SCALAR',
+        },
+      },
     },
-    null
+    null,
   ],
   [
     {
@@ -91,11 +91,11 @@ const NESTED_TYPES = [
         kind: 'LIST',
         ofType: {
           name: 'String',
-          kind: 'SCALAR'
-        }
-      }
+          kind: 'SCALAR',
+        },
+      },
     },
-    []
+    [],
   ],
   [
     {
@@ -107,11 +107,11 @@ const NESTED_TYPES = [
         kind: 'LIST',
         ofType: {
           name: 'MyObject',
-          kind: 'OBJECT'
-        }
-      }
+          kind: 'OBJECT',
+        },
+      },
     },
-    [{ MyString: null, MyInteger: null }]
+    [{ MyString: null, MyInteger: null }],
   ],
   [
     {
@@ -129,13 +129,13 @@ const NESTED_TYPES = [
             kind: 'NON_NULL',
             ofType: {
               name: 'String',
-              kind: 'SCALAR'
-            }
-          }
-        }
-      }
+              kind: 'SCALAR',
+            },
+          },
+        },
+      },
     },
-    []
+    [],
   ],
   [
     {
@@ -153,14 +153,14 @@ const NESTED_TYPES = [
             kind: 'NON_NULL',
             ofType: {
               name: 'MyObject',
-              kind: 'OBJECT'
-            }
-          }
-        }
-      }
+              kind: 'OBJECT',
+            },
+          },
+        },
+      },
     },
-    [{ MyString: null, MyInteger: null }]
-  ]
+    [{ MyString: null, MyInteger: null }],
+  ],
 ]
 
 /**
@@ -180,20 +180,20 @@ describe('FormGenerator Component', () => {
    */
   const mountFunction = (options) => mount(FormGenerator, {
     global: {
-      plugins: [vuetify]
+      plugins: [vuetify],
     },
-    ...options
+    ...options,
   })
 
   it('should parse default values from the schema for simple types', () => {
     const wrapper = mountFunction({
       props: {
-        mutation: BASIC_MUTATION
-      }
+        mutation: BASIC_MUTATION,
+      },
     })
     expect(getModel(wrapper)).to.deep.equal({
       MyString: 'MyDefault',
-      MyInteger: null
+      MyInteger: null,
     })
   })
 
@@ -204,10 +204,10 @@ describe('FormGenerator Component', () => {
           mutation: {
             name: type.name + 'Mutation',
             description: 'Beef Wellington',
-            args: [type]
+            args: [type],
           },
-          types: [CUSTOM_OBJECT]
-        }
+          types: [CUSTOM_OBJECT],
+        },
       })
       const expected = { [type.name]: JSON.parse(type.defaultValue) }
       expect(getModel(wrapper)).to.deep.equal(expected)
@@ -223,10 +223,10 @@ describe('FormGenerator Component', () => {
           mutation: {
             name: type.name + 'Mutation',
             description: 'Beef Wellington',
-            args: [type]
+            args: [type],
           },
-          types: [CUSTOM_OBJECT]
-        }
+          types: [CUSTOM_OBJECT],
+        },
       })
       const expected = { [type.name]: defaultValue }
       expect(getModel(wrapper)).to.deep.equal(expected)
@@ -238,13 +238,13 @@ describe('FormGenerator Component', () => {
       props: {
         mutation: BASIC_MUTATION,
         data: {
-          MyString: 'Foo'
-        }
-      }
+          MyString: 'Foo',
+        },
+      },
     })
     expect(getModel(wrapper)).to.deep.equal({
       MyString: 'Foo',
-      MyInteger: null
+      MyInteger: null,
     })
   })
 
@@ -253,12 +253,12 @@ describe('FormGenerator Component', () => {
       props: {
         mutation: BASIC_MUTATION,
         initialData: {
-          MyString: 'before'
+          MyString: 'before',
         },
         data: {
-          MyString: 'after'
+          MyString: 'after',
         },
-      }
+      },
     })
     expect(getModel(wrapper).MyString).to.deep.equal('after')
     wrapper.vm.reset()
@@ -270,9 +270,9 @@ describe('FormGenerator Component', () => {
       props: {
         mutation: BASIC_MUTATION,
         data: {
-          MyString: 'after'
+          MyString: 'after',
         },
-      }
+      },
     })
     expect(getModel(wrapper).MyString).to.deep.equal('after')
     wrapper.vm.reset()
diff --git a/tests/unit/graphql/merge.spec.js b/tests/unit/graphql/merge.spec.js
index 6259fa652..0653d1cb9 100644
--- a/tests/unit/graphql/merge.spec.js
+++ b/tests/unit/graphql/merge.spec.js
@@ -163,20 +163,20 @@ describe('mergeQueries', () => {
           const tests = [
             {
               a: true,
-              b: false
+              b: false,
             },
             {
               a: 'test',
-              b: 'production'
+              b: 'production',
             },
             {
               a: 1,
-              b: 10
+              b: 10,
             },
             {
               a: 1.0,
-              b: 10.0
-            }
+              b: 10.0,
+            },
           ]
           for (const test of tests) {
             const queryA = gql`query {
diff --git a/tests/unit/mixins/graphql.spec.js b/tests/unit/mixins/graphql.spec.js
index 0111a94ba..3e920ffe1 100644
--- a/tests/unit/mixins/graphql.spec.js
+++ b/tests/unit/mixins/graphql.spec.js
@@ -29,19 +29,19 @@ describe('GraphQL mixin', () => {
     const workflowName = 'test'
     const Component = {
       mixins: [graphqlMixin],
-      render () {}
+      render () {},
     }
     const component = shallowMount(Component, {
       global: {
-        plugins: [store]
+        plugins: [store],
       },
       props: {
-        workflowName
-      }
+        workflowName,
+      },
     })
     const variables = component.vm.variables
     const expected = {
-      workflowId: `~${user.owner}/${workflowName}`
+      workflowId: `~${user.owner}/${workflowName}`,
     }
     expect(variables).to.deep.equal(expected)
   })
diff --git a/tests/unit/mixins/subscription.spec.js b/tests/unit/mixins/subscription.spec.js
index 51c79076d..8672a65d7 100644
--- a/tests/unit/mixins/subscription.spec.js
+++ b/tests/unit/mixins/subscription.spec.js
@@ -36,35 +36,35 @@ describe('Subscription mixin', () => {
     const tests = [
       {
         viewState: ViewState.NO_STATE,
-        expectedIsLoading: false
+        expectedIsLoading: false,
       },
       {
         viewState: ViewState.LOADING,
-        expectedIsLoading: true
+        expectedIsLoading: true,
       },
       {
         viewState: ViewState.COMPLETE,
-        expectedIsLoading: false
+        expectedIsLoading: false,
       },
       {
         viewState: ViewState.ERROR,
-        expectedIsLoading: false
-      }
+        expectedIsLoading: false,
+      },
     ]
     for (const test of tests) {
       const Component = {
         mixins: [subscriptionMixin],
-        render () { }
+        render () { },
       }
       const component = mount(Component, {
         global: {
-          plugins: [store]
+          plugins: [store],
         },
         data () {
           return {
-            viewState: test.viewState
+            viewState: test.viewState,
           }
-        }
+        },
       })
       expect(component.vm.isLoading).to.equal(test.expectedIsLoading)
     }
@@ -73,12 +73,12 @@ describe('Subscription mixin', () => {
     store.state.alert = null
     const Component = {
       mixins: [subscriptionMixin],
-      render () {}
+      render () {},
     }
     const component = mount(Component, {
       global: {
-        plugins: [store]
-      }
+        plugins: [store],
+      },
     })
     const alert = new Alert('text', 'red')
     component.vm.setAlert(alert)
diff --git a/tests/unit/mixins/subscriptionComponent.spec.js b/tests/unit/mixins/subscriptionComponent.spec.js
index 47a40492d..c3df946d4 100644
--- a/tests/unit/mixins/subscriptionComponent.spec.js
+++ b/tests/unit/mixins/subscriptionComponent.spec.js
@@ -29,14 +29,14 @@ describe('Subscription Component mixin', () => {
     const Component = {
       mixins: [subscriptionComponentMixin],
       data: () => ({
-        query: { foo: 1 }
+        query: { foo: 1 },
       }),
-      render () { }
+      render () { },
     }
     component = mount(Component, {
       global: {
-        mocks: { $workflowService }
-      }
+        mocks: { $workflowService },
+      },
     })
   })
 
diff --git a/tests/unit/model/subscription.model.spec.js b/tests/unit/model/subscription.model.spec.js
index 79c8b7669..124fd9134 100644
--- a/tests/unit/model/subscription.model.spec.js
+++ b/tests/unit/model/subscription.model.spec.js
@@ -24,7 +24,7 @@ import ViewState from '@/model/ViewState.model'
 describe('SubscriptionQuery model', () => {
   const query = gql`query { workflow { id } }`
   const variables = {
-    workflowId: '~cylc/cylc'
+    workflowId: '~cylc/cylc',
   }
   const name = 'root'
   const callbacks = []
@@ -63,37 +63,37 @@ describe('SubscriptionQuery model', () => {
           viewState: ViewState.ERROR,
           debug: true,
           context: {
-            message: 'test'
-          }
+            message: 'test',
+          },
         },
         {
           viewState: ViewState.NO_STATE,
           debug: true,
           context: {
-            message: 'test'
-          }
+            message: 'test',
+          },
         },
         {
           viewState: ViewState.LOADING,
           debug: true,
           context: {
-            message: 'test'
-          }
+            message: 'test',
+          },
         },
         {
           viewState: ViewState.COMPLETE,
           debug: true,
           context: {
-            message: 'test'
-          }
-        }
+            message: 'test',
+          },
+        },
       ]
       for (const test of tests) {
         const subscription = new Subscription(subscriptionQuery, test.debug)
         subscription.subscribers[1] = {
           viewState: null,
           setAlert: () => {
-          }
+          },
         }
         subscription.handleViewState(test.viewState, test.context)
         Object.values(subscription.subscribers).forEach(subscriber => {
diff --git a/tests/unit/model/subscriptionquery.model.spec.js b/tests/unit/model/subscriptionquery.model.spec.js
index 2648a5c8b..9bb0fd858 100644
--- a/tests/unit/model/subscriptionquery.model.spec.js
+++ b/tests/unit/model/subscriptionquery.model.spec.js
@@ -24,11 +24,11 @@ describe('SubscriptionQuery model', () => {
     it('should be created', () => {
       const query = gql`query { workflow { id } }`
       const variables = {
-        workflowId: '~cylc/cylc'
+        workflowId: '~cylc/cylc',
       }
       const name = 'root'
       const callbacks = [
-        new DeltasCallback()
+        new DeltasCallback(),
       ]
       const isDelta = true
       const isGlobalCallback = true
diff --git a/tests/unit/model/taskstate.model.spec.js b/tests/unit/model/taskstate.model.spec.js
index 491dc8ef1..db1981094 100644
--- a/tests/unit/model/taskstate.model.spec.js
+++ b/tests/unit/model/taskstate.model.spec.js
@@ -17,7 +17,7 @@
 
 import {
   TaskState,
-  TaskStateUserOrder
+  TaskStateUserOrder,
 } from '@/model/TaskState.model'
 
 describe('TaskState model', () => {
diff --git a/tests/unit/services/user.service.spec.js b/tests/unit/services/user.service.spec.js
index b6f325946..0977dd052 100644
--- a/tests/unit/services/user.service.spec.js
+++ b/tests/unit/services/user.service.spec.js
@@ -45,7 +45,7 @@ describe('getUserProfile', () => {
           ...expected,
           name: expected.username,
           other_stuff: null,
-        }
+        },
       })
       sandbox.stub(axios, 'get').returns(response)
       const user = await getUserProfile()
@@ -56,7 +56,7 @@ describe('getUserProfile', () => {
       expect(store.state.alert).to.equal(null)
       const e = new Error('mock error')
       e.response = {
-        statusText: 'Test Status'
+        statusText: 'Test Status',
       }
       sandbox.stub(axios, 'get').rejects(e)
       return getUserProfile()
diff --git a/tests/unit/services/workflow.service.spec.js b/tests/unit/services/workflow.service.spec.js
index 34f9d87b3..da2038149 100644
--- a/tests/unit/services/workflow.service.spec.js
+++ b/tests/unit/services/workflow.service.spec.js
@@ -34,9 +34,9 @@ vi.mock('@/graphql/index', () => ({
   createApolloClient: () => ({
     query: vi.fn(),
     subscribe: () => ({
-      subscribe: vi.fn()
+      subscribe: vi.fn(),
     }),
-  })
+  }),
 }))
 
 const sandbox = sinon.createSandbox()
@@ -77,7 +77,7 @@ describe('WorkflowService', () => {
     sandbox.stub(WorkflowService.prototype, 'loadTypes').returns(
       Promise.resolve({
         mutations: [],
-        types: []
+        types: [],
       })
     )
     service = new WorkflowService(url, subscriptionClient)
@@ -91,7 +91,7 @@ describe('WorkflowService', () => {
     subscriptionQuery = new SubscriptionQuery(
       query,
       {
-        workflowId: '~cylc/test'
+        workflowId: '~cylc/test',
       },
       'root',
       [],
@@ -109,7 +109,7 @@ describe('WorkflowService', () => {
       _uid: 'view',
       query: subscriptionQuery,
       viewState: ViewState.NO_STATE,
-      setAlert: () => {}
+      setAlert: () => {},
     }
     service.subscribe(view)
   })
@@ -225,7 +225,7 @@ describe('WorkflowService', () => {
        */
       const view1 = {
         _uid: 'view1',
-        query: query1
+        query: query1,
       }
       service.subscribe(view1)
       // at this point we have only 1 query, so the computed query must have the exact value we provided
@@ -250,7 +250,7 @@ describe('WorkflowService', () => {
        */
       const view2 = {
         _uid: 'view2',
-        query: query2
+        query: query2,
       }
       service.subscribe(view2)
       // now the queries must have been merged
@@ -272,7 +272,7 @@ describe('WorkflowService', () => {
     it('should not add duplicate callbacks', () => {
       const newCallbacks = [
         new WorkflowCallback(),
-        new TreeCallback()
+        new TreeCallback(),
       ]
       subscriptionQuery.callbacks.push(...newCallbacks)
       const newSubscriptionQuery = new SubscriptionQuery(
@@ -285,7 +285,7 @@ describe('WorkflowService', () => {
       )
       const anotherView = {
         _uid: 'anotherView',
-        query: newSubscriptionQuery
+        query: newSubscriptionQuery,
       }
       service.subscribe(anotherView)
       // Same callbacks, Lodash's union should add to list like a set
@@ -305,7 +305,7 @@ describe('WorkflowService', () => {
       )
       const anotherView = {
         _uid: 'anotherView',
-        query: newSubscriptionQuery
+        query: newSubscriptionQuery,
       }
       service.subscribe(anotherView)
       // Same callbacks, Lodash's union should add to list like a set
@@ -319,7 +319,7 @@ describe('WorkflowService', () => {
       const anotherQuery = new SubscriptionQuery(
         gql`query { workflow { id } }`,
         {
-          invalidVariable: true
+          invalidVariable: true,
         },
         'test',
         [],
@@ -328,7 +328,7 @@ describe('WorkflowService', () => {
         _uid: 'view',
         query: anotherQuery,
         viewState: ViewState.NO_STATE,
-        setAlert: () => {}
+        setAlert: () => {},
       }
       expect(() => { service.recompute(subscription) }).to.throw()
     })
@@ -347,7 +347,7 @@ describe('WorkflowService', () => {
     it('should NOT call unsubscribe if there are still subscribers left', () => {
       const anotherView = {
         _uid: 'test',
-        query: subscriptionQuery
+        query: subscriptionQuery,
       }
       service.subscribe(anotherView)
       const stub = sandbox.stub(service, 'stopSubscription')
@@ -358,7 +358,7 @@ describe('WorkflowService', () => {
   describe('stopSubscription', () => {
     it('should remove the subscription', () => {
       subscription.observable = {
-        unsubscribe: () => {}
+        unsubscribe: () => {},
       }
       expect(service.subscriptions[subscription.query.name]).to.not.equal(null)
       service.stopSubscription(subscription)
@@ -384,8 +384,8 @@ describe('Global Callback', () => {
       added: {
         id: 123,
         workflow: { id: '~user/foo' },
-        taskProxies: { id: '~user/foo//1/a' }
-      }
+        taskProxies: { id: '~user/foo//1/a' },
+      },
     }
     callback.before(delta1, store, errors)
     callback.onAdded(delta1.added, store, errors)
@@ -404,8 +404,8 @@ describe('Global Callback', () => {
       added: {
         id: 234,
         workflow: { id: '~user/foo', reloaded: true },
-        taskProxies: { id: '~user/foo//2/b' }
-      }
+        taskProxies: { id: '~user/foo//2/b' },
+      },
     }
     callback.before(delta2, store, errors)
     callback.onUpdated(delta2.added, store, errors)
diff --git a/tests/unit/store/user.spec.js b/tests/unit/store/user.spec.js
index 597166b44..2046a505b 100644
--- a/tests/unit/store/user.spec.js
+++ b/tests/unit/store/user.spec.js
@@ -37,7 +37,7 @@ describe('user', () => {
     it('should set user', () => {
       const user = {
         id: 1,
-        username: 'cylc'
+        username: 'cylc',
       }
       store.commit('user/SET_USER', user)
       expect(store.state.user.user).to.deep.equal(user)
diff --git a/tests/unit/store/workflows.spec.js b/tests/unit/store/workflows.spec.js
index 97adadc74..6e2fc61b1 100644
--- a/tests/unit/store/workflows.spec.js
+++ b/tests/unit/store/workflows.spec.js
@@ -73,11 +73,11 @@ describe('cylc tree', () => {
         b: {
           c: {
             d: {
-              '01': {}
-            }
-          }
-        }
-      }
+              '01': {},
+            },
+          },
+        },
+      },
     })
 
     // CLEAR should wipe the store
@@ -98,18 +98,18 @@ describe('cylc tree', () => {
         b: {
           c: {
             d: {
-              '01': {}
-            }
-          }
-        }
-      }
+              '01': {},
+            },
+          },
+        },
+      },
     })
     expect(getIndex()).to.deep.equal([
       '~a',
       '~a/b',
       '~a/b//c',
       '~a/b//c/d',
-      '~a/b//c/d/01'
+      '~a/b//c/d/01',
     ])
 
     // add another job for the same task
@@ -121,10 +121,10 @@ describe('cylc tree', () => {
             d: {
               '01': {},
               '02': {},
-            }
-          }
-        }
-      }
+            },
+          },
+        },
+      },
     })
     expect(getIndex()).to.deep.equal([
       '~a',
@@ -132,7 +132,7 @@ describe('cylc tree', () => {
       '~a/b//c',
       '~a/b//c/d',
       '~a/b//c/d/01',
-      '~a/b//c/d/02'
+      '~a/b//c/d/02',
     ])
 
     // add another cycle for the same workflow
@@ -144,11 +144,11 @@ describe('cylc tree', () => {
             d: {
               '01': {},
               '02': {},
-            }
+            },
           },
-          g: {}
-        }
-      }
+          g: {},
+        },
+      },
     })
     expect(getIndex()).to.deep.equal([
       '~a',
@@ -157,7 +157,7 @@ describe('cylc tree', () => {
       '~a/b//c/d',
       '~a/b//c/d/01',
       '~a/b//c/d/02',
-      '~a/b//g'
+      '~a/b//g',
     ])
   })
 
@@ -186,14 +186,14 @@ describe('cylc tree', () => {
         expectedTree: {
           a: {
             b: {
-              g: {}
-            }
-          }
+              g: {},
+            },
+          },
         },
         expectedIndex: [
           '~a',
           '~a/b',
-          '~a/b//g'
+          '~a/b//g',
         ],
       },
       {
@@ -202,14 +202,14 @@ describe('cylc tree', () => {
         expectedTree: {
           a: {
             b: {
-              g: {}
-            }
-          }
+              g: {},
+            },
+          },
         },
         expectedIndex: [
           '~a',
           '~a/b',
-          '~a/b//g'
+          '~a/b//g',
         ],
       },
       {
@@ -220,12 +220,12 @@ describe('cylc tree', () => {
             b: {
               c: {
                 d: {
-                  '02': {}
-                }
+                  '02': {},
+                },
               },
-              g: {}
-            }
-          }
+              g: {},
+            },
+          },
         },
         expectedIndex: [
           '~a',
@@ -233,7 +233,7 @@ describe('cylc tree', () => {
           '~a/b//c',
           '~a/b//c/d',
           '~a/b//c/d/02',
-          '~a/b//g'
+          '~a/b//g',
         ],
       },
     ])('removes a $type from the tree', ({ id, expectedTree, expectedIndex }) => {
@@ -257,11 +257,11 @@ describe('cylc tree', () => {
               d: {
                 '01': {},
                 '02': {},
-              }
+              },
             },
-            g: {}
-          }
-        }
+            g: {},
+          },
+        },
       })
       expect(getIndex()).to.deep.equal([
         '~a',
@@ -270,7 +270,7 @@ describe('cylc tree', () => {
         '~a/b//c/d',
         '~a/b//c/d/01',
         '~a/b//c/d/02',
-        '~a/b//g'
+        '~a/b//g',
       ])
 
       store.commit('workflows/REMOVE', id)
@@ -317,13 +317,13 @@ describe('cylc tree', () => {
       {
         id: '~a',
         foo: 1,
-        bar: 2
+        bar: 2,
       }
     )
     expect(getNode('~a').node).to.deep.equal({
       id: '~a',
       foo: 1,
-      bar: 2
+      bar: 2,
     })
 
     // update a node
@@ -332,14 +332,14 @@ describe('cylc tree', () => {
       {
         id: '~a',
         bar: 3, // update
-        baz: 4 // add
+        baz: 4, // add
       }
     )
     expect(getNode('~a').node).to.deep.equal({
       id: '~a',
       foo: 1, // old (not updated)
       bar: 3, // new (updated)
-      baz: 4 // new (added)
+      baz: 4, // new (added)
     })
   })
 
@@ -428,7 +428,7 @@ describe('cylc tree', () => {
     expect(_tree.children.map(n => n.id)).to.deep.equal([
       '~a',
       '~b',
-      '~c'
+      '~c',
     ])
 
     // insert workflows
@@ -439,7 +439,7 @@ describe('cylc tree', () => {
     expect(user.children.map(n => n.id)).to.deep.equal([
       '~a/a1x',
       '~a/a5x',
-      '~a/a10x'
+      '~a/a10x',
     ])
 
     // insert cycles
@@ -450,7 +450,7 @@ describe('cylc tree', () => {
     expect(workflow.children.map(n => n.id)).to.deep.equal([
       '~a/a1x//20T0',
       '~a/a1x//10T0',
-      '~a/a1x//5T0'
+      '~a/a1x//5T0',
     ])
 
     // insert tasks
@@ -461,7 +461,7 @@ describe('cylc tree', () => {
     expect(cycle.children.map(n => n.id)).to.deep.equal([
       '~a/a1x//5T0/f1d',
       '~a/a1x//5T0/f5d',
-      '~a/a1x//5T0/f10d'
+      '~a/a1x//5T0/f10d',
     ])
 
     // insert jobs
@@ -472,7 +472,7 @@ describe('cylc tree', () => {
     expect(task.children.map(n => n.id)).to.deep.equal([
       '~a/a1x//5T0/f1d/03',
       '~a/a1x//5T0/f1d/02',
-      '~a/a1x//5T0/f1d/01'
+      '~a/a1x//5T0/f1d/01',
     ])
 
     // insert edges
@@ -483,7 +483,7 @@ describe('cylc tree', () => {
     expect(workflow.$edges.map(n => n.id)).to.deep.equal([
       '~a/a1x//$edge|1/a|2/a',
       '~a/a1x//$edge|1/b|2/b',
-      '~a/a1x//$edge|1/c|2/c'
+      '~a/a1x//$edge|1/c|2/c',
     ])
 
     // insert namespaces
@@ -494,7 +494,7 @@ describe('cylc tree', () => {
     expect(workflow.$namespaces.map(n => n.id)).to.deep.equal([
       '~a/a1x//$namespace|a',
       '~a/a1x//$namespace|b',
-      '~a/a1x//$namespace|c'
+      '~a/a1x//$namespace|c',
     ])
   })
 
@@ -509,9 +509,9 @@ describe('cylc tree', () => {
         name: 'PENGUIN',
         ancestors: [
           { name: 'ANIMAL' },
-          { name: 'root' }
+          { name: 'root' },
         ],
-        __typename: 'FamilyProxy'
+        __typename: 'FamilyProxy',
       }
     )
 
@@ -583,8 +583,8 @@ describe('cylc tree', () => {
         childTasks: [
           { id: '~u/w//1/adelie' },
           { id: '~u/w//1/gentoo' },
-          { id: '~u/w//1/jeffes' }
-        ]
+          { id: '~u/w//1/jeffes' },
+        ],
       }
     )
     store.commit(
@@ -592,8 +592,8 @@ describe('cylc tree', () => {
       {
         id: '~u/w//1/ANIMAL',
         childTasks: [
-          { id: '~u/w//1/great-auk' }
-        ]
+          { id: '~u/w//1/great-auk' },
+        ],
       }
     )
 
@@ -604,12 +604,12 @@ describe('cylc tree', () => {
     expect(animal.children.map(node => node.id)).to.deep.equal([
       // NOTE: families should sort before tasks
       '~u/w//1/PENGUIN',
-      '~u/w//1/great-auk'
+      '~u/w//1/great-auk',
     ])
     expect(penguin.children.map(node => node.id)).to.deep.equal([
       '~u/w//1/adelie',
       '~u/w//1/gentoo',
-      '~u/w//1/jeffes'
+      '~u/w//1/jeffes',
     ])
 
     // test removing task (1/adelie)
@@ -619,7 +619,7 @@ describe('cylc tree', () => {
     expect(cycle.children.length).to.equal(3)
     expect(penguin.children.map(node => node.id)).to.deep.equal([
       '~u/w//1/gentoo',
-      '~u/w//1/jeffes'
+      '~u/w//1/jeffes',
     ])
   })
 
@@ -638,12 +638,12 @@ describe('cylc tree', () => {
         childTasks: [
           { id: '~u/w//1/adelie' },
           { id: '~u/w//1/gentoo' },
-          { id: '~u/w//1/jeffes' }
+          { id: '~u/w//1/jeffes' },
         ],
         ancestors: [
-          { name: 'root' }
+          { name: 'root' },
         ],
-        __typename: 'FamilyProxy'
+        __typename: 'FamilyProxy',
       }
     )
     // remove a family
@@ -652,7 +652,7 @@ describe('cylc tree', () => {
 
     // the family tree should be destroyed...
     expect(cycle.familyTree.map(node => node.id)).to.deep.equal([
-      '~u/w//1/root'
+      '~u/w//1/root',
     ])
     expect(cycle.familyTree[0].children.map(node => node.id)).to.deep.equal([])
 
@@ -661,7 +661,7 @@ describe('cylc tree', () => {
       '~u/w//1/adelie',
       '~u/w//1/gentoo',
       '~u/w//1/great-auk',
-      '~u/w//1/jeffes'
+      '~u/w//1/jeffes',
     ])
   })
 
@@ -678,14 +678,14 @@ describe('cylc tree', () => {
       {
         id: '~u/w//1/root',
         ancestors: [],
-        __typename: 'FamilyProxy'
+        __typename: 'FamilyProxy',
       }
     )
 
     const cycle = store.state.workflows.cylcTree.$index['~u/w//1']
     expect(cycle.children.length).to.equal(0)
     expect(cycle.familyTree.map(c => c.id)).to.deep.equal([
-      '~u/w//1/root'
+      '~u/w//1/root',
     ])
   })
 
@@ -698,28 +698,28 @@ describe('cylc tree', () => {
     store.commit(
       'workflows/UPDATE',
       {
-        id: '~u/a/b/c'
+        id: '~u/a/b/c',
       }
     )
 
     store.commit(
       'workflows/UPDATE',
       {
-        id: '~u/a/b/c//1/x'
+        id: '~u/a/b/c//1/x',
       }
     )
 
     const user = store.state.workflows.cylcTree.$index['~u']
     expect(user.children.map(c => c.id)).to.deep.equal([
-      '~u/a'
+      '~u/a',
     ])
     const workflowA = user.children[0]
     expect(workflowA.children.map(c => c.id)).to.deep.equal([
-      '~u/a/b'
+      '~u/a/b',
     ])
     const workflowB = workflowA.children[0]
     expect(workflowB.children.map(c => c.id)).to.deep.equal([
-      '~u/a/b/c'
+      '~u/a/b/c',
     ])
   })
 })
diff --git a/tests/unit/utils/aotf.spec.js b/tests/unit/utils/aotf.spec.js
index ce0d5307c..2578ed046 100644
--- a/tests/unit/utils/aotf.spec.js
+++ b/tests/unit/utils/aotf.spec.js
@@ -51,7 +51,7 @@ describe('aotf (Api On The Fly)', () => {
       const input = {
         name: 'fooBar',
         description: 'Short description.\n\nLong\ndescription.\nValid for: stopped, paused workflows.',
-        args: []
+        args: [],
       }
       const output = {
         ...input,
@@ -59,7 +59,7 @@ describe('aotf (Api On The Fly)', () => {
         _icon: aotf.getMutationIcon(),
         _shortDescription: 'Short description.',
         _help: 'Long\ndescription.\nValid for: stopped, paused workflows.',
-        _validStates: ['stopped', 'paused']
+        _validStates: ['stopped', 'paused'],
       }
       aotf.processMutations([input], null)
       expect(input).to.deep.equal(output)
@@ -74,9 +74,9 @@ describe('aotf (Api On The Fly)', () => {
             name: 'fooBar',
             kind: 'Whatever',
             ofType: 'Whatever',
-            defaultValue: '42'
-          }
-        ]
+            defaultValue: '42',
+          },
+        ],
       }
       const output = {
         args: [
@@ -87,9 +87,9 @@ describe('aotf (Api On The Fly)', () => {
             _cylcType: undefined,
             _multiple: false,
             _required: false,
-            _default: 42
-          }
-        ]
+            _default: 42,
+          },
+        ],
       }
       aotf.processArguments(input, [])
       expect(input).to.deep.equal(output)
@@ -111,13 +111,13 @@ describe('aotf (Api On The Fly)', () => {
                   name: 'WorkflowID',
                   type: {
                     name: 'SCALAR',
-                    ofType: null
-                  }
-                }
-              }
-            }
-          }
-        ]
+                    ofType: null,
+                  },
+                },
+              },
+            },
+          },
+        ],
       }
       const output = {
         args: [
@@ -128,9 +128,9 @@ describe('aotf (Api On The Fly)', () => {
             _cylcType: 'WorkflowID',
             _multiple: true, // because of the LIST
             _required: true, // because of the NON_NULL
-            _default: ['a']
-          }
-        ]
+            _default: ['a'],
+          },
+        ],
       }
       aotf.processArguments(input, [])
       expect(input).to.deep.equal(output)
@@ -147,14 +147,14 @@ describe('aotf (Api On The Fly)', () => {
             {
               name: 'arg1',
               _cylcObjects: [aotf.cylcObjects.Workflow],
-              _required: true
+              _required: true,
             },
             {
               name: 'arg2',
               _cylcObjects: [aotf.cylcObjects.User],
-              _required: false
-            }
-          ]
+              _required: false,
+            },
+          ],
         },
         {
           // mutation that operates on users
@@ -163,9 +163,9 @@ describe('aotf (Api On The Fly)', () => {
             {
               name: 'arg1',
               _cylcObjects: [aotf.cylcObjects.User],
-              _required: false
-            }
-          ]
+              _required: false,
+            },
+          ],
         },
         {
           // mutation that operates on workflows but requires additional info
@@ -174,15 +174,15 @@ describe('aotf (Api On The Fly)', () => {
             {
               name: 'arg1',
               _cylcObjects: [aotf.cylcObjects.Workflow],
-              _required: true
+              _required: true,
             },
             {
               name: 'arg2',
               _cylcObjects: undefined,
-              _required: true
-            }
-          ]
-        }
+              _required: true,
+            },
+          ],
+        },
       ]
       const tokens = aotf.tokenise('~a/b//c/d')
       const permissions = []
@@ -211,7 +211,7 @@ describe('aotf (Api On The Fly)', () => {
         all.map((item) => [item.mutation.name, item.requiresInfo]).sort()
       ).to.deep.equal([
         ['baz', true],
-        ['foo', false]
+        ['foo', false],
       ])
     })
 
@@ -225,14 +225,14 @@ describe('aotf (Api On The Fly)', () => {
             {
               name: 'arg1',
               _cylcObjects: [aotf.cylcObjects.Workflow],
-              _required: true
+              _required: true,
             },
             {
               name: 'arg2',
               _cylcObjects: undefined,
-              _required: false
-            }
-          ]
+              _required: false,
+            },
+          ],
         },
         {
           // second argument is required -> info is required
@@ -241,14 +241,14 @@ describe('aotf (Api On The Fly)', () => {
             {
               name: 'arg1',
               _cylcObjects: [aotf.cylcObjects.Workflow],
-              _required: true
+              _required: true,
             },
             {
               name: 'arg2',
               _cylcObjects: undefined,
-              _required: true
-            }
-          ]
+              _required: true,
+            },
+          ],
         },
         {
           // second argument is required -> info is required unless
@@ -258,15 +258,15 @@ describe('aotf (Api On The Fly)', () => {
             {
               name: 'arg1',
               _cylcObjects: [aotf.cylcObjects.Workflow],
-              _required: true
+              _required: true,
             },
             {
               name: 'arg2',
               _cylcObjects: [aotf.cylcObjects.CyclePoint],
-              _required: true
-            }
-          ]
-        }
+              _required: true,
+            },
+          ],
+        },
       ]
       const permissions = []
 
@@ -282,7 +282,7 @@ describe('aotf (Api On The Fly)', () => {
       ).to.deep.equal([
         ['argon', false],
         ['boron', true],
-        ['carbon', true] // no cycle point in the context -> info required
+        ['carbon', true], // no cycle point in the context -> info required
       ])
 
       // filter mutations from the context of a cycle point
@@ -297,7 +297,7 @@ describe('aotf (Api On The Fly)', () => {
       ).to.deep.equal([
         ['argon', false],
         ['boron', true],
-        ['carbon', false] // cycle point in the context -> no info is required
+        ['carbon', false], // cycle point in the context -> no info is required
       ])
     })
 
@@ -305,12 +305,12 @@ describe('aotf (Api On The Fly)', () => {
       const args = [{
         name: 'arg1',
         _cylcObjects: [aotf.cylcObjects.Workflow],
-        _required: true
+        _required: true,
       }]
       const mutations = [
         { name: 'argon', args },
         { name: 'boron', args },
-        { name: 'carbon', args }
+        { name: 'carbon', args },
       ]
       const permissions = ['carbon', 'argon']
 
@@ -324,7 +324,7 @@ describe('aotf (Api On The Fly)', () => {
       ).to.deep.equal([
         ['argon', true],
         ['boron', false],
-        ['carbon', true]
+        ['carbon', true],
       ])
     })
   })
@@ -334,20 +334,20 @@ describe('aotf (Api On The Fly)', () => {
       const nodes = [
         {
           name: null,
-          kind: 'NON_NULL'
+          kind: 'NON_NULL',
         },
         {
           name: null,
-          kind: 'LIST'
+          kind: 'LIST',
         },
         {
           name: null,
-          kind: 'NON_NULL'
+          kind: 'NON_NULL',
         },
         {
           name: 'MyInputObject',
-          kind: 'INPUT_OBJECT'
-        }
+          kind: 'INPUT_OBJECT',
+        },
       ]
 
       // chain these nodes together using the ofType field
@@ -376,10 +376,10 @@ describe('aotf (Api On The Fly)', () => {
         [ // String => null
           {
             type: 'String',
-            kind: 'SCALAR'
+            kind: 'SCALAR',
           },
           [],
-          null
+          null,
         ],
         [ // NON_NULL<String> => null
           {
@@ -387,11 +387,11 @@ describe('aotf (Api On The Fly)', () => {
             kind: 'NON_NULL',
             ofType: {
               type: 'String',
-              kind: 'SCALAR'
-            }
+              kind: 'SCALAR',
+            },
           },
           [],
-          null
+          null,
         ],
         [ // LIST<String> => []
           {
@@ -399,11 +399,11 @@ describe('aotf (Api On The Fly)', () => {
             kind: 'LIST',
             ofType: {
               type: 'String',
-              kind: 'SCALAR'
-            }
+              kind: 'SCALAR',
+            },
           },
           [],
-          []
+          [],
         ],
         [ // LIST<LIST<String>> => [[]]
           {
@@ -414,12 +414,12 @@ describe('aotf (Api On The Fly)', () => {
               kind: 'LIST',
               ofType: {
                 type: 'String',
-                kind: 'SCALAR'
-              }
-            }
+                kind: 'SCALAR',
+              },
+            },
           },
           [],
-          [[]]
+          [[]],
         ],
         [ // NON_NULL<LIST<String>> => []
           {
@@ -430,17 +430,17 @@ describe('aotf (Api On The Fly)', () => {
               kind: 'LIST',
               ofType: {
                 type: 'String',
-                kind: 'SCALAR'
-              }
-            }
+                kind: 'SCALAR',
+              },
+            },
           },
           [],
-          []
+          [],
         ],
         [ // OBJECT { A } => { foo: null, bar: null }
           {
             kind: 'OBJECT',
-            name: 'A'
+            name: 'A',
           },
           [
             {
@@ -448,12 +448,12 @@ describe('aotf (Api On The Fly)', () => {
               kind: 'OBJECT',
               fields: [
                 { name: 'foo', type: 'String' },
-                { name: 'bar', type: 'String' }
-              ]
-            }
+                { name: 'bar', type: 'String' },
+              ],
+            },
           ],
-          { foo: null, bar: null }
-        ]
+          { foo: null, bar: null },
+        ],
       ].forEach(([type, types, expected]) => {
         expect(
           aotf.getNullValue(type, types)
@@ -468,17 +468,17 @@ describe('aotf (Api On The Fly)', () => {
         // [type, signature]
         [
           {
-            kind: 'TEST_TYPE'
+            kind: 'TEST_TYPE',
           },
-          'TEST_TYPE'
+          'TEST_TYPE',
         ],
         [
           {
             name: 'String',
             kind: 'SCALAR',
-            ofType: null
+            ofType: null,
           },
-          'String'
+          'String',
         ],
         [
           {
@@ -487,10 +487,10 @@ describe('aotf (Api On The Fly)', () => {
             ofType: {
               name: 'String',
               kind: 'SCALAR',
-              ofType: null
-            }
+              ofType: null,
+            },
           },
-          'String!'
+          'String!',
         ],
         [
           {
@@ -505,18 +505,18 @@ describe('aotf (Api On The Fly)', () => {
                 ofType: {
                   name: 'String',
                   kind: 'SCALAR',
-                  ofType: null
-                }
-              }
-            }
+                  ofType: null,
+                },
+              },
+            },
           },
-          '[String!]!'
-        ]
+          '[String!]!',
+        ],
       ].forEach(([type, signature]) => {
         expect(
           aotf.argumentSignature({
             name: 'myArgument',
-            type
+            type,
           })
         ).to.equal(signature)
       })
@@ -533,18 +533,18 @@ describe('aotf (Api On The Fly)', () => {
             type: {
               name: 'String',
               kind: 'SCALAR',
-              ofType: null
-            }
+              ofType: null,
+            },
           },
           {
             name: 'bar',
             type: {
               name: 'Int',
               kind: 'SCALAR',
-              ofType: null
-            }
-          }
-        ]
+              ofType: null,
+            },
+          },
+        ],
       }
       aotf.processMutations([mutation])
       const variables = {
@@ -573,8 +573,8 @@ describe('aotf (Api On The Fly)', () => {
             name: 'bar',
             type: { name: 'Int', kind: 'SCALAR' },
             defaultValue: 42,
-          }
-        ]
+          },
+        ],
       }
       aotf.processMutations([mutation])
       const variables = { foo: 'default', bar: 42 }
@@ -602,12 +602,12 @@ describe('aotf (Api On The Fly)', () => {
                 ofType: {
                   name: 'String',
                   kind: 'SCALAR',
-                  ofType: null
-                }
-              }
-            }
-          }
-        ]
+                  ofType: null,
+                },
+              },
+            },
+          },
+        ],
       }
       aotf.processMutations([mutation])
       expect(aotf.constructMutation(mutation)).to.equal(dedent`
@@ -621,7 +621,7 @@ describe('aotf (Api On The Fly)', () => {
     it('handles mutation objects with no arguments', () => {
       const mutation = {
         name: 'MyMutation',
-        args: []
+        args: [],
       }
       expect(aotf.constructMutation(mutation)).to.equal(dedent`
         mutation MyMutation {
@@ -643,23 +643,23 @@ describe('aotf (Api On The Fly)', () => {
             _cylcType: 'WorkflowID',
             _cylcObjects: [aotf.cylcObjects.Workflow],
             _multiple: true,
-            _default: null
+            _default: null,
           },
           {
             name: 'arg2',
             _cylcType: undefined,
             _cylcObjects: undefined,
             _multiple: false,
-            _default: 42
-          }
-        ]
+            _default: 42,
+          },
+        ],
       }
       const tokens = aotf.tokenise('~a/b')
       expect(
         aotf.getMutationArgsFromTokens(mutation, tokens)
       ).to.deep.equal({
         arg1: ['~a/b'],
-        arg2: 42
+        arg2: 42,
       })
     })
   })
@@ -676,25 +676,25 @@ describe('aotf (Api On The Fly)', () => {
             { name: 'age', type: { name: 'Integer' } },
             { name: 'height', type: { name: 'Integer' } },
             { name: 'width', type: { name: 'Integer' } },
-            { name: 'criminalAllegations', type: { name: 'CriminalAllegations' } }
-          ]
+            { name: 'criminalAllegations', type: { name: 'CriminalAllegations' } },
+          ],
         },
         { name: 'Integer' },
         {
           name: 'CriminalAllegations',
           fields: [
             { name: 'date', type: { name: 'Date' } },
-            { name: 'location', type: { name: 'Location' } }
-          ]
+            { name: 'location', type: { name: 'Location' } },
+          ],
         },
         { name: 'Date' },
         {
           name: 'Location',
           fields: [
-            { name: 'coordinates', type: { name: 'Coordinates' } }
-          ]
+            { name: 'coordinates', type: { name: 'Coordinates' } },
+          ],
         },
-        { name: 'Coordinates' }
+        { name: 'Coordinates' },
       ]
       personType = types.find(({ name }) => name === 'Person')
     })
@@ -713,11 +713,11 @@ describe('aotf (Api On The Fly)', () => {
             {
               name: 'location',
               fields: [
-                { name: 'coordinates', fields: null }
-              ]
-            }
-          ]
-        }
+                { name: 'coordinates', fields: null },
+              ],
+            },
+          ],
+        },
       ])
     })
 
@@ -729,9 +729,9 @@ describe('aotf (Api On The Fly)', () => {
             {
               name: 'criminalAllegations',
               fields: [
-                { name: 'location' }
-              ]
-            }
+                { name: 'location' },
+              ],
+            },
           ],
           types
         )
@@ -742,11 +742,11 @@ describe('aotf (Api On The Fly)', () => {
             {
               name: 'location',
               fields: [
-                { name: 'coordinates', fields: null }
-              ]
-            }
-          ]
-        }
+                { name: 'coordinates', fields: null },
+              ],
+            },
+          ],
+        },
       ])
     })
 
@@ -756,13 +756,13 @@ describe('aotf (Api On The Fly)', () => {
           personType,
           [
             { name: 'width' },
-            { name: 'height' }
+            { name: 'height' },
           ],
           types
         )
       ).to.deep.equal([
         { name: 'width', fields: null },
-        { name: 'height', fields: null }
+        { name: 'height', fields: null },
       ])
     })
   })
@@ -783,13 +783,13 @@ describe('aotf (Api On The Fly)', () => {
         response: {
           data: {
             [mutation.name]: {
-              result: [true, 'arasaka']
-            }
-          }
+              result: [true, 'arasaka'],
+            },
+          },
         },
         expected: {
-          status: 'SUCCEEDED', message: 'arasaka'
-        }
+          status: 'SUCCEEDED', message: 'arasaka',
+        },
       },
 
       {
@@ -797,13 +797,13 @@ describe('aotf (Api On The Fly)', () => {
         response: {
           data: {
             [mutation.name]: {
-              result: [false, 'relic malfunction']
-            }
-          }
+              result: [false, 'relic malfunction'],
+            },
+          },
         },
         expected: {
-          status: 'FAILED', message: 'relic malfunction'
-        }
+          status: 'FAILED', message: 'relic malfunction',
+        },
       },
 
       {
@@ -814,21 +814,21 @@ describe('aotf (Api On The Fly)', () => {
               result: [
                 {
                   [mutation.name]: {
-                    result: [{ id: 'wflow1', response: [true, 'arasaka'] }]
-                  }
+                    result: [{ id: 'wflow1', response: [true, 'arasaka'] }],
+                  },
                 },
                 {
                   [mutation.name]: {
-                    result: [{ id: 'wflow2', response: [true, 'kiroshi'] }]
-                  }
-                }
-              ]
-            }
-          }
+                    result: [{ id: 'wflow2', response: [true, 'kiroshi'] }],
+                  },
+                },
+              ],
+            },
+          },
         },
         expected: {
-          status: 'SUCCEEDED', message: 'Command(s) submitted'
-        }
+          status: 'SUCCEEDED', message: 'Command(s) submitted',
+        },
       },
 
       {
@@ -839,21 +839,21 @@ describe('aotf (Api On The Fly)', () => {
               result: [
                 {
                   [mutation.name]: {
-                    result: [{ id: 'wflow1', response: [true, 'arasaka'] }]
-                  }
+                    result: [{ id: 'wflow1', response: [true, 'arasaka'] }],
+                  },
                 },
                 {
                   [mutation.name]: {
-                    result: [{ id: 'wflow2', response: [false, 'relic malfunction'] }]
-                  }
-                }
-              ]
-            }
-          }
+                    result: [{ id: 'wflow2', response: [false, 'relic malfunction'] }],
+                  },
+                },
+              ],
+            },
+          },
         },
         expected: {
-          status: 'FAILED', message: 'relic malfunction'
-        }
+          status: 'FAILED', message: 'relic malfunction',
+        },
       },
 
       {
@@ -861,13 +861,13 @@ describe('aotf (Api On The Fly)', () => {
         response: {
           data: {
             [mutation.name]: {
-              result: [{ response: [true, 'arasaka'] }]
-            }
-          }
+              result: [{ response: [true, 'arasaka'] }],
+            },
+          },
         },
         expected: {
-          status: 'SUCCEEDED', message: 'Command(s) submitted'
-        }
+          status: 'SUCCEEDED', message: 'Command(s) submitted',
+        },
       },
 
       {
@@ -875,13 +875,13 @@ describe('aotf (Api On The Fly)', () => {
         response: {
           data: {
             [mutation.name]: {
-              result: [{ response: [false, 'relic malfunction'] }]
-            }
-          }
+              result: [{ response: [false, 'relic malfunction'] }],
+            },
+          },
         },
         expected: {
-          status: 'FAILED', message: 'relic malfunction'
-        }
+          status: 'FAILED', message: 'relic malfunction',
+        },
       },
 
       {
@@ -890,13 +890,13 @@ describe('aotf (Api On The Fly)', () => {
           data: {
             [mutation.name]: {
               result: 2077,
-            }
-          }
+            },
+          },
         },
         expected: {
-          status: 'SUCCEEDED', message: 2077
-        }
-      }
+          status: 'SUCCEEDED', message: 2077,
+        },
+      },
     ])('handles response - $testID', async ({ response, expected, testID }) => {
       expect(await aotf.handleMutationResponse(mutation, response)).toStrictEqual(expected)
     })
diff --git a/tests/unit/utils/font-size.spec.js b/tests/unit/utils/font-size.spec.js
index 4c01b4dcd..29b5c1dd2 100644
--- a/tests/unit/utils/font-size.spec.js
+++ b/tests/unit/utils/font-size.spec.js
@@ -16,7 +16,7 @@
  */
 
 import {
-  decreaseFontSize, getCurrentFontSize, increaseFontSize, INCREMENT, resetFontSize
+  decreaseFontSize, getCurrentFontSize, increaseFontSize, INCREMENT, resetFontSize,
 } from '@/utils/font-size'
 
 describe('Font Size', () => {
diff --git a/tests/unit/utils/graph-utils.spec.js b/tests/unit/utils/graph-utils.spec.js
index 4cc556ab6..54e10cd6e 100644
--- a/tests/unit/utils/graph-utils.spec.js
+++ b/tests/unit/utils/graph-utils.spec.js
@@ -17,7 +17,7 @@
 
 import {
   posToPath,
-  nonCryptoHash
+  nonCryptoHash,
 } from '@/utils/graph-utils'
 
 describe('Graph functionality', () => {
diff --git a/tests/unit/utils/graphql.spec.js b/tests/unit/utils/graphql.spec.js
index e965b0a74..fbe00371f 100644
--- a/tests/unit/utils/graphql.spec.js
+++ b/tests/unit/utils/graphql.spec.js
@@ -41,7 +41,7 @@ describe('utils', () => {
           'ws://localhost:12345',
           {
             reconnect: false,
-            lazy: true
+            lazy: true,
           },
           {})
         expect(typeof subscriptionClient.request).to.equal('function')
@@ -51,7 +51,7 @@ describe('utils', () => {
           'ws://localhost:12345',
           {
             reconnect: false,
-            lazy: true
+            lazy: true,
           },
           {})
         expect(store.state.offline).to.equal(false)
@@ -60,24 +60,24 @@ describe('utils', () => {
         for ({ eventName, expectedOffline } of [
           {
             eventName: 'connecting',
-            expectedOffline: true
+            expectedOffline: true,
           },
           {
             eventName: 'connected',
-            expectedOffline: false
+            expectedOffline: false,
           },
           {
             eventName: 'reconnecting',
-            expectedOffline: true
+            expectedOffline: true,
           },
           {
             eventName: 'reconnected',
-            expectedOffline: false
+            expectedOffline: false,
           },
           {
             eventName: 'disconnected',
-            expectedOffline: true
-          }
+            expectedOffline: true,
+          },
         ]) {
           subscriptionClient.eventEmitter.emit(eventName)
           expect(store.state.offline).to.equal(expectedOffline)
diff --git a/tests/unit/utils/initialOptions.spec.js b/tests/unit/utils/initialOptions.spec.js
index c48a4d1c3..7c2abe1c1 100644
--- a/tests/unit/utils/initialOptions.spec.js
+++ b/tests/unit/utils/initialOptions.spec.js
@@ -19,7 +19,7 @@ import { nextTick } from 'vue'
 import { vi } from 'vitest'
 import {
   updateInitialOptionsEvent,
-  useInitialOptions
+  useInitialOptions,
 } from '@/utils/initialOptions'
 
 describe('useInitialOptions', () => {
@@ -49,7 +49,7 @@ describe('useInitialOptions', () => {
   it('uses the default value when the property is not in initialOptions', () => {
     const ctx = {
       props: {
-        initialOptions: { ship: 'In Amber Clad' }
+        initialOptions: { ship: 'In Amber Clad' },
       },
       emit () {},
     }
diff --git a/tests/unit/utils/tasks.spec.js b/tests/unit/utils/tasks.spec.js
index f101d66c3..e6a7a8b8c 100644
--- a/tests/unit/utils/tasks.spec.js
+++ b/tests/unit/utils/tasks.spec.js
@@ -39,7 +39,7 @@ describe('tasks', () => {
           [TaskState.WAITING].map((state) => state.name)],
         [
           TaskState.RUNNING.name,
-          [TaskState.SUBMITTED, TaskState.RUNNING].map((state) => state.name)]
+          [TaskState.SUBMITTED, TaskState.RUNNING].map((state) => state.name)],
       ].forEach((val) => {
         const groupState = extractGroupState(val[1], false)
         expect(groupState).to.equal(val[0])
@@ -56,7 +56,7 @@ describe('tasks', () => {
           [TaskState.SUCCEEDED].map((state) => state.name)],
         [
           TaskState.RUNNING.name,
-          [TaskState.SUBMITTED, TaskState.RUNNING, TaskState.EXPIRED].map((state) => state.name)]
+          [TaskState.SUBMITTED, TaskState.RUNNING, TaskState.EXPIRED].map((state) => state.name)],
       ].forEach((val) => {
         const groupState = extractGroupState(val[1], true)
         expect(groupState).to.equal(val[0])
@@ -71,27 +71,27 @@ describe('tasks', () => {
   describe.each([
     {
       taskProxy: null,
-      expected: undefined
+      expected: undefined,
     },
     {
       taskProxy: {},
-      expected: undefined
+      expected: undefined,
     },
     {
       taskProxy: {
-        children: []
+        children: [],
       },
-      expected: undefined
+      expected: undefined,
     },
     {
       taskProxy: {
         children: [
           { node: 'foo' },
           { node: 'bar' },
-        ]
+        ],
       },
-      expected: 'foo'
-    }
+      expected: 'foo',
+    },
   ])('latestJob($taskProxy)', ({ taskProxy, expected }) => {
     it(`returns ${expected}`, () => {
       expect(latestJob(taskProxy)).to.equal(expected)
@@ -145,9 +145,9 @@ describe('tasks', () => {
             outputs: [{
               label: 'my-output',
               message: 'chilbolton',
-            }]
-          }
-        }
+            }],
+          },
+        },
       }
 
       expect(jobMessageOutputs(jobNode)).toEqual([
diff --git a/tests/unit/utils/toolbar.spec.js b/tests/unit/utils/toolbar.spec.js
index 203dba151..d9dcf6b2c 100644
--- a/tests/unit/utils/toolbar.spec.js
+++ b/tests/unit/utils/toolbar.spec.js
@@ -29,7 +29,7 @@ import { useDrawer, useNavBtn } from '@/utils/toolbar'
 const vuetify = (mobile) => createVuetify({
   display: {
     mobileBreakpoint: mobile ? 10e3 : 0,
-  }
+  },
 })
 
 describe('Toolbar/drawer utils', () => {
@@ -56,7 +56,7 @@ describe('Toolbar/drawer utils', () => {
         },
         {
           global: {
-            plugins: [vuetify(mobile)]
+            plugins: [vuetify(mobile)],
           },
         }
       )
@@ -72,12 +72,12 @@ describe('Toolbar/drawer utils', () => {
           const { drawer, toggleDrawer } = useDrawer()
           return { drawer, toggleDrawer }
         },
-        render () {}
+        render () {},
       },
       {
         global: {
-          plugins: [vuetify]
-        }
+          plugins: [vuetify],
+        },
       }
     )
 
diff --git a/tests/unit/utils/uid.spec.js b/tests/unit/utils/uid.spec.js
index 60cc9904d..ce62525cc 100644
--- a/tests/unit/utils/uid.spec.js
+++ b/tests/unit/utils/uid.spec.js
@@ -33,7 +33,7 @@ describe('Universal ID (UID)', () => {
         workflowID: '~user/workflow',
         relativeID: 'cycle/task/01',
         namespace: undefined,
-        edge: undefined
+        edge: undefined,
       })
 
       // workflow ID fragment
@@ -49,7 +49,7 @@ describe('Universal ID (UID)', () => {
         workflowID: '~user',
         relativeID: '',
         namespace: undefined,
-        edge: undefined
+        edge: undefined,
       })
 
       // relative ID fragment
@@ -65,7 +65,7 @@ describe('Universal ID (UID)', () => {
         workflowID: '',
         relativeID: 'cycle',
         namespace: undefined,
-        edge: undefined
+        edge: undefined,
       })
     })
 
@@ -83,7 +83,7 @@ describe('Universal ID (UID)', () => {
         workflowID: '',
         relativeID: '',
         namespace: 'foo',
-        edge: undefined
+        edge: undefined,
       })
 
       // edges
@@ -99,7 +99,7 @@ describe('Universal ID (UID)', () => {
         workflowID: '',
         relativeID: '',
         namespace: undefined,
-        edge: [new Tokens('1/a', true), new Tokens('1/b', true)]
+        edge: [new Tokens('1/a', true), new Tokens('1/b', true)],
       })
     })
 
@@ -130,7 +130,7 @@ describe('Universal ID (UID)', () => {
         workflowID: 'w',
         relativeID: 'c',
         namespace: undefined,
-        edge: undefined
+        edge: undefined,
       })
 
       // "b" should be updated
@@ -146,7 +146,7 @@ describe('Universal ID (UID)', () => {
         workflowID: 'x',
         relativeID: 'c/t',
         namespace: undefined,
-        edge: undefined
+        edge: undefined,
       })
 
       // should be able to wipe tokens using "undefined"
@@ -168,7 +168,7 @@ describe('Universal ID (UID)', () => {
           workflowID: 'w',
           relativeID: 'd/t',
           namespace: undefined,
-          edge: undefined
+          edge: undefined,
         })
       })
 
@@ -212,7 +212,7 @@ describe('Universal ID (UID)', () => {
         ['a', new Tokens('~u/a')],
         ['b', new Tokens('~u/a/b')],
         ['c', new Tokens('~u/a/b/c')],
-        ['d', new Tokens('~u/a/b/c/d')]
+        ['d', new Tokens('~u/a/b/c/d')],
       ])
     })
 
@@ -252,38 +252,38 @@ describe('Universal ID (UID)', () => {
         [
           'user',
           'u',
-          new Tokens('~u')
+          new Tokens('~u'),
         ],
         [
           'workflow-part',
           'w1',
-          new Tokens('~u/w1')
+          new Tokens('~u/w1'),
         ],
         [
           'workflow-part',
           'w2',
-          new Tokens('~u/w1/w2')
+          new Tokens('~u/w1/w2'),
         ],
         [
           'workflow',
           'w3',
-          new Tokens('~u/w1/w2/w3')
+          new Tokens('~u/w1/w2/w3'),
         ],
         [
           'cycle',
           'c',
-          new Tokens('~u/w1/w2/w3//c')
+          new Tokens('~u/w1/w2/w3//c'),
         ],
         [
           'task',
           't',
-          new Tokens('~u/w1/w2/w3//c/t')
+          new Tokens('~u/w1/w2/w3//c/t'),
         ],
         [
           'job',
           '01',
-          new Tokens('~u/w1/w2/w3//c/t/01')
-        ]
+          new Tokens('~u/w1/w2/w3//c/t/01'),
+        ],
       ])
 
       expect(
@@ -292,18 +292,18 @@ describe('Universal ID (UID)', () => {
         [
           'user',
           'u',
-          new Tokens('~u')
+          new Tokens('~u'),
         ],
         [
           'workflow',
           'w',
-          new Tokens('~u/w')
+          new Tokens('~u/w'),
         ],
         [
           'cycle',
           'c',
-          new Tokens('~u/w//c')
-        ]
+          new Tokens('~u/w//c'),
+        ],
       ])
 
       expect(
@@ -312,8 +312,8 @@ describe('Universal ID (UID)', () => {
         [
           'user',
           'u',
-          new Tokens('~u')
-        ]
+          new Tokens('~u'),
+        ],
       ])
     })
 
diff --git a/tests/unit/utils/urls.spec.js b/tests/unit/utils/urls.spec.js
index 24ed512c5..05efbd067 100644
--- a/tests/unit/utils/urls.spec.js
+++ b/tests/unit/utils/urls.spec.js
@@ -24,7 +24,7 @@ describe('urls', () => {
   const DEFAULT_LOCATION = {
     protocol: PROTOCOL,
     host: HOST,
-    pathname: PATHNAME
+    pathname: PATHNAME,
   }
   it('should create new URLs', () => {
     const tests = [
@@ -32,26 +32,26 @@ describe('urls', () => {
         path: '',
         websockets: false,
         expected: `${PROTOCOL}//${HOST}/${PATHNAME}`,
-        location: DEFAULT_LOCATION
+        location: DEFAULT_LOCATION,
       },
       {
         path: '',
         websockets: false,
         baseOnly: true,
         expected: `${PROTOCOL}//${HOST}/`,
-        location: DEFAULT_LOCATION
+        location: DEFAULT_LOCATION,
       },
       {
         path: 'subscriptions',
         websockets: false,
         expected: `${PROTOCOL}//${HOST}/${PATHNAME}subscriptions`,
-        location: DEFAULT_LOCATION
+        location: DEFAULT_LOCATION,
       },
       {
         path: 'subscriptions',
         websockets: true,
         expected: `wss://${HOST}/${PATHNAME}subscriptions`,
-        location: DEFAULT_LOCATION
+        location: DEFAULT_LOCATION,
       },
       {
         path: 'subscriptions',
@@ -60,45 +60,45 @@ describe('urls', () => {
         location: {
           protocol: 'http:',
           host: HOST,
-          pathname: PATHNAME
-        }
+          pathname: PATHNAME,
+        },
       },
       {
         path: '//subscriptions',
         websockets: false,
         expected: `${PROTOCOL}//${HOST}/${PATHNAME}subscriptions`,
-        location: DEFAULT_LOCATION
+        location: DEFAULT_LOCATION,
       },
       {
         path: '//graphql/endpoint//subscriptions',
         websockets: false,
         expected: `${PROTOCOL}//${HOST}/${PATHNAME}graphql/endpoint/subscriptions`,
-        location: DEFAULT_LOCATION
+        location: DEFAULT_LOCATION,
       },
       {
         path: '//graphql/endpoint//subscriptions///',
         websockets: false,
         expected: `${PROTOCOL}//${HOST}/${PATHNAME}graphql/endpoint/subscriptions/`,
-        location: DEFAULT_LOCATION
+        location: DEFAULT_LOCATION,
       },
       {
         path: '     ',
         websockets: false,
         expected: `${PROTOCOL}//${HOST}/${PATHNAME}`,
-        location: DEFAULT_LOCATION
+        location: DEFAULT_LOCATION,
       },
       {
         path: ' graphql/endpoint//  ',
         websockets: false,
         expected: `${PROTOCOL}//${HOST}/${PATHNAME}graphql/endpoint/`,
-        location: DEFAULT_LOCATION
-      }
+        location: DEFAULT_LOCATION,
+      },
     ]
     tests.forEach((test) => {
       const originalWindow = global.window
       try {
         global.window = {
-          location: test.location
+          location: test.location,
         }
         // || false just to prevent accidental undefined values
         const url = createUrl(
diff --git a/tests/unit/views/gantt.vue.spec.js b/tests/unit/views/gantt.vue.spec.js
index 2a9c09c8d..f2bdb4401 100644
--- a/tests/unit/views/gantt.vue.spec.js
+++ b/tests/unit/views/gantt.vue.spec.js
@@ -17,7 +17,7 @@
 
 import { GanttCallback } from '@/views/Gantt.vue'
 import {
-  matchTasks
+  matchTasks,
 } from '@/components/cylc/gantt/filter'
 
 const input = {
@@ -28,7 +28,7 @@ const input = {
     startedTime: '2023-02-23T11:37:00Z',
     finishedTime: '2023-02-23T11:37:05Z',
     platform: 'localhost',
-    __typename: 'UISJob'
+    __typename: 'UISJob',
   },
   {
     name: 'b',
@@ -37,7 +37,7 @@ const input = {
     startedTime: '2023-02-23T11:37:33Z',
     finishedTime: '2023-02-23T11:37:35Z',
     platform: 'vld684',
-    __typename: 'UISJob'
+    __typename: 'UISJob',
   },
   {
     name: 'b',
@@ -46,8 +46,8 @@ const input = {
     startedTime: '2023-02-23T11:38:12Z',
     finishedTime: '2023-02-23T11:38:13Z',
     platform: 'vld684',
-    __typename: 'UISJob'
-  }]
+    __typename: 'UISJob',
+  }],
 }
 const expectedJobs = {
   a: [{
@@ -66,7 +66,7 @@ const expectedJobs = {
     name: 'b',
     platform: 'vld684',
     startedTime: '2023-02-23T11:37:33Z',
-    submittedTime: '2023-02-23T11:37:29Z'
+    submittedTime: '2023-02-23T11:37:29Z',
   },
   {
     __typename: 'UISJob',
@@ -75,8 +75,8 @@ const expectedJobs = {
     name: 'b',
     platform: 'vld684',
     startedTime: '2023-02-23T11:38:12Z',
-    submittedTime: '2023-02-23T11:38:07Z'
-  }]
+    submittedTime: '2023-02-23T11:38:07Z',
+  }],
 }
 
 const filteredJobs = {
@@ -87,8 +87,8 @@ const filteredJobs = {
     startedTime: '2023-02-23T11:37:00Z',
     finishedTime: '2023-02-23T11:37:05Z',
     platform: 'localhost',
-    __typename: 'UISJob'
-  }]
+    __typename: 'UISJob',
+  }],
 }
 
 describe('GanttCallback', () => {
diff --git a/tests/unit/views/log.vue.spec.js b/tests/unit/views/log.vue.spec.js
index 1e5494396..a990c5bef 100644
--- a/tests/unit/views/log.vue.spec.js
+++ b/tests/unit/views/log.vue.spec.js
@@ -46,7 +46,7 @@ describe('Log view', () => {
         file: initialFile,
       },
     },
-    ...options
+    ...options,
   })
 
   beforeEach(() => {
@@ -62,7 +62,7 @@ describe('Log view', () => {
           logFiles: {
             files: ['a.log', 'b.log'],
           },
-        }
+        },
       }),
     }
   })
@@ -82,8 +82,8 @@ describe('Log view', () => {
             jobs: [
               // Query response only includes latest job
               { id: 'w//1/foo/02', state },
-            ]
-          }
+            ],
+          },
         })
         const wrapper = mountFunction()
         wrapper.vm.jobLog = 1
diff --git a/tests/unit/views/table.vue.spec.js b/tests/unit/views/table.vue.spec.js
index 14022cae6..a603fb7c3 100644
--- a/tests/unit/views/table.vue.spec.js
+++ b/tests/unit/views/table.vue.spec.js
@@ -61,9 +61,9 @@ const workflows = [
               },
             ],
           },
-        ]
-      }
-    ]
+        ],
+      },
+    ],
   },
 ]
 
@@ -81,7 +81,7 @@ describe('Table view', () => {
       shallow: true,
       global: {
         plugins: [store],
-        mocks: { $workflowService }
+        mocks: { $workflowService },
       },
       props: {
         workflowName: 'one',
@@ -94,12 +94,12 @@ describe('Table view', () => {
       {
         task: { id: '~user/one//1/eventually_succeeded' },
         latestJob: { id: '~user/one//1/eventually_succeeded/3' },
-        previousJob: { id: '~user/one//1/eventually_succeeded/2' }
+        previousJob: { id: '~user/one//1/eventually_succeeded/2' },
       },
       {
         task: { id: '~user/one//1/failed' },
         latestJob: { id: '~user/one//1/failed/1' },
-      }
+      },
     ])
   })
 
@@ -110,7 +110,7 @@ describe('Table view', () => {
         shallow: true,
         global: {
           plugins: [store],
-          mocks: { $workflowService }
+          mocks: { $workflowService },
         },
         props: {
           workflowName: 'one',
@@ -126,14 +126,14 @@ describe('Table view', () => {
     it('should filter by ID', async () => {
       // plain ID
       wrapper.vm.tasksFilter = {
-        id: 'taskA'
+        id: 'taskA',
       }
       await nextTick()
       expect(wrapper.vm.filteredTasks.length).to.equal(1)
 
       // glob ID
       wrapper.vm.tasksFilter = {
-        id: 'task[A]'
+        id: 'task[A]',
       }
       await nextTick()
       expect(wrapper.vm.filteredTasks.length).to.equal(1)
@@ -142,8 +142,8 @@ describe('Table view', () => {
     it('should filter by task state', async () => {
       wrapper.vm.tasksFilter = {
         states: [
-          TaskState.WAITING.name
-        ]
+          TaskState.WAITING.name,
+        ],
       }
       await nextTick()
       expect(wrapper.vm.filteredTasks.length).to.equal(1)
@@ -153,8 +153,8 @@ describe('Table view', () => {
       wrapper.vm.tasksFilter = {
         id: 'taskA',
         states: [
-          TaskState.WAITING.name
-        ]
+          TaskState.WAITING.name,
+        ],
       }
       await nextTick()
       expect(wrapper.vm.filteredTasks.length).to.equal(0)
diff --git a/tests/unit/views/tree.vue.spec.js b/tests/unit/views/tree.vue.spec.js
index 421ec7abf..dc6f094f1 100644
--- a/tests/unit/views/tree.vue.spec.js
+++ b/tests/unit/views/tree.vue.spec.js
@@ -61,7 +61,7 @@ const workflowNode = {
                       ...expandID('~user/workflow1//1/foo/1'),
                       type: 'job',
                     },
-                  ]
+                  ],
                 },
                 {
                   ...expandID('~user/workflow1//1/bar'),
@@ -88,13 +88,13 @@ describe('Tree view', () => {
       global: {
         plugins: [vuetify, CommandMenuPlugin, store],
         mocks: {
-          $workflowService
-        }
+          $workflowService,
+        },
       },
       props: {
         workflowName: 'workflow1',
       },
-      ...options
+      ...options,
     })
   })
 
@@ -102,7 +102,7 @@ describe('Tree view', () => {
     it.each([
       {},
       { id: null, states: null },
-      { id: '  ', states: [] }
+      { id: '  ', states: [] },
     ])('has null filterState when filters are empty: %o', async (tasksFilter) => {
       const wrapper = mountFunction()
       expect(wrapper.vm.tasksFilter).toEqual({
diff --git a/vite.config.js b/vite.config.js
index b552c78e4..bb0a74ca6 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -32,7 +32,7 @@ export default defineConfig(({ mode }) => {
     vue(),
     vuetify(),
     eslint({
-      failOnError: mode === 'production'
+      failOnError: mode === 'production',
     }),
     // GraphiQL is a React app:
     react(),
@@ -41,7 +41,7 @@ export default defineConfig(({ mode }) => {
   if (mode !== 'production' && process.env.COVERAGE) {
     plugins.push(
       IstanbulPlugin({
-        forceBuildInstrument: true
+        forceBuildInstrument: true,
       })
     )
   }
@@ -62,7 +62,7 @@ export default defineConfig(({ mode }) => {
         // GraphiQL is a React app (use Preact as it's smaller):
         react: 'preact/compat',
         'react-dom': 'preact/compat',
-      }
+      },
     },
     plugins,
     optimizeDeps: {
@@ -78,19 +78,19 @@ export default defineConfig(({ mode }) => {
       proxy: {
         '^/(userprofile|version|graphql)': {
           target: devProxyTarget,
-          changeOrigin: true
+          changeOrigin: true,
         },
         '^/subscriptions': {
           target: devProxyTarget,
           changeOrigin: true,
-          ws: true
-        }
+          ws: true,
+        },
       },
       watch: {
         ignored: [
           path.resolve(__dirname, './coverage'),
           path.resolve(__dirname, '**/.nfs*'),
-        ]
+        ],
       },
       warmup: {
         clientFiles: [
@@ -98,8 +98,8 @@ export default defineConfig(({ mode }) => {
           './src/App.vue',
           './src/views/Dashboard.vue',
           './src/views/Workspace.vue',
-        ]
-      }
+        ],
+      },
     },
     build: {
       sourcemap: mode !== 'production',
@@ -118,7 +118,7 @@ export default defineConfig(({ mode }) => {
     },
     define: {
       // Allow vue devtools to work when runing vite build:
-      __VUE_PROD_DEVTOOLS__: mode !== 'production'
+      __VUE_PROD_DEVTOOLS__: mode !== 'production',
     },
     // Unit test specific config:
     test: {
@@ -139,9 +139,9 @@ export default defineConfig(({ mode }) => {
           'src/**/*.{js,mjs,jsx,ts,tsx,vue}',
         ],
         exclude: [
-          'src/services/mock/**'
+          'src/services/mock/**',
         ],
-      }
-    }
+      },
+    },
   }
 })