reposense · ckcherry23 · May 12, 2024 · Mar 29, 2024 · Mar 29, 2024 · Mar 29, 2024
diff --git a/.gitignore b/.gitignore
@@ -19,6 +19,8 @@ node_modules
 /frontend/public/
 !/frontend/public/favicon.ico
 !/frontend/public/index.html
+/frontend/.eslintcache
+/frontend/.stylelintcache
 
 reposense-report/
 docs/_site/

diff --git a/docs/dg/learningBasics.md b/docs/dg/learningBasics.md
@@ -263,7 +263,7 @@ It is necessary for you to learn the basics of Vue.js, Pug, and SCSS before work
 <box type="info" seamless>
 
 Vue.js uses JavaScript as its programming language. Before learning **Vue.js**, you may need to first get yourself familiar with JavaScript syntax first.
-You can refer to the [Javascript documentation](https://devdocs.io/javascript/) to learn the basic syntax. There are plenty of other resources available and please feel free to find the resource most suitable for you.
+You can refer to the [Javascript documentation](https://devdocs.io/javascript/) to learn the basic syntax. There are plenty of other resources available and please feel free to find the resource most suitable for you. Do note that RepoSense uses ES6 over CommonJS.
 </box>
 
 RepoSense uses **Vue.js** (Vue3) in its front-end implementation. In particular, major user interface components, such as [summary view](report.html#summary-view-v-summary-js), [authorship view](report.html#authorship-view-v-authorship-js), and [zoom view](report.html#zoom-view-v-zoom-js), are implemented as Vue components. The corresponding source files are in `frontend/src`.

diff --git a/docs/ug/troubleshooting.md b/docs/ug/troubleshooting.md
@@ -40,3 +40,9 @@ Possibly, you may have some file names with [special characters](https://docs.mi
 ### Some file types are not shown in the file type filter even if I have included them in the file formats when generating the report
 
 The files of these types may be [binary files](https://en.wikipedia.org/wiki/Binary_file). *RepoSense* will group binary files under one single file type `binary`. Common binary files include images (`.jpg`, `.png`), applications (`.exe`), zip files (`.zip`, `.rar`) and certain document types (`.docx`, `.pptx`).
+
+<!-- ------------------------------------------------------------------------------------------------------ -->
+
+### RepoSense doesn't work on the browser
+
+RepoSense uses ES6, a version of JavaScript widely supported by [most browsers](https://caniuse.com/?search=es6). Please use RepoSense with a browser that supports ES6.
diff --git a/frontend/.eslintrc.json b/frontend/.eslintrc.json
@@ -1,6 +1,8 @@
 {
   "env": {
-    "browser": true
+    "browser": true,
+    "node": true,
+    "es2022": true
   },
   "extends": [
     "airbnb-base",

diff --git a/frontend/babel.config.js b/frontend/babel.config.js
diff --git a/frontend/cypress/cypress.config.js b/frontend/cypress/cypress.config.js
@@ -8,6 +8,7 @@ module.exports = defineConfig({
   e2e: {
     setupNodeEvents(on, config) {},
     baseUrl: 'http://localhost:9000',
+    chromeWebSecurity: false,
     specPattern: 'tests/**/*.cy.{js,jsx,ts,tsx}',
     supportFile: 'support.js',
   },

diff --git a/frontend/public/index.html → frontend/index.html b/frontend/public/index.html → frontend/index.html
@@ -4,12 +4,13 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-    <title><%= htmlWebpackPlugin.options.title %></title>
+    <link rel="icon" href="/favicon.ico">
+    <title>RepoSense Report</title>
+    <script type="module" src="/src/main.ts"></script>
   </head>
   <body>
     <noscript>
-      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+      <strong>We're sorry but RepoSense Report doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
     </noscript>
     <div id="app"></div>
     <!-- built files will be auto injected -->