chore: migrate to eslint and cypress (#102)

* fix: migrate to eslint and cypress
* fix: travis test on node 16
* fix: generate lcov report
* fix: run chrome headless for ci
* fix: reenable coveralls

.eslintrc.json

@@ -0,0 +1,36 @@
+{
+  "root": true,
+  "ignorePatterns": ["**/*"],
+  "plugins": ["@nrwl/nx"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {
+        "@nrwl/nx/enforce-module-boundaries": [
+          "error",
+          {
+            "enforceBuildableLibDependency": true,
+            "allow": [],
+            "depConstraints": [
+              {
+                "sourceTag": "*",
+                "onlyDependOnLibsWithTags": ["*"]
+              }
+            ]
+          }
+        ],
+        "no-empty-function": "warn"
+      }
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "extends": ["plugin:@nrwl/nx/typescript"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "extends": ["plugin:@nrwl/nx/javascript"],
+      "rules": {}
+    }
+  ]
+}

.prettierignore

@@ -0,0 +1,4 @@
+# Add files here to ignore them from prettier formatting
+
+/dist
+/coverage

.travis.yml

@@ -1,26 +1,28 @@
-dist: trusty
+dist: xenial
 sudo: required
 language: node_js
 node_js:
   - '16'
 cache: npm
 os:
   - linux
+services:
+  - xvfb
 addons:
   chrome: stable
 
 stages:
   - validate
   - deploy
+env:
+  globals:
+  - COVERALLS_SERVICE_NAME=travis-pro
+notifications:
+  webhooks: https://coveralls.io/webhook
+  email: $EMAIL
 
-before_install:
-  # Use a virtual display.
-  - export DISPLAY=:99.0
-  - sh -e /etc/init.d/xvfb start
-  # Install latest chrome.
-  - export CHROME_BIN=chromium-browser
 install:
-  - npm ci
+  - npm ci --no-audit
 
 jobs:
   include:
@@ -33,19 +35,13 @@ jobs:
         - npm run lint
     - stage: validate
       name: "Unit tests and Coverage"
-      node_js:
-        - '10'
-        - '11'
-        - '12'
       before_script:
-        - 'sudo chown root /opt/google/chrome/chrome-sandbox'
-        - 'sudo chmod 4755 /opt/google/chrome/chrome-sandbox'
         - npm install coveralls
       script:
         - echo "> Running tests against $(node -v)"
         - npm run test:once -- --code-coverage
       after_success:
-        - cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js
+        - cat ./coverage/libs/material-file-input/lcov.info | ./node_modules/coveralls/bin/coveralls.js
     # *--------------------*
     # |       DEPLOY       |
     # *--------------------*

.vscode/extensions.json

@@ -1,9 +1,8 @@
 {
 "recommendations": [
 "nrwl.angular-console",
-"ms-vscode.vscode-typescript-tslint-plugin",
 "esbenp.prettier-vscode",
 "angular.ng-template"
 ]
 
-}
+}

angular.json

@@ -12,28 +12,30 @@
       "architect": {
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
+          "outputs": ["{options.outputPath}"],
           "options": {
             "outputPath": "dist/apps/demo",
             "index": "apps/demo/src/index.html",
             "main": "apps/demo/src/main.ts",
             "polyfills": "apps/demo/src/polyfills.ts",
             "tsConfig": "apps/demo/tsconfig.app.json",
+            "inlineStyleLanguage": "scss",
             "assets": ["apps/demo/src/favicon.ico", "apps/demo/src/assets"],
             "styles": ["apps/demo/src/styles.scss"],
-            "scripts": [],
-            "vendorChunk": true,
-            "extractLicenses": false,
-            "buildOptimizer": false,
-            "sourceMap": true,
-            "optimization": false,
-            "namedChunks": true
+            "scripts": []
           },
           "configurations": {
             "production": {
               "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "500kb",
+                  "maximumError": "1mb"
+                },
                 {
                   "type": "anyComponentStyle",
-                  "maximumWarning": "6kb"
+                  "maximumWarning": "2kb",
+                  "maximumError": "4kb"
                 }
               ],
               "fileReplacements": [
@@ -42,35 +44,46 @@
                   "with": "apps/demo/src/environments/environment.prod.ts"
                 }
               ],
