updated node v

.circleci/config.yml

@@ -4,7 +4,7 @@ jobs:
     working_directory: ~/code
     # The primary container is an instance of the first list image listed. Your build commands run in this container.
     docker:
-      - image: node:14.21
+      - image: node:20.18.1
     steps:
       - checkout
       - restore_cache:
@@ -26,7 +26,7 @@ jobs:
   build_and_deploy:
     working_directory: ~/code
     docker:
-      - image: node:14.21
+      - image: node:20.18.1
     steps:
       - checkout
       - setup_remote_docker
@@ -80,3 +80,4 @@ workflows:
                 - master
                 - staging
                 - develop
+                - node_20.18.0_shoelace_2.18.0

Dockerfile

@@ -1,11 +1,9 @@
-FROM node:14.21-alpine3.16  as builder
+FROM node:20.18.1-alpine3.19 AS builder
 RUN apk update
 RUN apk add --update bash
 
 RUN apk add git
-RUN npm config set unsafe-perm true
-RUN npm install -g typescript
-
+RUN npm install -g [email protected]
 
 WORKDIR /tmp
 ADD package.json /tmp/
@@ -17,19 +15,21 @@ ADD . /code/
 WORKDIR /code
 RUN rm -rf node_modules
 RUN cp -a /tmp/node_modules /code/node_modules
-ENV NODE_OPTIONS --max_old_space_size=4096
-RUN npm run build
 
+WORKDIR /code
+RUN npm run build
 
-FROM node:14.21-alpine3.16 
+FROM node:20.18.1-alpine3.19
 RUN apk update
 RUN apk add --update bash
 
 WORKDIR /code
-RUN npm install express --no-save
-RUN npm install compression --no-save
-RUN npm install [email protected] --no-save
+RUN npm init -y
+RUN npm install express
+RUN npm install compression
+RUN npm install ua-parser-js
+RUN npm install [email protected]
 COPY --from=builder /code/express.js /code/express.js
 COPY --from=builder /code/src /code/src
 EXPOSE 8080
-CMD ["node", "express.js"]
+CMD ["node", "express.js"]

Dockerfile-dev

@@ -1,10 +1,9 @@
-FROM node:14.21-alpine3.16 
+FROM node:20.18.1-alpine3.19
 RUN apk update
 RUN apk add --update bash
 
 RUN apk add git
-RUN npm install -g gulp
-RUN npm install -g typescript
+RUN npm install -g [email protected]
 
 WORKDIR /code
-CMD ["npm", "start"]
+CMD ["sh", "-c", "npm start"]

eslint.config.js