-              "optimization": true,
-              "outputHashing": "all",
-              "sourceMap": false,
-              "namedChunks": false,
-              "extractLicenses": true,
-              "vendorChunk": false,
-              "buildOptimizer": true
+              "outputHashing": "all"
+            },
+            "development": {
+              "buildOptimizer": false,
+              "optimization": false,
+              "vendorChunk": true,
+              "extractLicenses": false,
+              "sourceMap": true,
+              "namedChunks": true
             }
           },
-          "defaultConfiguration": "",
-          "outputs": ["{options.outputPath}"]
+          "defaultConfiguration": "production"
         },
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
-          "options": {
-            "browserTarget": "demo:build"
-          },
           "configurations": {
             "production": {
               "browserTarget": "demo:build:production"
+            },
+            "development": {
+              "browserTarget": "demo:build:development"
             }
-          }
+          },
+          "defaultConfiguration": "development"
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
             "browserTarget": "demo:build"
           }
         },
+        "lint": {
+          "builder": "@nrwl/linter:eslint",
+          "options": {
+            "lintFilePatterns": [
+              "apps/demo/src/**/*.ts",
+              "apps/demo/src/**/*.html"
+            ]
+          }
+        },
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
@@ -93,14 +106,27 @@
       "projectType": "application",
       "architect": {
         "e2e": {
-          "builder": "@angular-devkit/build-angular:protractor",
+          "builder": "@nrwl/cypress:cypress",
+          "options": {
+            "cypressConfig": "apps/demo-e2e/cypress.json",
+            "devServerTarget": "demo:serve:development"
+          },
+          "configurations": {
+            "production": {
+              "devServerTarget": "demo:serve:production"
+            }
+          }
+        },
+        "lint": {
+          "builder": "@nrwl/linter:eslint",
+          "outputs": ["{options.outputFile}"],
           "options": {
-            "protractorConfig": "apps/demo-e2e/protractor.conf.js",
-            "devServerTarget": "demo:serve"
+            "lintFilePatterns": ["apps/demo-e2e/**/*.{js,ts}"]
           }
         }
       },
-      "tags": []
+      "tags": [],
+      "implicitDependencies": ["demo"]
     },
     "demo-packaged": {
       "root": "apps/demo-packaged",
@@ -212,6 +238,15 @@
             "karmaConfig": "libs/material-file-input/karma.conf.js"
           },
           "outputs": ["coverage/libs/material-file-input"]
+        },
+        "lint": {
+          "builder": "@nrwl/linter:eslint",
+          "options": {
+            "lintFilePatterns": [
+              "libs/material-file-input/src/**/*.ts",
+              "libs/material-file-input/src/**/*.html"
+            ]
+          }
         }
       },
       "tags": []

apps/demo-e2e/.eslintrc.json

@@ -0,0 +1,17 @@
+{
+  "extends": ["plugin:cypress/recommended", "../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {}
+    },
+    {
+      "files": ["src/plugins/index.js"],
+      "rules": {
+        "@typescript-eslint/no-var-requires": "off",
+        "no-undef": "off"
+      }
+    }
+  ]
+}

apps/demo-e2e/cypress.json

@@ -0,0 +1,12 @@
+{
+  "fileServerFolder": ".",
+  "fixturesFolder": "./src/fixtures",
+  "integrationFolder": "./src/integration",
+  "modifyObstructiveCode": false,
+  "supportFile": "./src/support/index.ts",
+  "pluginsFile": false,
+  "video": true,
+  "videosFolder": "../../dist/cypress/apps/test-e2e/videos",
+  "screenshotsFolder": "../../dist/cypress/apps/test-e2e/screenshots",
+  "chromeWebSecurity": false
+}

apps/demo-e2e/src/fixtures/example.json

@@ -0,0 +1,4 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "hello@cypress.io"
+}

apps/demo-e2e/src/integration/app.spec.ts

@@ -0,0 +1,13 @@
+import { getGreeting } from '../support/app.po';
+
+describe('test', () => {
+  beforeEach(() => cy.visit('/'));
+
+  it('should display welcome message', () => {
+    // Custom command example, see `../support/commands.ts` file
+    cy.login('my-email@something.com', 'myPassword');
+
+    // Function helper example, see `../support/app.po.ts` file
+    getGreeting().contains('Welcome to test!');
+  });
+});

apps/demo-e2e/src/support/app.po.ts

@@ -0,0 +1 @@
+export const getGreeting = () => cy.get('h1');