@@ -0,0 +1,117 @@
+import typescriptEslint from '@typescript-eslint/eslint-plugin';
+import lit from 'eslint-plugin-lit';
+import prettier from 'eslint-plugin-prettier';
+import litA11Y from 'eslint-plugin-lit-a11y';
+import globals from 'globals';
+import tsParser from '@typescript-eslint/parser';
+import path from 'node:path';
+import {fileURLToPath} from 'node:url';
+import js from '@eslint/js';
+import {FlatCompat} from '@eslint/eslintrc';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all
+});
+
+export default [
+  ...compat.extends(
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:lit/recommended',
+    'plugin:lit-a11y/recommended',
+    'plugin:prettier/recommended'
+  ),
+  {
+    plugins: {
+      '@typescript-eslint': typescriptEslint,
+      lit,
+      prettier,
+      'lit-a11y': litA11Y
+    },
+
+    languageOptions: {
+      globals: {
+        ...globals.browser,
+        ...globals.node,
+        dayjs: true,
+        Promise: true,
+        Polymer: true,
+        EtoolsPmpApp: true,
+        EtoolsRequestCacheDb: true,
+        ShadyCSS: true,
+        Set: true
+      },
+
+      parser: tsParser,
+      ecmaVersion: 2018,
+      sourceType: 'module'
+    },
+
+    rules: {
+      'lit-a11y/anchor-is-valid': 'off',
+      'lit-a11y/click-events-have-key-events': 'off',
+      'lit-a11y/no-autofocus': 'warn',
+      'lit-a11y/aria-attrs': 'warn',
+      'prettier/prettier': 'error',
+      'lit/attribute-value-entities': 'off',
+      'lit/no-legacy-template-syntax': 'off',
+      'linebreak-style': 'off',
+
+      'no-irregular-whitespace': [
+        'error',
+        {
+          skipTemplates: true
+        }
+      ],
+
+      '@typescript-eslint/no-empty-interface': 'off',
+      '@typescript-eslint/no-object-literal-type-assertion': 'off',
+      'padded-blocks': 'off',
+      'brace-style': 'off',
+      'new-cap': 'off',
+      'no-var': 'off',
+      'require-jsdoc': 'off',
+      'valid-jsdoc': 'off',
+      'comma-dangle': ['error', 'never'],
+
+      'max-len': [
+        'error',
+        {
+          code: 120,
+          ignoreUrls: true
+        }
+      ],
+
+      'prefer-promise-reject-errors': 'off',
+      camelcase: 'off',
+      '@typescript-eslint/explicit-module-boundary-types': 'off',
+      '@typescript-eslint/explicit-member-accessibility': 'off',
+      '@typescript-eslint/camelcase': 'off',
+      '@typescript-eslint/explicit-function-return-type': 'off',
+      '@typescript-eslint/no-explicit-any': 'off',
+      '@typescript-eslint/no-non-null-assertion': 'off',
+      '@typescript-eslint/ban-ts-comment': 'off',
+      '@typescript-eslint/no-non-null-asserted-optional-chain': 'off',
+
+      '@typescript-eslint/no-use-before-define': [
+        'error',
+        {
+          functions: false,
+          classes: true,
+          variables: true
+        }
+      ],
+
+      '@typescript-eslint/no-unused-vars': [
+        'error',
+        {
+          argsIgnorePattern: '^_'
+        }
+      ]
+    }
+  }
+];

express.js

@@ -1,42 +1,36 @@
 const express = require('express'); // eslint-disable-line
-const browserCapabilities = require('browser-capabilities'); // eslint-disable-line
 const compression = require('compression'); // eslint-disable-line
+const browserCapabilities = require('browser-capabilities'); // eslint-disable-line
+const UAParser = require('ua-parser-js').UAParser; // eslint-disable-line
 
 const app = express();
 const basedir = __dirname + '/src/'; // eslint-disable-line
-app.use(compression());
 
-function getSourcesPath(request) {
-  let clientCapabilities = browserCapabilities.browserCapabilities(
-    request.headers['user-agent']);
-
-  clientCapabilities = new Set(clientCapabilities); // eslint-disable-line
-  if (clientCapabilities.has('modules')) {
-    return basedir;
-  } else {
-    return basedir;
-  }
+function getSourcesPath(request, filePath = '') {
+  const userAgent = request.headers['user-agent'];
+  const clientCapabilities = browserCapabilities.browserCapabilities(userAgent);
+  const browserName = new UAParser(userAgent).getBrowser().name || '';
+  // skip Edge because browser-capabilities library is outdated
+  const needToUpgrade = !clientCapabilities.has('modules') && browserName !== 'Edge';
+  return needToUpgrade ? `${basedir}upgrade-browser.html` : `${basedir}${filePath}`;
 }
 
+app.use(compression());
+
 app.use('/template/', (req, res, next) => {
   express.static(getSourcesPath(req))(req, res, next);
 });
 
-app.get(/.*service-worker\.js/, function (req, res) {
-  res.sendFile(getSourcesPath(req) + 'service-worker.js');
-});
-
-app.get(/.*manifest\.json/, function (req, res) {
-  res.sendFile(getSourcesPath(req) + 'manifest.json');
+app.get(/.*service-worker\.js/, (req, res) => {
+  res.sendFile(getSourcesPath(req, 'service-worker.js'));
 });
 
-
 app.use((req, res) => {
   // handles app access using a different state path than index (otherwise it will not return any file)
   res.header('Cache-Control', 'private, no-cache, no-store, must-revalidate');
   res.header('Expires', '-1');
   res.header('Pragma', 'no-cache');
-  res.sendFile(getSourcesPath(req) + 'index.html');
+  res.sendFile(getSourcesPath(req, 'index.html'));
 });
 
 app.listen(8080);