[ADF-5146] Upgrade to Angular 10 (#5834)

* remove useless module

* upgrade to angular 8

* upgrade material to v8

* upgrade adf libs

* migrate demo shell to v8

* upgrade to angular 9

* upgrade material to v9

* remove hammer

* upgrade nx

* upgrade datetime picker

* upgrade flex layout

* update core api

* remove entry components

* code fixes

* upgrade testbed usage

* code fixes

* remove unnecessary core-js from tests

* upgrade CLI

* ts config fixes

* fix builds

* fix testing config

* compile fixes

* fix demo shell dev setup

* fix core tests

* fix card view import

* upgrade nx

* disable smart builds for now

* remove fdescribe

* restore smart builds

* fix issues

* unify tsconfigs and fix newly found issues

* fix configuration and cleanup package scripts

* improved production build from the same config

* use ADF libs directly instead of node_modules

* disable smart build

* single app configuration (angular)

* fix core build

* fix build scripts

* lint fixes

* fix linting setup

* fix linting rules

* various fixes

* disable affected libs for unit tests

* cleanup insights package.json

* simplify smart-build

* fix content tests

* fix tests

* test fixes

* fix tests

* fix test

* fix tests

* disable AppExtensionsModule (monaco example)

* remove monaco extension module

* upgrade bundle check rules

* fix insights tests and karma config

* fix protractor config

* e2e workaround

* upgrade puppeteer and split linting and build

* reusable resources config

* update protractor config

* fix after rebase

* fix protractor config

* fix e2e tsconfig

* update e2e setup

* Save demoshell artifact on S3 and remove travis cache

* Push the libs on S3 and fetch before releasing it

* Add deps

* Add dependencies among libs and run only affected unit test and build

* fix the travis stage name

* fix after renaming dev to demoshell

* force the order of the projects

* remove unused dependencies

* fix content e2e script

* exit codes fix

* add extra exit codes to core e2e

* postinstall hook and package cleanup

* cleanup packages

* remove deprecated code and dependency on router

* improve bundle analyzer script

* minor code fixes

* update spec

* fix code after rebase

* upgrade protractor after rebase

* fix e2e mapping lib

* Update tsconfig.e2e.json

* update e2e tsconfig

* fix angular config

* fix protractor runs

* cache dist folder for libs

* update material selectors for dropdowns

* selector fixes

* remove duplicated e2e that have unit tests already

* fix login selector

* fix e2e

* fix test

* fix import issues

* fix selector

* cleanup old monaco extension files

* cleanup demo shell login

* add protractor max retries

* disable customisations of protractor

* fix login validation

* fix after rebase

* fix after rebase, disable latest versions of libs

* Hide the report tab and rollback the localstorage

* rename protractor config back to js

* restore lint as part of build

* cleanup code

* do not copy anything to node_modules on dist test

* fix unit tests

* config fixes

* fix code

* fix code after rebase

* fix tests

* remove existing words from spellcheck

* remove useless directive decorators

* update package.json after rebase

* add js-api back

* code fixes

* add missing export

* update configs

* fix code

* try fix the sso login test

* fix

* remove puppeteer unit

* fix e2e script

* fix

* make provider easy

* fix routes module before upgrade

* fix unit tests

* upgrade angular cli

* upgrade to angular 10

Co-authored-by: maurizio vitale <maurizio.vitale@alfresco.com>
Co-authored-by: Eugenio Romano <eugenio.romano@alfresco.com>
Co-authored-by: Eugenio Romano <eromano@users.noreply.github.com>

.browserslistrc

@@ -0,0 +1,17 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major version
+last 2 iOS major versions
+Firefox ESR
+not IE 9-11 # For IE 9-11 support, remove 'not'.

.travis.yml

@@ -7,6 +7,7 @@ dist: bionic
 node_js:
   - '12.16.3'
 
+before_install: . ./scripts/ci/job_hooks/before_install.sh
 install:
     echo "no install"
 
@@ -21,8 +22,7 @@ branches:
 
 stages:
   - name: Lint & Build Dist
-    if: type = pull_request OR type = api
+  - name: Npm Release
-  - name: Lint & Build Dist & Release
     if: (type = push OR type = cron) AND tag IS blank
   - name: Update Rancher
     if: (type = push AND tag IS blank)  OR type = api
@@ -54,20 +54,21 @@ jobs:
     include:
         # Run Only for any PR
         - stage: Lint & Build Dist
-          name:  Lint & Build Dist
+          name:  Build
           script:
-            - ./scripts/travis/build/build.sh || exit 1;
+            - ./scripts/travis/build/build.sh
-            - ./scripts/lint.sh || exit 1;
+            - ./scripts/lint.sh
+          after_success:
+            - ./scripts/ci/utils/artifact-to-s3.sh -a ./dist/demo-shell -o "$S3_DBP_FOLDER/alfresco-demoshell.tar.bz2"
+            - ./scripts/ci/utils/artifact-to-s3.sh -a ./lib/dist -o "$S3_DBP_FOLDER/alfresco-libs.tar.bz2"
 
         # Run Only on develop and master
-        - stage: Lint & Build Dist & Release
+        - stage: Npm Release
-          name:  Lint & Build Dist & Release
+          name: Npm Release
+          before_script: ./scripts/ci/utils/artifact-from-s3.sh -a "$S3_DBP_FOLDER/alfresco-libs.tar.bz2" -o "./lib/dist"
           script:
-            - ./scripts/travis/build/build.sh || exit 1;
-            - ./scripts/lint.sh || exit 1;
             - ./scripts/travis/release/release-npm.sh
 
-
         - stage: Unit test
           name: Unit test content
           script:  ./scripts/travis/unit-test/content.sh
@@ -88,18 +89,23 @@ jobs:
 
         - stage: e2e Test
           name: core
+          before_script: ./scripts/ci/utils/artifact-from-s3.sh -a "$S3_DBP_FOLDER/alfresco-demoshell.tar.bz2" -o "./dist/demo-shell"
           script: ./scripts/travis/e2e/core-e2e.sh
         - stage: e2e Test
           name:  content
+          before_script: ./scripts/ci/utils/artifact-from-s3.sh -a "$S3_DBP_FOLDER/alfresco-demoshell.tar.bz2" -o "./dist/demo-shell"
           script: ./scripts/travis/e2e/content-services-e2e.sh
         - stage: e2e Test
           name:  search
+          before_script: ./scripts/ci/utils/artifact-from-s3.sh -a "$S3_DBP_FOLDER/alfresco-demoshell.tar.bz2" -o "./dist/demo-shell"
           script: ./scripts/travis/e2e/search-e2e.sh
         - stage: e2e Test
           name: process
+          before_script: ./scripts/ci/utils/artifact-from-s3.sh -a "$S3_DBP_FOLDER/alfresco-demoshell.tar.bz2" -o "./dist/demo-shell"
           script: ./scripts/travis/e2e/process-services-e2e.sh
         - stage: e2e Test
           name: process Cloud
+          before_script: ./scripts/ci/utils/artifact-from-s3.sh -a "$S3_DBP_FOLDER/alfresco-demoshell.tar.bz2" -o "./dist/demo-shell"
           script: ./scripts/travis/e2e/process-services-cloud-e2e.sh
 
 
@@ -137,5 +143,5 @@ notifications:
 cache:
   directories:
   - node_modules
-  - demo-shell/dist
   - tmp
+  - lib/dist

.vscode/launch.json

@@ -10,7 +10,7 @@
           "name": "e2e",
           "program": "${workspaceFolder}/node_modules/protractor/bin/protractor",
           "args": [
-              "`${workspaceFolder}/.vscode/closest-config-finder.sh ${file} protractor.conf.ts`",
+              "`${workspaceFolder}/.vscode/closest-config-finder.sh ${file} e2e/protractor.conf.js`",
               "--specs=${file}"
           ],
           "envFile": "${workspaceFolder}/.env",

angular.json

@@ -3,7 +3,7 @@
   "version": 1,
   "newProjectRoot": "lib",
   "projects": {
-    "dist": {
+    "demoshell": {
       "root": "demo-shell",
       "sourceRoot": "demo-shell/src",
       "projectType": "application",
@@ -11,248 +11,11 @@
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
-            "outputPath": "demo-shell/dist",
-            "index": "demo-shell/src/index.html",
-            "main": "demo-shell/src/main.ts",
-            "tsConfig": "demo-shell/src/tsconfig.app.json",
-            "polyfills": "demo-shell/src/polyfills.ts",
-            "stylePreprocessorOptions": {
-              "includePaths": [
-                "demo-shell/src/node_modules"
-              ]
-            },
-            "assets": [
-              "demo-shell/src/assets",
-              "demo-shell/src/favicon-96x96.png",
-              "demo-shell/src/app.config.json",
-              {
-                "glob": "**/*",
-                "input": "demo-shell/resources",
-                "output": "/resources"
-              },
-              {
-                "glob": "**/*",
-                "input": "demo-shell/src/app/components/lazy-loading/i18n",
-                "output": "/resources/lazy-loading/i18n"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-core/prebuilt-themes",
-                "output": "/assets/prebuilt-themes"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-core/bundles/assets",
-                "output": "/assets"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-insights/bundles/assets",
-                "output": "/assets"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-process-services/bundles/assets",
-                "output": "/assets"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-process-services-cloud/bundles/assets",
-                "output": "/assets"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-content-services/bundles/assets",
-                "output": "/assets"
-              },
-              {
-                "glob": "pdf.worker.min.js",
-                "input": "node_modules/pdfjs-dist/build",
-                "output": "/"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/ngx-monaco-editor/assets/monaco",
-                "output": "/assets/monaco/"
-              }
-            ],
-            "styles": [
-              "demo-shell/src/assets/fonts/material-icons/material-icons.css",
-              "demo-shell/src/assets/fonts/muli/muli.css",
-              "demo-shell/src/styles.scss",
-              "demo-shell/src/custom-style.scss"
-            ],
-            "scripts": [
-              "node_modules/pdfjs-dist/build/pdf.js",
-              "node_modules/pdfjs-dist/web/pdf_viewer.js",
-              "node_modules/raphael/raphael.min.js",
-              "node_modules/moment/min/moment.min.js"
-            ]
-          },
-          "configurations": {
-            "production": {
-              "optimization": true,
-              "outputHashing": "all",
-              "sourceMap": false,
-              "extractCss": true,
-              "namedChunks": false,
             "aot": true,
-              "extractLicenses": true,
+            "outputPath": "dist/demo-shell",
-              "vendorChunk": true,
-              "buildOptimizer": true,
-              "verbose": false,
-              "budgets": [
-                {
-                  "type": "bundle",
-                  "name": "vendor",
-                  "baseline": "4.2MB",
-                  "warning": "4.5MB",
-                  "error": "5.0MB"
-                }
-              ],
-              "fileReplacements": [
-                {
-                  "replace": "demo-shell/src/environments/environment.ts",
-                  "with": "demo-shell/src/environments/environment.prod.ts"
-                }
-              ]
-            },
-            "e2e": {
-              "fileReplacements": [
-                {
-                  "replace": "demo-shell/src/environments/environment.ts",
-                  "with": "demo-shell/src/environments/environment.e2e.ts"
-                }
-              ]
-            }
-          }
-        },
-        "serve": {
-          "builder": "@angular-devkit/build-angular:dev-server",
-          "options": {
-            "browserTarget": "dist:build",
-            "host": "0.0.0.0",
-            "port": 3000,
-            "proxyConfig": "demo-shell/proxy.conf.js",
-            "disableHostCheck": true
-          },
-          "configurations": {
-            "production": {
-              "browserTarget": "dist:build:production"
-            },
-            "e2e": {
-              "browserTarget": "dist:build:e2e"
-            }
-          }
-        },
-        "extract-i18n": {
-          "builder": "@angular-devkit/build-angular:extract-i18n",
-          "options": {
-            "browserTarget": "dist:build"
-          }
-        },
-        "test": {
-          "builder": "@angular-devkit/build-angular:karma",
-          "options": {
-            "main": "demo-shell/src/test.ts",
-            "karmaConfig": "./demo-shell/karma.conf.js",
-            "polyfills": "demo-shell/src/polyfills.ts",
-            "tsConfig": "demo-shell/src/tsconfig.spec.json",
-            "scripts": [
-              "node_modules/pdfjs-dist/build/pdf.js",
-              "node_modules/pdfjs-dist/web/pdf_viewer.js",
-              "node_modules/raphael/raphael.min.js",
-              "node_modules/moment/min/moment.min.js"
-            ],
-            "styles": [
-              "demo-shell/src/assets/fonts/material-icons/material-icons.css",
-              "demo-shell/src/assets/fonts/muli/muli.css",
-              "demo-shell/src/styles.scss",
-              "demo-shell/src/custom-style.scss"
-            ],
-            "assets": [
-              "demo-shell/src/assets",
-              "demo-shell/src/favicon-96x96.png",
-              "demo-shell/src/app.config.json",
-              {
-                "glob": "**/*",
-                "input": "demo-shell/resources",
-                "output": "/resources"
-              },
-              {
-                "glob": "**/*",
-                "input": "demo-shell/src/app/components/lazy-loading/i18n",
-                "output": "/resources/lazy-loading/i18n"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-core/prebuilt-themes",
-                "output": "/assets/prebuilt-themes"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-core/bundles/assets",
-                "output": "/assets"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-insights/bundles/assets",
-                "output": "/assets"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-process-services/bundles/assets",
-                "output": "/assets"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-process-services-cloud/bundles/assets",
-                "output": "/assets"
-              },
-              {
-                "glob": "**/*",
-                "input": "node_modules/@alfresco/adf-content-services/bundles/assets",
-                "output": "/assets"
-              },
-              {
-                "glob": "pdf.worker.min.js",
-                "input": "node_modules/pdfjs-dist/build",
-                "output": "/"
-              },
-              {
-                "glob": "**/*",
-                "input": ".node_modules/ngx-monaco-editor/assets/monaco",
-                "output": "/assets/monaco/"
-              }
-            ]
-          }
-        },
-        "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
-          "options": {
-            "tsConfig": [
-              "./demo-shell/src/tsconfig.app.json"
-            ],
-            "exclude": [
-              "**/node_modules/**/*",
-              "package.json"
-            ]
-          }
-        }
-      }
-    },
-    "dev": {
-      "root": "demo-shell",
-      "sourceRoot": "demo-shell/src",
-      "projectType": "application",
-      "architect": {
-        "build": {
-          "builder": "@angular-devkit/build-angular:browser",
-          "options": {
-            "outputPath": "demo-shell/dist",
             "index": "demo-shell/src/index.html",
             "main": "demo-shell/src/main.ts",
-            "tsConfig": "demo-shell/src/tsconfig.dev.json",
+            "tsConfig": "tsconfig.dev.json",
             "polyfills": "demo-shell/src/polyfills.ts",
             "stylePreprocessorOptions": {
               "includePaths": [
@@ -359,6 +122,12 @@
           },
           "configurations": {
             "production": {
+              "budgets": [
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb"
+                }
+              ],
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
@@ -377,6 +146,12 @@
               ]
             },
             "e2e": {
+              "budgets": [
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb"
+                }
+              ],
               "fileReplacements": [
                 {
                   "replace": "demo-shell/src/environments/environment.ts",
@@ -389,7 +164,7 @@
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
-            "browserTarget": "dev:build",
+            "browserTarget": "demoshell:build",
             "host": "0.0.0.0",
             "port": 3000,
             "proxyConfig": "demo-shell/proxy.conf.js",
@@ -397,19 +172,13 @@
           },
           "configurations": {
             "production": {
-              "browserTarget": "dev:build:production"
+              "browserTarget": "demoshell:build:production"
             },
             "e2e": {
-              "browserTarget": "dev:build:e2e"
+              "browserTarget": "demoshell:build:e2e"
             }
           }
         },
-        "extract-i18n": {
-          "builder": "@angular-devkit/build-angular:extract-i18n",
-          "options": {
-            "browserTarget": "dev:build"
-          }
-        },
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
@@ -520,7 +289,7 @@
           "builder": "@angular-devkit/build-angular:tslint",
           "options": {
             "tsConfig": [
-              "./demo-shell/src/tsconfig.app.json"
+              "tsconfig.dev.json"
             ],
             "exclude": [
               "**/node_modules/**/*",
@@ -530,7 +299,7 @@
         }
       }
     },
-    "lib-e2e-test": {
+    "demoshell-e2e": {
       "root": "demo-shell",
       "sourceRoot": "./demo-shell",
       "projectType": "application",
@@ -551,7 +320,7 @@
         "e2e": {
           "builder": "@angular-devkit/build-angular:protractor",
           "options": {
-            "protractorConfig": "./protractor.conf.ts",
+            "protractorConfig": "./e2e/protractor.conf.js",
             "devServerTarget": "lib-e2e-test:serve"
           }
         },
@@ -582,7 +351,8 @@
           },
           "configurations": {
             "production": {
-              "project": "lib/core/ng-package.json"
+              "project": "lib/core/ng-package.json",
+              "tsConfig": "lib/core/tsconfig.lib.prod.json"
             }
           }
         },
@@ -601,7 +371,7 @@
           "options": {
             "tsConfig": [
               "lib/core/tsconfig.lib.json",
-              "lib/core/tsconfig.lib.json"
+              "lib/core/tsconfig.spec.json"
             ],
             "exclude": [
               "**/node_modules/**"
@@ -624,7 +394,8 @@
           },
           "configurations": {
             "production": {
-              "project": "lib/content-services/ng-package.json"
+              "project": "lib/content-services/ng-package.json",
+              "tsConfig": "lib/content-services/tsconfig.lib.prod.json"
             }
           }
         },
@@ -666,7 +437,8 @@
           },
           "configurations": {
             "production": {
-              "project": "lib/process-services/ng-package.json"
+              "project": "lib/process-services/ng-package.json",
+              "tsConfig": "lib/process-services/tsconfig.lib.prod.json"
             }
           }
         },
@@ -708,7 +480,8 @@
           },
           "configurations": {
             "production": {
-              "project": "lib/process-services-cloud/ng-package.json"
+              "project": "lib/process-services-cloud/ng-package.json",
+              "tsConfig": "lib/process-services-cloud/tsconfig.lib.prod.json"
             }
           }
         },
@@ -750,7 +523,8 @@
           },
           "configurations": {
             "production": {
-              "project": "lib/insights/ng-package.json"
+              "project": "lib/insights/ng-package.json",
+              "tsConfig": "lib/insights/tsconfig.lib.prod.json"
             }
           }
         },
@@ -780,7 +554,7 @@
     },
     "extensions": {
       "root": "lib/extensions",
-      "sourceRoot": "lib/extensions/src/lib",
+      "sourceRoot": "lib/extensions/src",
       "projectType": "library",
       "prefix": "adf",
       "architect": {
@@ -789,6 +563,11 @@
           "options": {
             "tsConfig": "lib/extensions/tsconfig.lib.json",
             "project": "lib/extensions/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "lib/extensions/tsconfig.lib.prod.json"
+            }
           }
         },
         "test": {
@@ -826,14 +605,11 @@
           "options": {
             "tsConfig": "lib/testing/tsconfig.lib.json",
             "project": "lib/testing/ng-package.json"
-          }
           },
-        "test": {
+          "configurations": {
-          "builder": "@angular-devkit/build-angular:karma",
+            "production": {
-          "options": {
+              "tsConfig": "lib/testing/tsconfig.lib.prod.json"
-            "main": "lib/testing/src/test.ts",
+            }
-            "tsConfig": "lib/testing/tsconfig.spec.json",
-            "karmaConfig": "lib/testing/karma.conf.js"
           }
         },
         "lint": {
@@ -860,10 +636,15 @@
           "builder": "@angular-devkit/build-ng-packagr:build",
           "options": {
             "tsConfig": "lib/cli/tsconfig.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "lib/cli/tsconfig.lib.prod.json"
+            }
           }
         }
       }
     }
   },
-  "defaultProject": "dist"
+  "defaultProject": "demoshell"
 }

cspell.json

@@ -6,10 +6,8 @@
     "CSRF",
     "glyphicon",
     "sharedlinks",
-    "Redistributable",
     "fullscreen",
     "sidenav",
-    "injectable",
     "truthy",
     "cryptodoc",
     "mysites",
@@ -33,16 +31,7 @@
     "SOLR",
     "unshare",
     "validators",
-    "guid",
-    "polyfill",
-    "polyfills",
-    "jsonp",
-    "hammerjs",
     "pdfjs",
-    "xpath",
-    "tooltip",
-    "tooltips",
-    "unindent",
     "exif",
     "cardview",
     "webm",
@@ -146,7 +135,8 @@
     "html",
     "en-gb",
     "en_US",
-    "softwareTerms"
+    "softwareTerms",
+    "node"
   ],
   "ignorePaths": [
     "lib/{content-services,core,extensions,insights,process-services}/**/*.spec.ts",

demo-shell/src/app/app-extension.module.ts

@@ -1,27 +0,0 @@
-/*!
- * @license
- * Copyright 2019 Alfresco Software, Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { NgModule } from '@angular/core';
-import { AcaMonacoModule } from 'adf-monaco-extension';
-
-@NgModule({
-    imports: [
-        AcaMonacoModule
-    ]
-})
-export class AppExtensionsModule {
-}

demo-shell/src/app/app.component.ts

@@ -22,7 +22,7 @@ import {
     PageTitleService
 } from '@alfresco/adf-core';
 import { Router } from '@angular/router';
-import { MatDialog } from '@angular/material';
+import { MatDialog } from '@angular/material/dialog';
 
 @Component({
     selector: 'app-root',

demo-shell/src/app/app.module.ts

@@ -47,10 +47,8 @@ import { AppsViewComponent } from './components/process-service/apps-view.compon
 import { FilesComponent } from './components/files/files.component';
 import { VersionManagerDialogAdapterComponent } from './components/files/version-manager-dialog-adapter.component';
 import { MetadataDialogAdapterComponent } from './components/files/metadata-dialog-adapter.component';
-
 import { ThemePickerModule } from './components/theme-picker/theme-picker';
-
+import { appRoutes } from './app.routes';
-import { routing } from './app.routes';
 import { TaskAttachmentsComponent } from './components/process-service/task-attachments.component';
 import { ProcessAttachmentsComponent } from './components/process-service/process-attachments.component';
 import { SharedLinkViewComponent } from './components/shared-link-view/shared-link-view.component';
@@ -60,7 +58,6 @@ import { MonacoEditorModule } from 'ngx-monaco-editor';
 import { ContentModule } from '@alfresco/adf-content-services';
 import { InsightsModule } from '@alfresco/adf-insights';
 import { ProcessModule } from '@alfresco/adf-process-services';
-import { AppExtensionsModule } from './app-extension.module';
 import { TreeViewSampleComponent } from './components/tree-view/tree-view-sample.component';
 import { CloudLayoutComponent } from './components/cloud/cloud-layout.component';
 import { AppsCloudDemoComponent } from './components/cloud/apps-cloud-demo.component';
@@ -81,9 +78,9 @@ import { FormCloudDemoComponent } from './components/app-layout/cloud/form-demo/
 import { environment } from '../environments/environment';
 import { AppCloudSharedModule } from './components/cloud/shared/cloud.shared.module';
 import { DemoErrorComponent } from './components/error/demo-error.component';
-import {
+import { ProcessServicesCloudModule } from '@alfresco/adf-process-services-cloud';
-    ProcessServicesCloudModule
+import { FilteredSearchComponent } from './components/files/filtered-search.component';
-} from '@alfresco/adf-process-services-cloud';
+import { RouterModule } from '@angular/router';
 
 import { registerLocaleData } from '@angular/common';
 import localeFr from '@angular/common/locales/fr';
@@ -102,7 +99,6 @@ import localePl from '@angular/common/locales/pl';
 import localeFi from '@angular/common/locales/fi';
 import localeDa from '@angular/common/locales/da';
 import localeSv from '@angular/common/locales/sv';
-import { FilteredSearchComponent } from './components/files/filtered-search.component';
 
 registerLocaleData(localeFr);
 registerLocaleData(localeDe);
@@ -126,11 +122,10 @@ registerLocaleData(localeSv);
         BrowserModule,
         environment.e2e ? NoopAnimationsModule : BrowserAnimationsModule,
         ReactiveFormsModule,
-        routing,
+        RouterModule.forRoot(appRoutes, { initialNavigation: true }),
         FormsModule,
         HttpClientModule,
         MaterialModule,
-        AppExtensionsModule,
         FlexLayoutModule,
         TranslateModule.forRoot(),
         CoreModule.forRoot(),
@@ -215,10 +210,6 @@ registerLocaleData(localeSv);
             }
         }
     ],
-    entryComponents: [
-        VersionManagerDialogAdapterComponent,
-        MetadataDialogAdapterComponent
-    ],
     bootstrap: [AppComponent]
 })
 export class AppModule {

demo-shell/src/app/app.routes.ts

@@ -15,15 +15,8 @@
  * limitations under the License.
  */
 
-import { ModuleWithProviders } from '@angular/core';
+import { Routes } from '@angular/router';
-import { RouterModule, Routes } from '@angular/router';
+import { AuthGuard, AuthGuardEcm, ErrorContentComponent, AuthGuardBpm, AuthGuardSsoRoleService } from '@alfresco/adf-core';
-import {
-    AuthGuard,
-    AuthGuardEcm,
-    ErrorContentComponent,
-    AuthGuardBpm,
-    AuthGuardSsoRoleService
-} from '@alfresco/adf-core';
 import { AppLayoutComponent } from './components/app-layout/app-layout.component';
 import { HomeComponent } from './components/home/home.component';
 import { LogoutComponent } from './components/logout/logout.component';
@@ -60,12 +53,13 @@ import { ConfirmDialogExampleComponent } from './components/confirm-dialog/confi
 import { DemoErrorComponent } from './components/error/demo-error.component';
 import { TaskHeaderCloudDemoComponent } from './components/cloud/task-header-cloud-demo.component';
 import { FilteredSearchComponent } from './components/files/filtered-search.component';
+
 export const appRoutes: Routes = [
-    { path: 'login', loadChildren: 'app/components/login/login.module#AppLoginModule' },
+    { path: 'login', loadChildren: () => import('./components/login/login.module').then(m => m.AppLoginModule) },
     { path: 'logout', component: LogoutComponent },
     {
         path: 'settings',
-        loadChildren: 'app/components/settings/settings.module#AppSettingsModule'
+        loadChildren: () => import('./components/settings/settings.module').then(m => m.AppSettingsModule)
     },
     {
         path: 'files/:nodeId/view',
@@ -76,7 +70,7 @@ export const appRoutes: Routes = [
         children: [
             {
                 path: '',
-                loadChildren: 'app/components/file-view/file-view.module#FileViewModule'
+                loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule)
             }
         ]
     },
@@ -88,7 +82,7 @@ export const appRoutes: Routes = [
         children: [
             {
                 path: '',
-                loadChildren: 'app/components/file-view/file-view.module#FileViewModule'
+                loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule)
             }
         ]
     },
@@ -101,14 +95,14 @@ export const appRoutes: Routes = [
             {
                 path: 'breadcrumb',
                 canActivate: [AuthGuardEcm],
-                loadChildren: 'app/components/breadcrumb-demo/breadcrumb-demo.module#AppBreadcrumbModule'
+                loadChildren: () => import('./components/breadcrumb-demo/breadcrumb-demo.module').then(m => m.AppBreadcrumbModule)
             },
             {
                 path: 'notifications',
                 children: [
                     {
                         path: '',
-                        loadChildren: 'app/components/notifications/notifications.module#AppNotificationsModule'
+                        loadChildren: () => import('./components/notifications/notifications.module').then(m => m.AppNotificationsModule)
                     }
                 ]
             },
@@ -117,7 +111,7 @@ export const appRoutes: Routes = [
                 children: [
                     {
                         path: '',
-                        loadChildren: 'app/components/config-editor/config-editor.module#AppConfigEditorModule'
+                        loadChildren: () => import('./components/config-editor/config-editor.module').then(m => m.AppConfigEditorModule)
                     }
                 ]
             },
@@ -126,7 +120,7 @@ export const appRoutes: Routes = [
                 children: [
                     {
                         path: '',
-                        loadChildren: 'app/components/pipes/pipes.module#AppPipesModule'
+                        loadChildren: () => import('./components/pipes/pipes.module').then(m => m.AppPipesModule)
                     }
                 ]
             },
@@ -135,7 +129,7 @@ export const appRoutes: Routes = [
                 children: [
                     {
                         path: '',
-                        loadChildren: 'app/components/card-view/card-view.module#AppCardViewModule'
+                        loadChildren: () => import('./components/card-view/card-view.module').then(m => m.AppCardViewModule)
                     }
                 ]
             },
@@ -144,7 +138,7 @@ export const appRoutes: Routes = [
                 children: [
                     {
                         path: '',
-                        loadChildren: 'app/components/sites/sites.module#SitesModule'
+                        loadChildren: () => import('./components/sites/sites.module').then(m => m.SitesModule)
                     }
                 ]
             },
@@ -153,7 +147,7 @@ export const appRoutes: Routes = [
                 children: [
                     {
                         path: '',
-                        loadChildren: 'app/components/header-data/header-data.module#AppHeaderDataModule'
+                        loadChildren: () => import('./components/header-data/header-data.module').then(m => m.AppHeaderDataModule)
                     }
                 ]
             },
@@ -184,7 +178,7 @@ export const appRoutes: Routes = [
                     },
                     {
                         path: 'community',
-                        loadChildren: 'app/components/cloud/community/community.module#AppCommunityModule'
+                        loadChildren: () => import('./components/cloud/community/community.module').then(m => m.AppCommunityModule)
                     },
                     {
                         path: ':appName',
@@ -232,7 +226,7 @@ export const appRoutes: Routes = [
             },
             {
                 path: 'node-selector',
-                loadChildren: 'app/components/content-node-selector/content-node-selector.module#AppContentNodeSelectorModule'
+                loadChildren: () => import('./components/content-node-selector/content-node-selector.module').then(m => m.AppContentNodeSelectorModule)
             },
             {
                 path: 'confirm-dialog',
@@ -240,12 +234,12 @@ export const appRoutes: Routes = [
             },
             {
                 path: 'settings-layout',
-                loadChildren: 'app/components/settings/settings.module#AppSettingsModule'
+                loadChildren: () => import('./components/settings/settings.module').then(m => m.AppSettingsModule)
             },
             {
                 path: 'trashcan',
                 canActivate: [AuthGuardEcm],
-                loadChildren: 'app/components/trashcan/trashcan.module#AppTrashcanModule'
+                loadChildren: () => import('./components/trashcan/trashcan.module').then(m => m.AppTrashcanModule)
             },
             {
                 path: 'files',
@@ -270,7 +264,7 @@ export const appRoutes: Routes = [
             {
                 path: 'extensions/document-list/presets',
                 canActivate: [AuthGuardEcm],
-                loadChildren: './components/document-list/extension-presets/extension-presets.module#ExtensionPresetsModule'
+                loadChildren: () => import('./components/document-list/extension-presets/extension-presets.module').then(m => m.ExtensionPresetsModule)
             },
             {
                 path: 'files/:id',
@@ -285,16 +279,16 @@ export const appRoutes: Routes = [
             {
                 path: 'dl-custom-sources',
                 canActivate: [AuthGuardEcm],
-                loadChildren: 'app/components/files/custom-sources.module#AppCustomSourcesModule'
+                loadChildren: () => import('./components/files/custom-sources.module').then(m => m.AppCustomSourcesModule)
 
             },
             {
                 path: 'datatable',
-                loadChildren: 'app/components/datatable/datatable.module#AppDataTableModule'
+                loadChildren: () => import('./components/datatable/datatable.module').then(m => m.AppDataTableModule)
             },
             {
                 path: 'datatable/dnd',
-                loadChildren: './components/datatable/drag-and-drop/datatable-dnd.module#AppDataTableDndModule'
+                loadChildren: () => import('./components/datatable/drag-and-drop/datatable-dnd.module').then(m => m.AppDataTableDndModule)
             },
             {
                 path: 'search',
@@ -368,17 +362,17 @@ export const appRoutes: Routes = [
             {
                 path: 'webscript',
                 canActivate: [AuthGuardEcm],
-                loadChildren: 'app/components/webscript/webscript.module#AppWebScriptModule'
+                loadChildren: () => import('./components/webscript/webscript.module').then(m => m.AppWebScriptModule)
             },
             {
                 path: 'tag',
                 canActivate: [AuthGuardEcm],
-                loadChildren: 'app/components/tag/tag.module#AppTagModule'
+                loadChildren: () => import('./components/tag/tag.module').then(m => m.AppTagModule)
             },
             {
                 path: 'social',
                 canActivate: [AuthGuardEcm],
-                loadChildren: 'app/components/social/social.module#AppSocialModule'
+                loadChildren: () => import('./components/social/social.module').then(m => m.AppSocialModule)
             },
             {
                 path: 'permissions/:id',
@@ -392,11 +386,11 @@ export const appRoutes: Routes = [
             },
             {
                 path: 'about',
-                loadChildren: 'app/components/about/about.module#AppAboutModule'
+                loadChildren: () => import('./components/about/about.module').then(m => m.AppAboutModule)
             },
             {
                 path: 'icons',
-                loadChildren: './components/icons/icons.module#AppIconsModule'
+                loadChildren: () => import('./components/icons/icons.module').then(m => m.AppIconsModule)
             },
             { path: 'form-cloud', component: FormCloudDemoComponent },
             { path: 'form', component: FormComponent },
@@ -413,11 +407,11 @@ export const appRoutes: Routes = [
             },
             {
                 path: 'datatable-lazy',
-                loadChildren: 'app/components/lazy-loading/lazy-loading.module#LazyLoadingModule'
+                loadChildren: () => import('./components/lazy-loading/lazy-loading.module').then(m => m.LazyLoadingModule)
             },
             {
                 path: 'copy-content',
-                loadChildren: 'app/components/datatable/copy-content/datatable.module#AppDataTableCopyModule'
+                loadChildren: () => import('./components/datatable/copy-content/datatable.module').then(m => m.AppDataTableCopyModule)
             },
             {
                 path: 'template-list',
@@ -426,12 +420,12 @@ export const appRoutes: Routes = [
             {
                 path: 'task-list',
                 canActivate: [AuthGuardBpm],
-                loadChildren: 'app/components/task-list-demo/task-list.module#AppTaskListModule'
+                loadChildren: () => import('./components/task-list-demo/task-list.module').then(m => m.AppTaskListModule)
             },
             {
                 path: 'process-list',
                 canActivate: [AuthGuardBpm],
-                loadChildren: 'app/components/process-list-demo/process-list.module#AppProcessListModule'
+                loadChildren: () => import('./components/process-list-demo/process-list.module').then(m => m.AppProcessListModule)
             },
             {
                 path: 'error/no-authorization',
@@ -459,5 +453,3 @@ export const appRoutes: Routes = [
         redirectTo: 'error/404'
     }
 ];
-
-export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes, { initialNavigation: true });

demo-shell/src/app/components/card-view/card-view.component.ts

@@ -40,7 +40,7 @@ import { takeUntil } from 'rxjs/operators';
 })
 export class CardViewComponent implements OnInit, OnDestroy {
 
-    @ViewChild('console') console: ElementRef;
+    @ViewChild('console', { static: true }) console: ElementRef;
 
     isEditable = true;
     properties: any;

demo-shell/src/app/components/cloud/people-groups-cloud-demo.component.html

@@ -6,14 +6,14 @@
     <mat-card-content>
         <br>
         <mat-radio-group (change)="onChangePeopleMode($event)">
-            <mat-radio-button checked="true" class="app-people-single-mode" data-automation-id="app-people-single-mode" value="single">{{
+            <mat-radio-button [checked]="true" class="app-people-single-mode" data-automation-id="app-people-single-mode" value="single">{{
                 'PEOPLE_GROUPS_CLOUD.SINGLE' | translate }}</mat-radio-button>
             <mat-radio-button class="app-people-multiple-mode" data-automation-id="app-people-multiple-mode" value="multiple">{{
                 'PEOPLE_GROUPS_CLOUD.MULTI' | translate }}</mat-radio-button>
         </mat-radio-group>
         <div class="app-people-control-options">
             <mat-radio-group (change)="onChangePeopleFilterMode($event)">
-                <mat-radio-button checked="true" class="app-people-single-mode" value="appName">{{
+                <mat-radio-button [checked]="true" class="app-people-single-mode" value="appName">{{
                     'PEOPLE_GROUPS_CLOUD.APP_FILTER_MODE' | translate }}</mat-radio-button>
                 <mat-radio-button class="app-people-multiple-mode" data-automation-id="app-people-filter-role" value="role">{{
                     'PEOPLE_GROUPS_CLOUD.ROLE_FILTER_MODE' | translate }}</mat-radio-button>
@@ -77,14 +77,14 @@
     <mat-card-content>
         <br>
         <mat-radio-group (change)="onChangeGroupsMode($event)">
-            <mat-radio-button checked="true" class="app-people-single-mode" data-automation-id="app-group-single-mode" value="single">{{
+            <mat-radio-button [checked]="true" class="app-people-single-mode" data-automation-id="app-group-single-mode" value="single">{{
                 'PEOPLE_GROUPS_CLOUD.SINGLE' | translate }}</mat-radio-button>
             <mat-radio-button class="app-people-multiple-mode" data-automation-id="app-group-multiple-mode" value="multiple">{{
                 'PEOPLE_GROUPS_CLOUD.MULTI' | translate }}</mat-radio-button>
         </mat-radio-group>
         <div class="app-groups-control-options">
             <mat-radio-group (change)="onChangeGroupsFilterMode($event)">
-                <mat-radio-button checked="true" class="app-people-single-mode" value="appName">{{
+                <mat-radio-button [checked]="true" class="app-people-single-mode" value="appName">{{
                     'PEOPLE_GROUPS_CLOUD.APP_FILTER_MODE' | translate }}</mat-radio-button>
                 <mat-radio-button class="app-people-multiple-mode" data-automation-id="app-group-filter-role" value="role">{{
                     'PEOPLE_GROUPS_CLOUD.ROLE_FILTER_MODE' | translate }}</mat-radio-button>

demo-shell/src/app/components/cloud/people-groups-cloud-demo.component.ts

@@ -17,7 +17,8 @@
 
 import { Component, ViewEncapsulation } from '@angular/core';
 import { ComponentSelectionMode } from '@alfresco/adf-process-services-cloud';
-import { MatRadioChange, MatCheckboxChange } from '@angular/material';
+import { MatCheckboxChange } from '@angular/material/checkbox';
+import { MatRadioChange } from '@angular/material/radio';
 import { IdentityGroupModel, IdentityUserModel } from '@alfresco/adf-core';
 
 @Component({

demo-shell/src/app/components/cloud/shared/cloud.shared.module.ts

@@ -18,7 +18,10 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { CloudSettingsComponent } from './cloud-settings.component';
-import { MatDialogModule, MatInputModule, MatSelectModule, MatSlideToggleModule } from '@angular/material';
+import { MatDialogModule } from '@angular/material/dialog';
+import { MatInputModule } from '@angular/material/input';
+import { MatSelectModule } from '@angular/material/select';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
 import { CoreModule } from '@alfresco/adf-core';
 import { FlexLayoutModule } from '@angular/flex-layout';
 

demo-shell/src/app/components/cloud/start-process-cloud-demo.component.ts

@@ -19,7 +19,7 @@ import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { NotificationService, AppConfigService } from '@alfresco/adf-core';
 import { CloudLayoutService } from './services/cloud-layout.service';
-import { PreviewService } from 'app/services/preview.service';
+import { PreviewService } from '../../services/preview.service';
 
 @Component({
     templateUrl: './start-process-cloud-demo.component.html',

demo-shell/src/app/components/cloud/task-details-cloud-demo.component.ts

@@ -19,7 +19,7 @@ import { Component, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { NotificationService } from '@alfresco/adf-core';
 import { TaskHeaderCloudComponent } from '@alfresco/adf-process-services-cloud';
-import { PreviewService } from 'app/services/preview.service';
+import { PreviewService } from '../../services/preview.service';
 
 @Component({
     templateUrl: './task-details-cloud-demo.component.html',
@@ -27,7 +27,7 @@ import { PreviewService } from 'app/services/preview.service';
 })
 export class TaskDetailsCloudDemoComponent {
 
-    @ViewChild('taskHeader')
+    @ViewChild('taskHeader', { static: true })
     taskHeader: TaskHeaderCloudComponent;
 
     taskId: string;

demo-shell/src/app/components/cloud/task-header-cloud-demo.component.ts

@@ -24,7 +24,7 @@ import { FormControl } from '@angular/forms';
     styleUrls: ['./task-header-cloud-demo.component.scss']
 })
 export class TaskHeaderCloudDemoComponent {
-    @ViewChild('taskHeader')
+    @ViewChild('taskHeader', { static: true })
     taskHeader: TaskHeaderCloudComponent;
 
     appName: string;

demo-shell/src/app/components/confirm-dialog/confirm-dialog-example.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component } from '@angular/core';
-import { MatDialog } from '@angular/material';
+import { MatDialog } from '@angular/material/dialog';
 import { ConfirmDialogComponent } from '@alfresco/adf-content-services';
 
 @Component({

demo-shell/src/app/components/document-list/extension-presets/extension-presets.module.ts

@@ -42,9 +42,6 @@ const routes: Routes = [
     declarations: [
         ExtensionPresetsComponent,
         NameColumnComponent
-    ],
-    entryComponents: [
-        NameColumnComponent
     ]
 })
 export class ExtensionPresetsModule {

demo-shell/src/app/components/file-view/file-view.component.ts

@@ -18,7 +18,7 @@
 import { Component, OnInit, ViewEncapsulation } from '@angular/core';
 import { ActivatedRoute, Router, PRIMARY_OUTLET } from '@angular/router';
 import { ContentService, AllowableOperationsEnum, PermissionsEnum, NodesApiService } from '@alfresco/adf-core';
-import { MatSnackBar } from '@angular/material';
+import { MatSnackBar } from '@angular/material/snack-bar';
 import { PreviewService } from '../../services/preview.service';
 
 @Component({

demo-shell/src/app/components/files/custom-sources.component.ts

@@ -27,7 +27,7 @@ export class CustomSourcesComponent {
     @Input()
     selectedSource = '-recent-';
 
-    @ViewChild('customSourcesDocumentList')
+    @ViewChild('customSourcesDocumentList', { static: true })
     documentList: DocumentListComponent;
 
     sources = [

demo-shell/src/app/components/files/files.component.html

@@ -200,13 +200,6 @@
                         <mat-icon>create</mat-icon>
                         <span>{{ 'DOCUMENT_LIST.TOOLBAR.EDIT_FOLDER' | translate }}</span>
                     </button>
-                    <button mat-menu-item
-                            [disabled]="!hasSelection(documentList.selection)"
-                            title="Download"
-                            (click)="downloadNodes(documentList.selection)">
-                        <mat-icon>get_app</mat-icon>
-                        <span>{{ 'DOCUMENT_LIST.TOOLBAR.DOWNLOAD' | translate }}</span>
-                    </button>
                     <button mat-menu-item
                             adf-check-allowable-operation="delete"
                             [adf-nodes]="documentList.selection"
@@ -540,7 +533,7 @@
         </section>
 
         <section>
-            <mat-slide-toggle [color]="'primary'" [(ngModel)]="multiselect">
+            <mat-slide-toggle data-automation-id="multiSelectToggle" [color]="'primary'" [(ngModel)]="multiselect">
                 {{'DOCUMENT_LIST.MULTISELECT_CHECKBOXES' | translate}}
             </mat-slide-toggle>
         </section>

demo-shell/src/app/components/files/files.component.ts

@@ -21,7 +21,7 @@ import {
 } from '@angular/core';
 import { Location } from '@angular/common';
 
-import { MatDialog } from '@angular/material';
+import { MatDialog } from '@angular/material/dialog';
 import { ActivatedRoute, Params, Router } from '@angular/router';
 import { MinimalNodeEntity, NodePaging, Pagination, MinimalNodeEntryEntity, SiteEntry, SearchEntry } from '@alfresco/js-api';
 import {
@@ -184,13 +184,13 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
     @Output()
     deleteElementSuccess: EventEmitter<any> = new EventEmitter();
 
-    @ViewChild('documentList')
+    @ViewChild('documentList', { static: true })
     documentList: DocumentListComponent;
 
     @ViewChild('standardPagination')
     standardPagination: PaginationComponent;
 
-    @ViewChild(InfinitePaginationComponent)
+    @ViewChild(InfinitePaginationComponent, { static: true })
     infinitePaginationComponent: InfinitePaginationComponent;
 
     @ViewChild(HighlightDirective)

demo-shell/src/app/components/files/metadata-dialog-adapter.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, Inject, ViewEncapsulation } from '@angular/core';
-import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { MinimalNodeEntryEntity } from '@alfresco/js-api';
 
 @Component({

demo-shell/src/app/components/header-data/header-data.service.ts

@@ -20,6 +20,7 @@ import { Injectable, Output, EventEmitter } from '@angular/core';
 @Injectable({
     providedIn: 'root'
 })
+// tslint:disable-next-line: directive-class-suffix
 export class HeaderDataService {
 
     show = true;

demo-shell/src/app/components/icons/icons.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, OnInit } from '@angular/core';
-import { MatIconRegistry } from '@angular/material';
+import { MatIconRegistry } from '@angular/material/icon';
 import { DomSanitizer } from '@angular/platform-browser';
 
 @Component({

demo-shell/src/app/components/login/login.component.html

@@ -4,7 +4,7 @@
     <p class="app-toggle">
         <mat-slide-toggle
             id="switch3"
-            [color]="'primary'"
+            color="primary"
             (change)="toggleCSRF()"
             [checked]="!disableCsrf">
             CSRF
@@ -13,7 +13,7 @@
     <p class="app-toggle">
         <mat-slide-toggle
             id="switch4"
-            [color]="'primary'"
+            color="primary"
             (change)="toggleFooter()"
             [checked]="showFooter">
             {{ 'LOGIN.LOGIN_FOOTER'| translate }}
@@ -22,7 +22,7 @@
     <p class="app-toggle">
         <mat-slide-toggle
             id="adf-toggle-show-rememberme"
-            [color]="'primary'"
+            color="primary"
             (change)="toggleRememberMe()"
             [checked]="showRememberMe">
             {{ 'LOGIN.SHOW_REMEMBERME'| translate }}
@@ -31,7 +31,7 @@
     <p class="app-toggle">
         <mat-slide-toggle
             id="adf-toggle-show-successRoute"
-            [color]="'primary'"
+            color="primary"
             (change)="toggleSuccessRoute()"
             [checked]="customSuccessRoute">
             {{ 'LOGIN.SHOW_SUCCESS_ROUTE'| translate }}
@@ -51,7 +51,7 @@
     <p class="app-toggle">
         <mat-slide-toggle
             id="adf-toggle-logo"
-            [color]="'primary'"
+            color="primary"
             (change)="toggleLogo()"
             [checked]="customLogoImage">
             {{ 'LOGIN.CUSTOM_LOGO'| translate }}
@@ -77,13 +77,10 @@
 </a>
 
 <adf-login
-    #alfrescoLogin
     [successRoute]="customSuccessRouteURI"
     [logoImageUrl]="customLogoImageURL"
-    [fieldsValidation]="customValidation"
     [showLoginActions]="showFooter"
     [showRememberMe]="showFooter && showRememberMe"
-    (executeSubmit)="checkForm($event)"
     copyrightText="{{ 'application.copyright' | adfAppConfig }}"
     (success)="onLogin()"
     (error)="onError($event)">
@@ -91,7 +88,7 @@
         <p>
             <mat-slide-toggle
                 id="switch3-mobile"
-                [color]="'primary'"
+                color="primary"
                 (change)="toggleCSRF()"
                 [checked]="!disableCsrf">
                 CSRF
@@ -100,13 +97,18 @@
         <p>
             <mat-slide-toggle
                 id="switch4-mobile"
-                [color]="'primary'"
+                color="primary"
                 (change)="toggleFooter()"
                 [checked]="showFooter">
                 {{ 'LOGIN.LOGIN_FOOTER'| translate }}
             </mat-slide-toggle>
         </p>
-        <button type="button" mat-raised-button color="accent" class="app-mobile-setting-button" routerLink="/settings"
+        <button
+            type="button"
+            mat-raised-button
+            color="accent"
+            class="app-mobile-setting-button"
+            routerLink="/settings"
             data-automation-id="settings">{{ 'APP_LAYOUT.SETTINGS'| translate }}
         </button>
 

demo-shell/src/app/components/login/login.component.ts

@@ -15,8 +15,7 @@
  * limitations under the License.
  */
 
-import { Component, OnInit, ViewChild } from '@angular/core';
+import { Component } from '@angular/core';
-import { Validators } from '@angular/forms';
 import { Router } from '@angular/router';
 import { LogService } from '@alfresco/adf-core';
 
@@ -25,12 +24,8 @@ import { LogService } from '@alfresco/adf-core';
     templateUrl: './login.component.html',
     styleUrls: ['./login.component.scss']
 })
-export class LoginComponent implements OnInit {
+export class LoginComponent {
 
-    @ViewChild('alfrescoLogin')
-    alfrescoLogin: any;
-
-    customValidation: any;
     customSuccessRouteURI = '';
     customLogoImageURL = './assets/images/alfresco-logo.svg';
 
@@ -39,28 +34,17 @@ export class LoginComponent implements OnInit {
     showRememberMe = true;
     customSuccessRoute = false;
     customLogoImage = false;
-    customMinLength = 2;
 
     constructor(private router: Router,
                 private logService: LogService) {
-        this.customValidation = {
-            username: ['', Validators.compose([Validators.required, Validators.minLength(this.customMinLength)])],
-            password: ['', Validators.required]
-        };
-    }
-
-    ngOnInit() {
-        this.alfrescoLogin.addCustomValidationError('username', 'required', 'LOGIN.MESSAGES.USERNAME-REQUIRED');
-        this.alfrescoLogin.addCustomValidationError('username', 'minlength', 'LOGIN.MESSAGES.USERNAME-MIN', { minLength: this.customMinLength });
-        this.alfrescoLogin.addCustomValidationError('password', 'required', 'LOGIN.MESSAGES.PASSWORD-REQUIRED');
     }
 
     onLogin() {
         this.router.navigate(['/home']);
     }
 
-    onError($event) {
+    onError(err: any) {
-        this.logService.error($event);
+        this.logService.error(err);
     }
 
     toggleCSRF() {
@@ -88,9 +72,4 @@ export class LoginComponent implements OnInit {
             this.customLogoImageURL = null;
         }
     }
-
-    checkForm(event: any) {
-        const values = event.values;
-        this.logService.log(values);
-    }
 }

demo-shell/src/app/components/notifications/notifications.component.ts

@@ -17,7 +17,7 @@
 
 import { Component, OnInit, OnDestroy } from '@angular/core';
 import { NotificationService } from '@alfresco/adf-core';
-import { MatSnackBarConfig } from '@angular/material';
+import { MatSnackBarConfig } from '@angular/material/snack-bar';
 import { FormBuilder, FormGroup, FormControl } from '@angular/forms';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';

demo-shell/src/app/components/permissions/demo-permissions.component.ts

@@ -28,7 +28,7 @@ import { NodesApiService, NotificationService } from '@alfresco/adf-core';
 })
 export class DemoPermissionComponent implements OnInit {
 
-    @ViewChild('permissionList')
+    @ViewChild('permissionList', { static: true })
     displayPermissionComponent: PermissionListComponent;
 
     nodeId: string;

demo-shell/src/app/components/process-service/custom-editor/custom-editor.component.ts

@@ -46,8 +46,7 @@ export class CustomStencil01 extends WidgetComponent {
 
 @NgModule({
     declarations: [ CustomEditorComponent, CustomStencil01 ],
-    exports: [ CustomEditorComponent, CustomStencil01 ],
+    exports: [ CustomEditorComponent, CustomStencil01 ]
-    entryComponents: [ CustomEditorComponent, CustomStencil01 ]
 })
 export class CustomEditorsModule {
 

demo-shell/src/app/components/process-service/process-service.component.html

@@ -118,7 +118,7 @@
              label="{{'PS-TAB.PROCESSES-TAB' | translate}}">
         <div class="app-page-content" *ngIf="showProcessTab">
             <div class="app-grid" fxLayout="row" fxLayout.lt-lg="column" fxLayoutAlign="stretch">
-                <div class="app-grid-item app-processes-menu" fxFlex.gt-md="225px">
+                <div id="app-processes-menu"  class="app-grid-item app-processes-menu" fxFlex.gt-md="225px">
                     <div class="app-list-buttons">
                         <adf-sidebar-action-menu [expanded]="true" [width]="205"
                                                  title="{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.CREATE' | translate}}">
@@ -237,12 +237,12 @@
             <div class="app-grid-item app-reports-menu" fxFlex.gt-md="300px">
                 <span><h5>Report List</h5></span>
                 <mat-divider></mat-divider>
-                <adf-analytics-report-list
+                <!-- <adf-analytics-report-list
                     [appId]="appId"
                     [selectFirst]="selectFirstReport"
                     (reportClick)="onReportClick($event)"
                     #analyticsReportList>
-                </adf-analytics-report-list>
+                </adf-analytics-report-list> -->
             </div>
             <div class="app-grid-item app-reports-details" fxFlex.gt-md="1 1 auto">
                 <adf-analytics

demo-shell/src/app/components/process-service/process-service.component.ts

@@ -103,7 +103,7 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
     @ViewChild('activitiStartProcess')
     activitiStartProcess: StartProcessInstanceComponent;
 
-    @ViewChild('analyticsReportList')
+    @ViewChild('analyticsReportList', { static: true })
     analyticsReportList: AnalyticsReportListComponent;
 
     @Input()

demo-shell/src/app/components/template-list/template-demo.component.ts

@@ -25,22 +25,22 @@ import { ObjectDataTableAdapter } from '@alfresco/adf-core';
 })
 export class TemplateDemoComponent implements AfterViewChecked {
 
-    @ViewChild('defaultDocumentList')
+    @ViewChild('defaultDocumentList', { static: true })
     defaultDocumentListComponent: DocumentListComponent;
 
-    @ViewChild('customLoadingDocumentList')
+    @ViewChild('customLoadingDocumentList', { static: true })
     customLoadingDocumentList: DocumentListComponent;
 
-    @ViewChild('customNoPermissionDocumentList')
+    @ViewChild('customNoPermissionDocumentList', { static: true })
     customNoPermissionDocumentList: DocumentListComponent;
 
-    @ViewChild('defaultNoPermissionDocumentList')
+    @ViewChild('defaultNoPermissionDocumentList', { static: true })
     defaultNoPermissionDocumentList: DocumentListComponent;
 
-    @ViewChild('customEmptyDocumentList')
+    @ViewChild('customEmptyDocumentList', { static: true })
     customEmptyDocumentList: DocumentListComponent;
 
-    @ViewChild('defaultEmptyDocumentList')
+    @ViewChild('defaultEmptyDocumentList', { static: true })
     defaultEmptyDocumentList: DocumentListComponent;
 
     constructor() {

demo-shell/src/app/components/theme-picker/theme-picker.ts

@@ -17,10 +17,12 @@
 
 import { CommonModule } from '@angular/common';
 import { ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
-import {
+import { MatButtonModule } from '@angular/material/button';
-    MatButtonModule, MatGridListModule, MatIconModule, MatMenuModule,
+import { MatGridListModule } from '@angular/material/grid-list';
-    MatTooltipModule, MatListModule
+import { MatIconModule } from '@angular/material/icon';
-} from '@angular/material';
+import { MatListModule } from '@angular/material/list';
+import { MatMenuModule } from '@angular/material/menu';
+import { MatTooltipModule } from '@angular/material/tooltip';
 import { StyleManager } from './style-manager/style-manager';
 import { DocsSiteTheme, ThemeStorage } from './theme-storage/theme-storage';
 

demo-shell/src/app/components/trashcan/trashcan.component.ts

@@ -28,7 +28,7 @@ import { takeUntil } from 'rxjs/operators';
     styleUrls: ['trashcan.component.scss']
 })
 export class TrashcanComponent implements OnInit, OnDestroy {
-    @ViewChild('documentList')
+    @ViewChild('documentList', { static: true })
     documentList: DocumentListComponent;
 
     currentLocale;

demo-shell/src/app/material.module.ts

@@ -16,39 +16,48 @@
  */
 
 import { NgModule } from '@angular/core';
-import {
+import { MatCardModule } from '@angular/material/card';
-    MatDialogModule,
+import { MatDialogModule } from '@angular/material/dialog';
-    MatInputModule,
+import { MatExpansionModule } from '@angular/material/expansion';
-    MatProgressBarModule,
+import { MatInputModule } from '@angular/material/input';
-    MatSelectModule,
+import { MatListModule } from '@angular/material/list';
-    MatSidenavModule,
+import { MatMenuModule } from '@angular/material/menu';
-    MatSlideToggleModule,
+import { MatProgressBarModule } from '@angular/material/progress-bar';
-    MatCardModule,
+import { MatSelectModule } from '@angular/material/select';
-    MatListModule,
+import { MatSidenavModule } from '@angular/material/sidenav';
-    MatMenuModule,
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
-    MatToolbarModule,
+import { MatSnackBarModule } from '@angular/material/snack-bar';
-    MatSnackBarModule,
+import { MatToolbarModule } from '@angular/material/toolbar';
-    MatExpansionModule
-} from '@angular/material';
-
-const MATERIAL_MODULES = [
-    MatSlideToggleModule,
-    MatInputModule,
-    MatSelectModule,
-    MatDialogModule,
-    MatSidenavModule,
-    MatProgressBarModule,
-    MatCardModule,
-    MatListModule,
-    MatMenuModule,
-    MatToolbarModule,
-    MatSnackBarModule,
-    MatExpansionModule
-];
 
 @NgModule({
-    imports: MATERIAL_MODULES,
+    imports: [
-    exports: MATERIAL_MODULES
+        MatSlideToggleModule,
+        MatInputModule,
+        MatSelectModule,
+        MatDialogModule,
+        MatSidenavModule,
+        MatProgressBarModule,
+        MatCardModule,
+        MatListModule,
+        MatMenuModule,
+        MatToolbarModule,
+        MatSnackBarModule,
+        MatExpansionModule
+    ],
+    exports: [
+        MatSlideToggleModule,
+        MatInputModule,
+        MatSelectModule,
+        MatDialogModule,
+        MatSidenavModule,
+        MatProgressBarModule,
+        MatCardModule,
+        MatListModule,
+        MatMenuModule,
+        MatToolbarModule,
+        MatSnackBarModule,
+        MatExpansionModule
+    ]
 })
 export class MaterialModule {
 }

demo-shell/src/assets/app.extensions.json

@@ -2,8 +2,7 @@
   "$schema": "../../../lib/extensions/src/lib/config/schema/app-extension.schema.json",
   "$references": [
     "plugin1.json",
-    "plugin2.json",
+    "plugin2.json"
-    "monaco-extension.json"
   ],
   "$dependencies": [],
 

demo-shell/src/assets/plugins/monaco-extension.json

@@ -1,17 +0,0 @@
-{
-  "$schema": "../../../lib/extensions/config/schema/plugin-extension.schema.json",
-  "$version": "1.0.0",
-  "$name": "monaco extension",
-  "$description": "monaco plugin",
-  "features": {
-    "viewer": {
-      "content": [
-        {
-          "id": "dev.tools.viewer",
-          "fileExtension": "js",
-          "component": "monaco-extension.main.component"
-        }
-      ]
-    }
-  }
-}

demo-shell/src/main.ts

@@ -20,8 +20,6 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 
 import { AppModule } from './app/app.module';
 import { environment } from './environments/environment';
-
-import 'hammerjs';
 import 'chart.js';
 import 'ng2-charts';
 

demo-shell/src/tsconfig.app.json

@@ -1,13 +0,0 @@
-{
-  "extends": "../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../out-tsc/app",
-    "module": "es2015",
-    "baseUrl": ".",
-    "types": []
-  },
-  "exclude": [
-    "test.ts",
-    "**/*.spec.ts"
-  ]
-}

demo-shell/src/tsconfig.dev.json

@@ -1,52 +0,0 @@
-{
-  "extends": "../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../out-tsc/app",
-    "module": "es2015",
-    "rootDir": "..",
-    "baseUrl": ".",
-    "skipLibCheck": false,
-    "types": [],
-    "paths": {
-      "@alfresco/js-api": [
-        "../../node_modules/@alfresco/js-api"
-      ],
-      "rxjs/*": [
-        "../../node_modules/rxjs/*"
-      ],
-      "@angular/*": [
-        "../../node_modules/@angular/*"
-      ],
-      "@alfresco/adf-extensions": [
-        "../../lib/extensions"
-      ],
-      "@alfresco/adf-core": [
-        "../../lib/core"
-      ],
-      "@alfresco/adf-content-services": [
-        "../../lib/content-services"
-      ],
-      "@alfresco/adf-process-services": [
-        "../../lib/process-services"
-      ],
-      "@alfresco/adf-insights": [
-        "../../lib/insights"
-      ],
-      "@alfresco/adf-process-services-cloud": [
-        "../../lib/process-services-cloud"
-      ],
-      "@alfresco/adf-testing": [
-        "../../lib/testing"
-      ]
-    }
-  },
-  "exclude": [
-    "test.ts",
-    "**/*.spec.ts"
-  ],
-  "angularCompilerOptions": {
-    "skipTemplateCodegen": false,
-    "entryModule": "./app/app.module#AppModule",
-    "genDir": "../ngfactory"
-  }
-}

demo-shell/src/tsconfig.spec.json

@@ -1,5 +1,5 @@
 {
-  "extends": "../tsconfig.json",
+  "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/spec",
     "types": [

demo-shell/src/versions.json

@@ -1044,11 +1044,6 @@
       "from": "custom-event-polyfill@0.3.0",
       "resolved": "https://registry.npmjs.org/custom-event-polyfill/-/custom-event-polyfill-0.3.0.tgz"
     },
-    "hammerjs": {
-      "version": "2.0.8",
-      "from": "hammerjs@2.0.8",
-      "resolved": "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz"
-    },
     "minimatch-browser": {
       "version": "1.0.0",
       "from": "minimatch-browser@1.0.0",

demo-shell/tsconfig.json

@@ -1,32 +0,0 @@
-{
-  "compileOnSave": false,
-  "compilerOptions": {
-    "resolveJsonModule": true,
-    "outDir": "./dist/out-tsc",
-    "baseUrl": "src",
-    "sourceMap": true,
-    "declaration": false,
-    "moduleResolution": "node",
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "skipLibCheck": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noImplicitReturns": true,
-    "target": "es5",
-    "allowSyntheticDefaultImports": true,
-    "typeRoots": [
-      "node_modules/@types"
-    ],
-    "lib": [
-      "es2018",
-      "dom"
-    ]
-  },
-  "exclude": [
-    "node_modules"
-  ],
-  "angularCompilerOptions": {
-    "preserveWhitespaces": false
-  }
-}

demo-shell/tslint.json

@@ -1,10 +0,0 @@
-{
-  "extends": "../tslint.json",
-  "rules": {
-    "directive-selector": [true, "attribute", "app", "camelCase"],
-    "component-selector": [true, "element", "app", "kebab-case"],
-    "adf-license-banner": [true, "**/*.ts", "./license-community.txt"]
-  }
-}
-
-

docs/content-services/components/content-node-selector.component.md

@@ -73,7 +73,7 @@ the dialog for you.
 ### Usage example
 
 ```ts
-import { MatDialog } from '@angular/material';
+import { MatDialog } from '@angular/material/dialog';
 import { ContentNodeSelectorComponentData, ContentNodeSelectorComponent} from '@adf/content-services'
 import { Subject } from 'rxjs/Subject';
  ...

docs/core/components/icon.component.md

@@ -40,7 +40,7 @@ that points to an external file within the `assets` folder:
 
 ```ts
 import { Component, OnInit } from '@angular/core';
-import { MatIconRegistry } from '@angular/material';
+import { MatIconRegistry } from '@angular/material/icon';
 import { DomSanitizer } from '@angular/platform-browser';
 
 @Component({...})

docs/core/components/login-dialog.component.md

@@ -46,7 +46,7 @@ the dialog for you.
 ### Usage example
 
 ```ts
-import { MatDialog } from '@angular/material';
+import { MatDialog } from '@angular/material/dialog';
 import { LoginDialogComponentData, LoginDialogComponent} from '@adf/core'
 import { Subject } from 'rxjs/Subject';
  ...

docs/core/interfaces/card-view-item.interface.md

@@ -106,26 +106,7 @@ Picard's birthday (47457.1):
     [Card View Date Item component source](https://github.com/Alfresco/alfresco-ng2-components/blob/development/lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.ts) for examples of how to make the field
     editable.
 
-3.  Add your custom component to your module's `entryComponents` list.
+3.  Bind your custom component to the [custom model](../../../node_modules/@alfresco/js-api/src/api/content-rest-api/api/customModel.api.ts) type so that Angular's dynamic component
-
-    You must register your component in your module's `entryComponents` array
-    to enable Angular to load it dynamically:
-
-    ```js
-    @NgModule({
-        imports: [...],
-        declarations: [
-            CardViewStarDateItemComponent
-        ],
-        entryComponents: [
-            CardViewStarDateItemComponent
-        ],
-        exports: [...]
-    })
-    export class MyModule {}
-    ```
-
-4.  Bind your custom component to the [custom model](../../../node_modules/@alfresco/js-api/src/api/content-rest-api/api/customModel.api.ts) type so that Angular's dynamic component
     loader can find it.
 
     ```ts

docs/core/services/notification.service.md

@@ -94,7 +94,7 @@ export class MyComponent implements OnInit {
 
 ```ts
 import { NotificationService } from '@alfresco/adf-core';
-import { MatSnackBarConfig } from '@angular/material';
+import { MatSnackBarConfig } from '@angular/material/snackbar';
 
 export class MyComponent implements OnInit {
 

docs/user-guide/extensibility.md

@@ -134,13 +134,12 @@ import { CustomEditorComponent } from './custom-editor.component';
 
 @NgModule({
     declarations: [ CustomEditorComponent ],
-    exports: [ CustomEditorComponent ],
+    exports: [ CustomEditorComponent ]
-    entryComponents: [ CustomEditorComponent ]
 })
 export class CustomEditorsModule {}
 ```
 
-Every custom [widget](../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) should be added into all three module collections: `declarations`, `exports` and `entryComponents`.
+Every custom [widget](../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) should be added into the following collections: `declarations`, `exports`.
 
 If you decided to store custom widgets in a separate dedicated module (and optionally as separate redistributable library)
 don't forget to import it into your main application one:
@@ -231,8 +230,7 @@ import { CustomStencil01 } from './custom-stencil-01.component';
 
 @NgModule({
     declarations: [ CustomStencil01 ],
-    exports: [ CustomStencil01 ],
+    exports: [ CustomStencil01 ]
-    entryComponents: [ CustomStencil01 ]
 })
 export class CustomEditorsModule {}
 ```

e2e/actions/users.actions.ts

@@ -18,6 +18,7 @@
 import * as path from 'path';
 import * as fs from 'fs';
 import * as remote from 'selenium-webdriver/remote';
+
 import { browser } from 'protractor';
 import { ImageUploadRepresentation, UserRepresentation } from '@alfresco/js-api';
 import { ApiService, IdentityService, UserModel, Logger } from '@alfresco/adf-testing';

e2e/content-services/version/version-properties.e2e.ts

@@ -85,7 +85,6 @@ describe('Version Properties', () => {
         await versionManagePage.enableDownload();
         await versionManagePage.clickActionButton('1.0');
         await BrowserVisibility.waitUntilElementIsVisible(element(by.css(`[id="adf-version-list-action-download-1.0"]`)));
-        await versionManagePage.closeActionsMenu();
     });
 
     it('[C269085] Should show/hide comments when showComments true/false', async () => {

e2e/core/auth-guard/auth-guard-sso.e2e.ts

@@ -1,39 +0,0 @@
-/*!
- * @license
- * Copyright 2019 Alfresco Software, Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { ErrorPage, LoginSSOPage, SettingsPage, BrowserActions } from '@alfresco/adf-testing';
-import { browser } from 'protractor';
-
-describe('Auth Guard SSO', () => {
-
-    const settingsPage = new SettingsPage();
-    const loginSSOPage = new LoginSSOPage();
-    const errorPage = new ErrorPage();
-
-    it('[C307058] Should be redirected to 403 when user doesn\'t have permissions', async () => {
-        await settingsPage.setProviderEcmSso(browser.params.testConfig.adf.url,
-            browser.params.testConfig.appConfig.oauth2.host,
-            browser.params.testConfig.appConfig.identityHost,
-            false, true, browser.params.testConfig.appConfig.oauth2.clientId);
-
-        await loginSSOPage.loginSSOIdentityService(browser.params.testConfig.admin.email, browser.params.testConfig.admin.password);
-        await BrowserActions.getUrl(browser.params.testConfig.adf.url + '/cloud/simple-app');
-        await browser.sleep(1000);
-        const error = await errorPage.getErrorCode();
-        await expect(error).toBe('403');
-    });
-});

e2e/core/login/login-component.e2e.ts

@@ -48,8 +48,6 @@ describe('Login component', () => {
         password: 'Enter your password to sign in',
         required: 'Required'
     };
-    const invalidUsername = 'invaliduser';
-    const invalidPassword = 'invalidpassword';
 
     const apiService = new ApiService();
     const usersActions = new UsersActions(apiService);
@@ -128,18 +126,6 @@ describe('Login component', () => {
         await loginPage.clearPassword();
     });
 
-    it('[C260046] Should NOT be possible to login with an invalid username/password', async () => {
-        await loginPage.goToLoginPage();
-        await expect(await loginPage.getSignInButtonIsEnabled()).toBe(false);
-        await loginPage.enterUsername('impossible-user');
-        await loginPage.enterPassword('impossible-password');
-        await expect(await loginPage.getSignInButtonIsEnabled()).toBe(true);
-        await loginPage.clickSignInButton();
-        await expect(await loginPage.getLoginError()).toEqual(errorMessages.invalid_credentials);
-        await loginPage.clearUsername();
-        await loginPage.clearPassword();
-    });
-
     it('[C260047] Password should be crypted', async () => {
         await loginPage.goToLoginPage();
         await expect(await loginPage.getSignInButtonIsEnabled()).toBe(false);
@@ -248,16 +234,4 @@ describe('Login component', () => {
         await loginPage.enterLogo('https://rawgit.com/Alfresco/alfresco-ng2-components/master/assets/angular2.png');
         await loginPage.checkLoginImgURL();
     });
-
-    it('[C291854] Should be possible login in valid credentials', async () => {
-        await loginPage.goToLoginPage();
-        await expect(await loginPage.getSignInButtonIsEnabled()).toBe(false);
-        await loginPage.enterUsername(invalidUsername);
-        await expect(await loginPage.getSignInButtonIsEnabled()).toBe(false);
-        await loginPage.enterPassword(invalidPassword);
-        await expect(await loginPage.getSignInButtonIsEnabled()).toBe(true);
-        await loginPage.clickSignInButton();
-        await expect(await loginPage.getLoginError()).toEqual(errorMessages.invalid_credentials);
-        await loginPage.login(browser.params.testConfig.admin.email, browser.params.testConfig.admin.password);
-    });
 });

e2e/core/login/login-sso/login-sso.e2e.ts

@@ -43,11 +43,15 @@ describe('Login component - SSO', () => {
         });
 
         it('[C280667] Should be redirect directly to keycloak without show the login page with silent login', async () => {
-            await settingsPage.setProviderEcmSso(browser.params.testConfig.appConfig.ecmHost,
+            await settingsPage.setProviderEcmSso(
+                browser.params.testConfig.appConfig.ecmHost,
                 browser.params.testConfig.appConfig.oauth2.host,
-                browser.params.testConfig.appConfig.identityHost, true, true, browser.params.testConfig.appConfig.oauth2.clientId);
+                browser.params.testConfig.appConfig.identityHost,
+                true,
+                true,
+                browser.params.testConfig.appConfig.oauth2.clientId
+            );
 
-            await browser.refresh();
             await loginSSOPage.loginSSOIdentityService(browser.params.testConfig.admin.email, browser.params.testConfig.admin.password);
         });
    });

e2e/core/viewer/viewer-extension.e2e.ts

@@ -1,91 +0,0 @@
-/*!
- * @license
- * Copyright 2019 Alfresco Software, Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { browser } from 'protractor';
-import { ApiService, LoginSSOPage, StringUtil, UploadActions, ViewerPage, UserModel } from '@alfresco/adf-testing';
-import { NavigationBarPage } from '../../pages/adf/navigation-bar.page';
-import { ContentServicesPage } from '../../pages/adf/content-services.page';
-import { MonacoExtensionPage } from '../../pages/adf/demo-shell/monaco-extension.page';
-import CONSTANTS = require('../../util/constants');
-import { FileModel } from '../../models/ACS/file.model';
-import { UsersActions } from '../../actions/users.actions';
-
-describe('Viewer', () => {
-
-    const viewerPage = new ViewerPage();
-    const navigationBarPage = new NavigationBarPage();
-    const loginPage = new LoginSSOPage();
-    const contentServicesPage = new ContentServicesPage();
-    const acsUser = new UserModel();
-    const monacoExtensionPage = new MonacoExtensionPage();
-
-    const apiService = new ApiService();
-    const usersActions = new UsersActions(apiService);
-    const uploadActions = new UploadActions(apiService);
-
-    let site;
-
-    let jsFileUploaded;
-    const jsFileInfo = new FileModel({
-        'name': browser.params.resources.Files.ADF_DOCUMENTS.JS.file_name,
-        'location': browser.params.resources.Files.ADF_DOCUMENTS.JS.file_path
-    });
-
-    beforeAll(async () => {
-        await apiService.getInstance().login(browser.params.testConfig.admin.email, browser.params.testConfig.admin.password);
-
-        await usersActions.createUser(acsUser);
-
-        site = await apiService.getInstance().core.sitesApi.createSite({
-            title: StringUtil.generateRandomString(8),
-            visibility: 'PUBLIC'
-        });
-
-        await apiService.getInstance().core.sitesApi.addSiteMember(site.entry.id, {
-            id: acsUser.email,
-            role: CONSTANTS.CS_USER_ROLES.MANAGER
-        });
-
-        await apiService.getInstance().login(acsUser.email, acsUser.password);
-
-        jsFileUploaded = await uploadActions.uploadFile(jsFileInfo.location, jsFileInfo.name, '-my-');
-
-        await loginPage.login(acsUser.email, acsUser.password);
-    });
-
-    afterAll(async () => {
-        await apiService.getInstance().core.sitesApi.deleteSite(site.entry.id, { permanent: true });
-        await apiService.getInstance().login(acsUser.email, acsUser.password);
-        await uploadActions.deleteFileOrFolder(jsFileUploaded.entry.id);
-    });
-
-    describe('Viewer extension', () => {
-        it('[C297698] Should be able to add an extension for code editor viewer', async () => {
-            await navigationBarPage.clickAboutButton();
-
-            await monacoExtensionPage.checkMonacoPluginIsDisplayed();
-
-            await navigationBarPage.clickContentServicesButton();
-
-            await contentServicesPage.waitForTableBody();
-            await contentServicesPage.checkContentIsDisplayed(jsFileInfo.name);
-            await contentServicesPage.doubleClickRow(jsFileInfo.name);
-
-            await viewerPage.checkCodeViewerIsDisplayed();
-        });
-    });
-});

e2e/pages/adf/content-services.page.ts

@@ -83,11 +83,10 @@ export class ContentServicesPage {
     favoriteButton = element(by.css('button[data-automation-id="favorite"]'));
     markedFavorite = element(by.cssContainingText('button[data-automation-id="favorite"] mat-icon', 'star'));
     notMarkedFavorite = element(by.cssContainingText('button[data-automation-id="favorite"] mat-icon', 'star_border'));
-    multiSelectToggle = element(by.cssContainingText('span.mat-slide-toggle-content', ' Multiselect (with checkboxes) '));
+    multiSelectToggle = element(by.css('[data-automation-id="multiSelectToggle"]'));
     selectAllCheckbox = element.all(by.css('.adf-checkbox-sr-only')).first();
     selectionModeDropdown = element(by.css('.mat-select[aria-label="Selection Mode"]'));
     selectedNodesList = element.all(by.css('.app-content-service-settings li'));
-
     siteListDropdown = new DropdownPage(element(by.css(`mat-select[data-automation-id='site-my-files-option']`)));
     sortingDropdown = new DropdownPage(element(by.css('mat-select[data-automation-id="grid-view-sorting"]')));
 

e2e/pages/adf/demo-shell/data-table.page.ts

@@ -33,7 +33,7 @@ export class DataTablePage {
     };
 
     dataTable: DataTableComponentPage;
-    multiSelect = element(by.css(`div[data-automation-id='multiselect'] label > div[class='mat-checkbox-inner-container']`));
+    multiSelect = element(by.css(`div[data-automation-id='multiselect'] label > .mat-checkbox-inner-container`));
     reset = element(by.xpath(`//span[contains(text(),'Reset to default')]/..`));
     allSelectedRows = element.all(by.css(`adf-datatable-row[class*='is-selected']`));
     selectedRowNumber = element(by.css(`adf-datatable-row[class*='is-selected'] div[data-automation-id*='text_']`));

e2e/pages/adf/demo-shell/login.page.ts

@@ -21,7 +21,6 @@ import { TogglePage, BrowserActions, BrowserVisibility, LoginSSOPage } from '@al
 export class LoginPage {
 
     loginURL = browser.baseUrl + '/login';
-
     loginSSOPage = new LoginSSOPage();
 
     togglePage = new TogglePage();
@@ -30,20 +29,21 @@ export class LoginPage {
     logoImg = element(by.css('img[id="adf-login-img-logo"]'));
     successRouteTxt = element(by.css('input[data-automation-id="adf-success-route"]'));
     logoTxt = element(by.css('input[data-automation-id="adf-url-logo"]'));
-    usernameTooltip = element(by.css('span[data-automation-id="username-error"]'));
+    usernameError = element(by.css('span[data-automation-id="username-error"]'));
-    passwordTooltip = element(by.css('span[data-automation-id="password-required"]'));
+    passwordError = element(by.css('span[data-automation-id="password-required"]'));
-    loginTooltip = element(by.css('span[class="adf-login-error-message"]'));
+    loginError = element(by.css('.adf-login-error-message'));
     usernameInactive = element(by.css('input[id="username"][aria-invalid="false"]'));
     passwordInactive = element(by.css('input[id="password"][aria-invalid="false"]'));
-    adfLogo = element(by.css('img[class="adf-img-logo ng-star-inserted"]'));
+    adfLogo = element(by.css('.adf-img-logo'));
+
     usernameHighlighted = element(by.css('input[id="username"][aria-invalid="true"]'));
     passwordHighlighted = element(by.css('input[id="password"][aria-invalid="true"]'));
     signInButton = element(by.id('login-button'));
     showPasswordElement = element(by.css('button[data-automation-id="show_password"]'));
     hidePasswordElement = element(by.css('button[data-automation-id="hide_password"]'));
     rememberMe = element(by.css('mat-checkbox[id="adf-login-remember"]'));
-    needHelp = element(by.css('div[id="adf-login-action-left"]'));
+    needHelp = element(by.id('adf-login-action-left'));
-    register = element(by.css('div[id="adf-login-action-right"]'));
+    register = element(by.id('adf-login-action-right'));
     footerSwitch = element(by.id('switch4'));
     rememberMeSwitch = element(by.id('adf-toggle-show-rememberme'));
     successRouteSwitch = element(by.id('adf-toggle-show-successRoute'));
@@ -81,15 +81,15 @@ export class LoginPage {
     }
 
     async getUsernameTooltip(): Promise<string> {
-        return BrowserActions.getText(this.usernameTooltip);
+        return BrowserActions.getText(this.usernameError);
     }
 
     async getPasswordTooltip(): Promise<string> {
-        return BrowserActions.getText(this.passwordTooltip);
+        return BrowserActions.getText(this.passwordError);
     }
 
     async getLoginError(): Promise<string> {
-        return BrowserActions.getText(this.loginTooltip);
+        return BrowserActions.getText(this.loginError);
     }
 
     async checkLoginImgURL(): Promise<string> {
@@ -116,11 +116,11 @@ export class LoginPage {
     }
 
     async checkUsernameTooltipIsNotVisible(): Promise<void> {
-        await BrowserVisibility.waitUntilElementIsNotVisible(this.usernameTooltip);
+        await BrowserVisibility.waitUntilElementIsNotVisible(this.usernameError);
     }
 
     async checkPasswordTooltipIsNotVisible(): Promise<void> {
-        await BrowserVisibility.waitUntilElementIsNotVisible(this.passwordTooltip);
+        await BrowserVisibility.waitUntilElementIsNotVisible(this.passwordError);
     }
 
     async getSignInButtonIsEnabled(): Promise<boolean> {

e2e/pages/adf/demo-shell/monaco-extension.page.ts

@@ -1,28 +0,0 @@
-/*!
- * @license
- * Copyright 2019 Alfresco Software, Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { by, element } from 'protractor';
-import { BrowserVisibility } from '@alfresco/adf-testing';
-
-export class MonacoExtensionPage {
-
-    monacoPlugin = element(by.cssContainingText('mat-row > mat-cell', 'monaco plugin'));
-
-    async checkMonacoPluginIsDisplayed(): Promise<void> {
-        await BrowserVisibility.waitUntilElementIsVisible(this.monacoPlugin);
-    }
-}

e2e/pages/adf/demo-shell/process-services/process-list-demo.page.ts

@@ -22,7 +22,7 @@ export class ProcessListDemoPage {
 
     appIdInput = element(by.css('input[data-automation-id="app-id"]'));
     resetButton = element(by.cssContainingText('button span', 'Reset'));
-    emptyProcessContent = element(by.css('div[class="adf-empty-content"]'));
+    emptyProcessContent = element(by.css('.adf-empty-content'));
     processDefinitionInput = element(by.css('input[data-automation-id="process-definition-id"]'));
     processInstanceInput = element(by.css('input[data-automation-id="process-instance-id"]'));
 
@@ -43,7 +43,7 @@ export class ProcessListDemoPage {
         await this.stateDropdown.selectDropdownOption(stateOption);
     }
 
-    async addAppId(appId): Promise<void> {
+    async addAppId(appId: string): Promise<void> {
         await BrowserActions.click(this.appIdInput);
         await this.appIdInput.sendKeys(protractor.Key.ENTER);
         await this.appIdInput.clear();
@@ -54,7 +54,7 @@ export class ProcessListDemoPage {
         await BrowserActions.click(this.resetButton);
     }
 
-    async checkErrorMessageIsDisplayed(error): Promise<void> {
+    async checkErrorMessageIsDisplayed(error: string): Promise<void> {
         const errorMessage = element(by.cssContainingText('mat-error', error));
         await BrowserVisibility.waitUntilElementIsVisible(errorMessage);
     }
@@ -87,11 +87,11 @@ export class ProcessListDemoPage {
         await this.sortDropdown.checkDropdownIsVisible();
     }
 
-    async addProcessDefinitionId(procDefinitionId): Promise<void> {
+    async addProcessDefinitionId(procDefinitionId: string): Promise<void> {
         await BrowserActions.clearSendKeys(this.processDefinitionInput, procDefinitionId);
     }
 
-    async addProcessInstanceId(procInstanceId): Promise<void> {
+    async addProcessInstanceId(procInstanceId: string): Promise<void> {
         await BrowserActions.clearSendKeys(this.processInstanceInput, procInstanceId);
     }
 }

e2e/pages/adf/demo-shell/process-services/task-list-demo.page.ts

@@ -21,7 +21,7 @@ import { TasksListPage } from '../../process-services/tasks-list.page';
 
 export class TaskListDemoPage {
 
-    taskListPage: TasksListPage = new TasksListPage();
+    taskListPage = new TasksListPage();
     appId = element(by.css("input[data-automation-id='appId input']"));
     itemsPerPage = element(by.css("input[data-automation-id='items per page']"));
     itemsPerPageForm = element(by.css("mat-form-field[data-automation-id='items per page']"));
@@ -30,7 +30,7 @@ export class TaskListDemoPage {
     page = element(by.css("input[data-automation-id='page']"));
     pageForm = element(by.css("mat-form-field[data-automation-id='page']"));
     taskName = element(by.css("input[data-automation-id='task name']"));
-    resetButton = element(by.css("div[class='app-reset-button'] button"));
+    resetButton = element(by.css('.app-reset-button button'));
     dueBefore = element(by.css("input[data-automation-id='due before']"));
     dueAfter = element(by.css("input[data-automation-id='due after']"));
     taskId = element(by.css("input[data-automation-id='task id']"));

e2e/pages/adf/dialog/search-dialog.page.ts

@@ -24,7 +24,7 @@ export class SearchDialogPage {
     searchBar = element(by.css(`adf-search-control input`));
     searchBarExpanded = element(by.css(`adf-search-control mat-form-field[class*="mat-focused"] input`));
     noResultMessage = element(by.css(`p[class*='adf-search-fixed-text']`));
-    rowsAuthor = by.css(`div[class='mat-list-text'] p[class*='adf-search-fixed-text']`);
+    rowsAuthor = by.css(`.mat-list-text p[class*='adf-search-fixed-text']`);
     completeName = by.css(`h4[class*='adf-search-fixed-text']`);
     highlightName = by.css(`.adf-highlight`);
     searchDialog = element(by.css(`mat-list[id='autocomplete-search-result-list']`));

e2e/pages/adf/dialog/upload-dialog.page.ts

@@ -31,8 +31,8 @@ export class UploadDialogPage {
     title = element(by.css('span[class*="upload-dialog__title"]'));
     minimizeButton = element(by.css('mat-icon[title="Minimize"]'));
     maximizeButton = element(by.css('mat-icon[title="Maximize"]'));
-    canUploadConfirmationTitle = element(by.css('p[class="upload-dialog__confirmation--title"]'));
+    canUploadConfirmationTitle = element(by.css('.upload-dialog__confirmation--title'));
-    canUploadConfirmationDescription = element(by.css('p[class="upload-dialog__confirmation--text"]'));
+    canUploadConfirmationDescription = element(by.css('.upload-dialog__confirmation--text'));
     confirmationDialogNoButton = element(by.partialButtonText('No'));
     confirmationDialogYesButton = element(by.partialButtonText('Yes'));
     cancelUploadsElement = element((by.css('footer[class*="upload-dialog__actions"] button[id="adf-upload-dialog-cancel-all"]')));
@@ -162,5 +162,4 @@ export class UploadDialogPage {
     async getTooltip(): Promise<string> {
         return BrowserActions.getText(this.errorTooltip);
     }
-
 }

e2e/pages/adf/permissions.page.ts

@@ -18,16 +18,30 @@
 import {
     DataTableComponentPage,
     AddPermissionsDialogPage,
-    BrowserVisibility
+    BrowserVisibility,
+    BrowserActions
 } from '@alfresco/adf-testing';
 import { by, element } from 'protractor';
 
 export class PermissionsPage {
 
-    dataTableComponentPage: DataTableComponentPage = new DataTableComponentPage();
+    dataTableComponentPage = new DataTableComponentPage();
-    addPermissionsDialog: AddPermissionsDialogPage = new AddPermissionsDialogPage();
+    addPermissionsDialog = new AddPermissionsDialogPage();
 
-    addPermissionButton = element(by.css('button[data-automation-id="adf-add-permission-button"]'));
+    addPermissionButton = element(by.css("button[data-automation-id='adf-add-permission-button']"));
+    addPermissionDialog = element(by.css('adf-add-permission-dialog'));
+    searchUserInput = element(by.id('searchInput'));
+    searchResults = element(by.css('#adf-add-permission-authority-results #adf-search-results-content'));
+    addButton = element(by.id('add-permission-dialog-confirm-button'));
+    permissionInheritedButton = element.all(by.css('.app-inherit_permission_button button')).first();
+    noPermissions = element(by.id('adf-no-permissions-template'));
+    deletePermissionButton = element(by.css(`button[data-automation-id='adf-delete-permission-button']`));
+    permissionDisplayContainer = element(by.id('adf-permission-display-container'));
+    closeButton = element(by.id('add-permission-dialog-close-button'));
+
+    async clickCloseButton(): Promise<void> {
+        await BrowserActions.click(this.closeButton);
+    }
 
     async checkAddPermissionButtonIsDisplayed(): Promise<void> {
         await BrowserVisibility.waitUntilElementIsVisible(this.addPermissionButton);

e2e/pages/adf/process-services/attach-form.page.ts

@@ -25,8 +25,8 @@ export class AttachFormPage {
     completeButton = element(by.id('adf-attach-form-complete-button'));
     formDropdown = element(by.id('form_id'));
     cancelButton = element(by.id('adf-attach-form-cancel-button'));
-    defaultTitle = element(by.css('mat-card-title[class="mat-card-title mat-card-title"]'));
+    defaultTitle = element(by.css('.mat-card-title'));
-    attachFormDropdown = new DropdownPage(element(by.css("div[class='adf-attach-form-row']")));
+    attachFormDropdown = new DropdownPage(element(by.css('.adf-attach-form-row')));
 
     async checkNoFormMessageIsDisplayed(): Promise<void> {
         await BrowserVisibility.waitUntilElementIsVisible(this.noFormMessage);
@@ -44,7 +44,7 @@ export class AttachFormPage {
         await BrowserActions.click(this.attachFormButton);
     }
 
-    async checkDefaultFormTitleIsDisplayed(formTitle): Promise<void> {
+    async checkDefaultFormTitleIsDisplayed(formTitle: string): Promise<void> {
         const result = await BrowserActions.getText(this.defaultTitle);
         await expect(result).toEqual(formTitle);
     }
@@ -57,7 +57,7 @@ export class AttachFormPage {
         await BrowserVisibility.waitUntilElementIsVisible(this.cancelButton);
     }
 
-    async selectAttachFormOption(option): Promise<void> {
+    async selectAttachFormOption(option: string): Promise<void> {
         await this.attachFormDropdown.selectDropdownOption(option);
     }
 

e2e/pages/adf/process-services/process-details.page.ts

@@ -19,8 +19,8 @@ import { by, element, protractor } from 'protractor';
 import { BrowserVisibility, BrowserActions } from '@alfresco/adf-testing';
 
 export class ProcessDetailsPage {
-    processTitle = element(by.css('mat-card-title[class="mat-card-title"]'));
+    processTitle = element(by.css('.mat-card-title'));
-    processDetailsMessage = element(by.css('adf-process-instance-details div[class="ng-star-inserted"]'));
+    processDetailsMessage = element(by.css('adf-process-instance-details div'));
     processStatusField = element(by.css('[data-automation-id="card-textitem-value-status"]'));
     processEndDateField = element(by.css('span[data-automation-id="card-dateitem-ended"]'));
     processCategoryField = element(by.css('[data-automation-id="card-textitem-value-category"]'));
@@ -30,17 +30,17 @@ export class ProcessDetailsPage {
     processIdField = element(by.css('[data-automation-id="card-textitem-value-id"]'));
     processDescription = element(by.css('[data-automation-id="card-textitem-value-description"]'));
     showDiagramButtonDisabled = element(by.css('button[id="show-diagram-button"][disabled]'));
-    propertiesList = element(by.css('div[class="adf-property-list"]'));
+    propertiesList = element(by.css('.adf-property-list'));
     showDiagramButton = element(by.id('show-diagram-button'));
     diagramCanvas = element(by.css('svg[xmlns="http://www.w3.org/2000/svg"]'));
-    backButton = element(by.css('app-show-diagram button[class="mat-mini-fab mat-accent"]'));
+    backButton = element(by.css('app-show-diagram button.mat-mini-fab.mat-accent'));
     commentInput = element(by.id('comment-input'));
     auditLogButton = element(by.css('button[adf-process-audit]'));
     auditLogEmptyListMessage = element(by.css('.app-empty-list-header'));
     cancelProcessButton = element(by.css('div[data-automation-id="header-status"] > button'));
     activeTask = element(by.css('div[data-automation-id="active-tasks"]'));
     completedTask = element(by.css('div[data-automation-id="completed-tasks"]'));
-    taskTitle = element(by.css('h2[class="adf-activiti-task-details__header"]'));
+    taskTitle = element(by.css('.adf-activiti-task-details__header'));
 
     async checkDetailsAreDisplayed(): Promise<void> {
         await BrowserVisibility.waitUntilElementIsVisible(this.processStatusField);
@@ -109,7 +109,7 @@ export class ProcessDetailsPage {
         await BrowserVisibility.waitUntilElementIsVisible(this.showDiagramButtonDisabled);
     }
 
-    async addComment(comment): Promise<void> {
+    async addComment(comment: string): Promise<void> {
         await BrowserVisibility.waitUntilElementIsVisible(this.commentInput);
         await this.commentInput.sendKeys(comment);
         await this.commentInput.sendKeys(protractor.Key.ENTER);

e2e/pages/adf/process-services/process-filters.page.ts

@@ -26,12 +26,12 @@ export class ProcessFiltersPage {
     allFilter = element(by.css('button[data-automation-id="All_filter"]'));
     createProcessButton = element(by.css('.app-processes-menu button[data-automation-id="create-button"] > span'));
     newProcessButton = element(by.css('div > button[data-automation-id="btn-start-process"]'));
-    processesPage = element(by.css('div[class="app-grid"] > div[class="app-grid-item app-processes-menu"]'));
+    processesPage = element(by.id('app-processes-menu'));
     accordionMenu = element(by.css('.app-processes-menu mat-accordion'));
     buttonWindow = element(by.css('div > button[data-automation-id="btn-start-process"] > div'));
-    noContentMessage = element.all(by.css('div[class="adf-empty-content__title"]')).first();
+    noContentMessage = element.all(by.css('.adf-empty-content__title')).first();
-    rows = by.css('adf-process-instance-list div[class="adf-datatable-body"] adf-datatable-row[class*="adf-datatable-row"]');
+    rows = by.css('adf-process-instance-list .adf-datatable-body adf-datatable-row[class*="adf-datatable-row"]');
-    tableBody = element.all(by.css('adf-datatable div[class="adf-datatable-body"]')).first();
+    tableBody = element.all(by.css('adf-datatable .adf-datatable-body')).first();
     nameColumn = by.css('div[class*="adf-datatable-body"] adf-datatable-row[class*="adf-datatable-row"] div[title="Name"] span');
     processIcon = by.css('adf-icon[data-automation-id="adf-filter-icon"]');
 

e2e/pages/adf/process-services/process-list.page.ts

@@ -20,7 +20,7 @@ import { element, by } from 'protractor';
 
 export class ProcessListPage {
 
-    processListTitle = element(by.css('div[class="adf-empty-content__title"]'));
+    processListTitle = element(by.css('.adf-empty-content__title'));
     processInstanceList = element(by.css('adf-process-instance-list'));
 
     getDisplayedProcessListTitle(): Promise<string> {

e2e/pages/adf/process-services/process-services.page.ts

@@ -19,11 +19,10 @@ import { ProcessServiceTabBarPage } from './process-service-tab-bar.page';
 
 import { element, by } from 'protractor';
 import { BrowserVisibility, BrowserActions } from '@alfresco/adf-testing';
-import { __await } from 'tslib';
 
 export class ProcessServicesPage {
 
-    apsAppsContainer = element(by.css('div[class="adf-app-listgrid ng-star-inserted"]'));
+    apsAppsContainer = element(by.css('.adf-app-listgrid'));
     taskApp = element(by.css('mat-card[title="Task App"]'));
     iconTypeLocator = by.css('mat-icon[class*="card-logo-icon"]');
     descriptionLocator = by.css('mat-card-subtitle[class*="subtitle"]');
@@ -72,5 +71,4 @@ export class ProcessServicesPage {
         const app = element(by.css('mat-card[title="' + applicationName + '"]'));
         await BrowserVisibility.waitUntilElementIsVisible(app);
     }
-
 }

e2e/pages/adf/process-services/task-details.page.ts

@@ -50,11 +50,11 @@ export class TaskDetailsPage {
     taskDetailsEmptySection = element(by.css('div[data-automation-id="adf-tasks-details--empty"]'));
     completeTask = element(by.css('button[id="adf-no-form-complete-button"]'));
     completeFormTask = element(by.css('button[id="adf-form-complete"]'));
-    taskDetailsTitle = element(by.css('h2[class="adf-activiti-task-details__header"] span'));
+    taskDetailsTitle = element(by.css('.adf-activiti-task-details__header span'));
     auditLogButton = element(by.css('button[adf-task-audit]'));
     noPeopleInvolved = element(by.id('no-people-label'));
     cancelInvolvePeopleButton = element(by.id('close-people-search'));
-    involvePeopleHeader = element(by.css('div[class="adf-search-text-header"]'));
+    involvePeopleHeader = element(by.css('.adf-search-text-header'));
     removeInvolvedPeople = element(by.css('button[data-automation-id="Remove"]'));
     peopleTitle = element(by.id('people-title'));
     noFormMessage = element(by.css('span[id*="no-form-message"]'));
@@ -62,7 +62,7 @@ export class TaskDetailsPage {
     attachFormButton = element(by.id('adf-no-form-attach-form-button'));
     disabledAttachFormButton = element(by.css('button[id="adf-no-form-attach-form-button"][disabled]'));
     removeAttachForm = element(by.id('adf-attach-form-remove-button'));
-    attachFormName = element(by.css('span[class="adf-form-title ng-star-inserted"]'));
+    attachFormName = element(by.css('.adf-form-title'));
     emptyTaskDetails = element(by.css('adf-task-details > div > div'));
     priority = element(by.css('[data-automation-id*="card-textitem-value-priority"]'));
     editableAssignee = element(by.css('[data-automation-id="card-textitem-value-assignee"][class*="clickable"]'));
@@ -70,7 +70,7 @@ export class TaskDetailsPage {
     releaseElement = element(by.css('[data-automation-id="header-unclaim-button"]'));
     saveFormButton = element(by.css('button[id="adf-form-save"]'));
 
-    attachFormDropdown = new DropdownPage(element(by.css('div[class="adf-attach-form-row"]')));
+    attachFormDropdown = new DropdownPage(element(by.css('.adf-attach-form-row')));
 
     async checkEditableAssigneeIsNotDisplayed(): Promise<void> {
         await BrowserVisibility.waitUntilElementIsNotVisible(this.editableAssignee);

e2e/pages/adf/process-services/tasks-list.page.ts

@@ -21,7 +21,7 @@ import { by, element } from 'protractor';
 export class TasksListPage {
 
     taskList = element(by.css('adf-tasklist'));
-    noTasksFound = element.all(by.css("div[class='adf-empty-content__title']")).first();
+    noTasksFound = element.all(by.css('.adf-empty-content__title')).first();
     dataTable = new DataTableComponentPage(this.taskList);
 
     getDataTable(): DataTableComponentPage {

e2e/pages/adf/process-services/tasks.page.ts

@@ -25,13 +25,12 @@ import { element, by } from 'protractor';
 import { BrowserVisibility, BrowserActions, FormFields } from '@alfresco/adf-testing';
 
 export class TasksPage {
-
     createButton = element(by.css('button[data-automation-id="create-button"'));
     newTaskButton = element(by.css('button[data-automation-id="btn-start-task"]'));
     addChecklistButton = element(by.css('button[class*="adf-add-to-checklist-button"]'));
     rowByRowName = by.xpath('ancestor::mat-chip');
     checklistContainer = by.css('div[class*="checklist-menu"]');
-    taskTitle = 'h2[class="adf-activiti-task-details__header"] span';
+    taskTitle = '.adf-activiti-task-details__header span';
     rows = by.css('div[class*="adf-datatable-body"] adf-datatable-row[class*="adf-datatable-row"] div[class*="adf-datatable-cell"]');
     completeButtonNoForm = element(by.id('adf-no-form-complete-button'));
     checklistDialog = element(by.id('checklist-dialog'));
@@ -89,24 +88,23 @@ export class TasksPage {
         return new ChecklistDialog();
     }
 
-    getRowsName(name) {
+    getRowsName(name: string) {
-        const row = element(this.checklistContainer).element(by.cssContainingText('span', name));
+        return element(this.checklistContainer).element(by.cssContainingText('span', name));
-        return row;
     }
 
-    getChecklistByName(checklist) {
+    getChecklistByName(name: string) {
-        const elem = this.getRowsName(checklist);
+        const elem = this.getRowsName(name);
         const row = elem.element(this.rowByRowName);
         return row;
     }
 
-    async checkChecklistIsDisplayed(checklist): Promise<void> {
+    async checkChecklistIsDisplayed(name: string): Promise<void> {
-        const checklistEle = this.getChecklistByName(checklist);
+        const checklistEle = this.getChecklistByName(name);
         await BrowserVisibility.waitUntilElementIsVisible(checklistEle);
     }
 
-    async checkChecklistIsNotDisplayed(checklist: string): Promise<void> {
+    async checkChecklistIsNotDisplayed(name: string): Promise<void> {
-        await BrowserVisibility.waitUntilElementIsNotVisible(element(this.checklistContainer).element(by.cssContainingText('span', checklist)));
+        await BrowserVisibility.waitUntilElementIsNotVisible(element(this.checklistContainer).element(by.cssContainingText('span', name)));
     }
 
     async checkTaskTitle(taskName: string): Promise<void> {
@@ -139,14 +137,14 @@ export class TasksPage {
         return BrowserActions.getText(this.numberOfChecklists);
     }
 
-    async removeChecklists(checklist): Promise<void> {
+    async removeChecklists(name: string): Promise<void> {
-        const elem = this.getRowsName(checklist);
+        const elem = this.getRowsName(name);
         const row = elem.element(this.rowByRowName);
         await BrowserActions.click(row.element(by.css('mat-icon')));
     }
 
-    async checkChecklistsRemoveButtonIsNotDisplayed(checklist): Promise<void> {
+    async checkChecklistsRemoveButtonIsNotDisplayed(name: string): Promise<void> {
-        const elem = this.getRowsName(checklist);
+        const elem = this.getRowsName(name);
         const row = elem.element(this.rowByRowName);
         await BrowserVisibility.waitUntilElementIsNotVisible(row.element(by.css('mat-icon')));
     }

e2e/pages/adf/search-results.page.ts

@@ -21,7 +21,7 @@ import { ContentServicesPage } from './content-services.page';
 
 export class SearchResultsPage {
 
-    noResultsMessage = element(by.css('div[class="app-no-result-message"]'));
+    noResultsMessage = element(by.css('.app-no-result-message'));
     dataTable = new DataTableComponentPage();
     searchSortingPicker = new SearchSortingPickerPage();
     contentServices = new ContentServicesPage();

e2e/pages/adf/tag.page.ts

@@ -20,7 +20,7 @@ import { BrowserVisibility, BrowserActions } from '@alfresco/adf-testing';
 
 export class TagPage {
 
-    addTagButton = element(by.css('button[id="add-tag"]'));
+    addTagButton = element(by.id('add-tag'));
     insertNodeIdElement = element(by.css('input[id="nodeId"]'));
     newTagInput = element(by.css('input[id="new-tag-text"]'));
     tagListRow = element(by.css('adf-tag-node-actions-list mat-list-item'));
@@ -50,11 +50,11 @@ export class TagPage {
         await this.clickConfirmTag();
     }
 
-    async addNewTagInput(tag) {
+    async addNewTagInput(tag: string) {
         await BrowserActions.clearSendKeys(this.newTagInput, tag);
     }
 
-    async addTag(tag): Promise<void> {
+    async addTag(tag: string): Promise<void> {
         await this.addNewTagInput(tag);
         await BrowserActions.click(this.addTagButton);
     }
@@ -94,12 +94,12 @@ export class TagPage {
         await BrowserVisibility.waitUntilElementIsNotVisible(tag);
     }
 
-    async checkTagIsNotDisplayedInTagListByNodeId(tagName): Promise<void> {
+    async checkTagIsNotDisplayedInTagListByNodeId(tagName: string): Promise<void> {
         const tag = element(by.cssContainingText('span[id*="tag_name"]', tagName));
         await BrowserVisibility.waitUntilElementIsNotVisible(tag);
     }
 
-    async checkTagIsDisplayedInTagListByNodeId(tagName): Promise<void> {
+    async checkTagIsDisplayedInTagListByNodeId(tagName: string): Promise<void> {
         const tag = element(by.cssContainingText('span[id*="tag_name"]', tagName));
         await BrowserVisibility.waitUntilElementIsVisible(tag);
     }
@@ -112,8 +112,8 @@ export class TagPage {
         await BrowserVisibility.waitUntilElementIsNotVisible(this.tagListByNodeIdRow);
     }
 
-    async checkTagIsDisplayedInTagListContentServices(tagName): Promise<void> {
+    async checkTagIsDisplayedInTagListContentServices(tagName: string): Promise<void> {
-        const tag = element(by.cssContainingText('div[class="adf-list-tag"][id*="tag_name"]', tagName));
+        const tag = element(by.cssContainingText('.adf-list-tag[id*="tag_name"]', tagName));
         await BrowserVisibility.waitUntilElementIsVisible(tag);
     }
 

e2e/pages/adf/trashcan.page.ts

@@ -22,7 +22,7 @@ export class TrashcanPage {
 
     contentList = new DocumentListPage(element(by.css('adf-document-list')));
     rows = by.css('adf-document-list div[class*="adf-datatable-body"] adf-datatable-row[class*="adf-datatable-row"]');
-    tableBody = element.all(by.css('adf-document-list div[class="adf-datatable-body"]')).first();
+    tableBody = element.all(by.css('adf-document-list .adf-datatable-body')).first();
     pagination = element(by.css('adf-pagination'));
     emptyTrashcan = element(by.css('adf-empty-content'));
     restoreButton = element(by.css(`button[title='Restore']`));

e2e/protractor.conf.js

@@ -1,69 +1,100 @@
-const { LocalStorageUtil } = require('@alfresco/adf-testing');
+const {LocalStorageUtil, ACTIVITI_CLOUD_APPS, Logger} = require('../lib/dist/testing');
-
 const path = require('path');
-const { SpecReporter } = require('jasmine-spec-reporter');
+const {SpecReporter} = require('jasmine-spec-reporter');
 const retry = require('protractor-retry').retry;
-const tsConfig = require('./e2e/tsconfig.e2e.json');
+const tsConfig = require('./tsconfig.e2e.json');
-const testConfig = require('./e2e/test.config');
+const testConfig = require('./test.config');
-const RESOURCES = require('./e2e/util/resources');
+const RESOURCES = require('./util/resources');
-const SmartRunner = require('protractor-smartrunner');
+const smartRunner = require('protractor-smartrunner');
 const resolve = require('path').resolve;
+const fs = require('fs');
 
-require('ts-node').register({
+const {uploadScreenshot, cleanReportFolder} = require('./protractor/save-remote');
-    project: './lib/testing/tsconfig.lib.json'
-});
-const ACTIVITI_CLOUD_APPS = require('./lib/testing').ACTIVITI_CLOUD_APPS;
-
-const { uploadScreenshot, cleanReportFolder } = require('./e2e/protractor/save-remote');
 const argv = require('yargs').argv;
 
-const projectRoot = path.resolve(__dirname);
 const width = 1657, height = 1657;
 
-let ENV_FILE = process.env.ENV_FILE;
+const ENV_FILE = process.env.ENV_FILE;
-let GROUP_SUFFIX = process.env.PREFIX || 'adf';
+const GROUP_SUFFIX = process.env.PREFIX || 'adf';
 
 RESOURCES.ACTIVITI_CLOUD_APPS = ACTIVITI_CLOUD_APPS;
 if (ENV_FILE) {
-    require('dotenv').config({ path: ENV_FILE });
+    require('dotenv').config({path: ENV_FILE});
 }
 
-let HOST = process.env.URL_HOST_ADF;
+const HOST = process.env.URL_HOST_ADF;
-let BROWSER_RUN = !!process.env.BROWSER_RUN;
+const BROWSER_RUN = !!process.env.BROWSER_RUN;
-let FOLDER = process.env.FOLDER || '';
+const FOLDER = process.env.FOLDER || '';
-let SELENIUM_SERVER = process.env.SELENIUM_SERVER || '';
+const SELENIUM_SERVER = process.env.SELENIUM_SERVER || '';
-let MAXINSTANCES = process.env.MAXINSTANCES || 1;
+const MAXINSTANCES = process.env.MAXINSTANCES || 1;
-let TIMEOUT = parseInt(process.env.TIMEOUT, 10);
+const MAX_RETRIES = process.env.MAX_RETRIES || 4;
-let SAVE_SCREENSHOT = (process.env.SAVE_SCREENSHOT == 'true');
+const TIMEOUT = parseInt(process.env.TIMEOUT, 10);
-let LIST_SPECS = process.env.LIST_SPECS || [];
+const SAVE_SCREENSHOT = (process.env.SAVE_SCREENSHOT === 'true');
-let LOG = !!process.env.LOG;
+const LIST_SPECS = process.env.LIST_SPECS || [];
+const LOG = !!process.env.LOG;
+
 let arraySpecs = [];
 
 if (LOG) {
     console.log('======= PROTRACTOR CONFIGURATION ====== ');
+    console.log('HOST: ', HOST);
     console.log('BROWSER_RUN : ' + BROWSER_RUN);
     console.log('SAVE_SCREENSHOT : ' + SAVE_SCREENSHOT);
     console.log('FOLDER : ' + FOLDER);
     console.log('MAXINSTANCES : ' + MAXINSTANCES);
     console.log('LIST_SPECS : ' + LIST_SPECS);
+    console.log('MAX_RETRIES: ', MAX_RETRIES);
     console.log('SELENIUM_SERVER : ' + SELENIUM_SERVER);
 }
 
-let downloadFolder = path.join(__dirname, 'e2e/downloads');
+const downloadFolder = path.join(__dirname, '/downloads');
 
-let specs = () => {
+let specs = function () {
-    let specsToRun = FOLDER ? './**/e2e/' + FOLDER + '/**/*.e2e.ts' : './**/e2e/**/*.e2e.ts';
+    let LIST_SPECS;
 
-    if (LIST_SPECS.length === 0) {
+    if (process.env.LIST_SPECS) {
-        arraySpecs = [specsToRun];
+        LIST_SPECS = process.env.LIST_SPECS;
-    } else {
+    }
+
+    if (LIST_SPECS && LIST_SPECS !== '') {
         arraySpecs = LIST_SPECS.split(',');
         arraySpecs = arraySpecs.map((el) => './' + el);
+
+        specExists(arraySpecs);
+    } else {
+        const FOLDER = process.env.FOLDER || '';
+        setProvider(FOLDER);
+        const specsToRun = FOLDER ? `./${FOLDER}/**/*.e2e.ts` : './**/*.ts';
+        arraySpecs = [specsToRun];
     }
 
     return arraySpecs;
 };
 
+let setProvider = function (folder) {
+    if (folder === 'core') {
+        testConfig.appConfig.provider = 'ALL';
+    } else if (folder === 'content-services') {
+        testConfig.appConfig.provider = 'ECM';
+    } else if (folder === 'process-services') {
+        testConfig.appConfig.provider = 'BPM';
+    } else if (folder === 'insights') {
+        testConfig.appConfig.provider = 'BPM';
+    } else if (folder === 'search') {
+        testConfig.appConfig.provider = 'ECM';
+    } else if (folder === 'process-services-cloud') {
+        testConfig.appConfig.provider = 'BPM';
+    }
+};
+
+let specExists = function (listSpecs) {
+    listSpecs.forEach((path) => {
+        if (!fs.existsSync(resolve(__dirname, path))) {
+            Logger.error(`Not valid spec path : ${resolve(__dirname, path)} valid path should be for example /search/search-component.e2e.ts`);
+        }
+    });
+};
+
 specs();
 
 exports.config = {
@@ -86,18 +117,17 @@ exports.config = {
         shardTestFiles: true,
 
         chromeOptions: {
-            binary: require('puppeteer').executablePath(),
             prefs: {
                 'credentials_enable_service': false,
                 'download': {
                     'prompt_for_download': false,
-                    "directory_upgrade": true,
+                    'directory_upgrade': true,
                     'default_directory': downloadFolder
                 },
-                "browser": {
+                'browser': {
-                    "setDownloadBehavior": {
+                    'setDownloadBehavior': {
-                        "behavior": "allow",
+                        'behavior': 'allow',
-                        "downloadPath": downloadFolder
+                        'downloadPath': downloadFolder
                     }
                 }
             },
@@ -121,7 +151,6 @@ exports.config = {
         groupSuffix: GROUP_SUFFIX,
         identityAdmin: testConfig.identityAdmin,
         identityUser: testConfig.identityUser,
-        rootPath: __dirname,
         resources: RESOURCES
     },
 
@@ -134,8 +163,8 @@ exports.config = {
         defaultTimeoutInterval: 120000,
         print: () => {
         },
-        ...SmartRunner.withOptionalExclusions(
+        ...smartRunner.withOptionalExclusions(
-            resolve(__dirname, './e2e/protractor.excludes.json')
+            resolve(__dirname, './protractor.excludes.json')
         )
     },
 
@@ -153,7 +182,7 @@ exports.config = {
         screenshotOnExpectFailure: true,
         screenshotOnSpecFailure: false,
         clearFoldersBeforeTest: true,
-        screenshotPath: `${projectRoot}/e2e-output/screenshots/`
+        screenshotPath: path.resolve(__dirname, 'e2e-output/screenshots/')
     }],
 
     onCleanUp(results) {
@@ -166,20 +195,22 @@ exports.config = {
         jasmine.DEFAULT_TIMEOUT_INTERVAL = TIMEOUT;
 
         require('ts-node').register({
-            project: 'e2e/tsconfig.e2e.json'
+            project: require('path').join(__dirname, './tsconfig.e2e.json')
         });
 
-        require("tsconfig-paths").register({
+        require('tsconfig-paths').register({
-            project: 'e2e/tsconfig.e2e.json',
+            project: './e2e/tsconfig.e2e.json',
-            baseUrl: 'e2e/',
+            baseUrl: './e2e/',
             paths: tsConfig.compilerOptions.paths
         });
 
+        // @ts-ignore
         browser.driver.sendChromiumCommand('Page.setDownloadBehavior', {
             behavior: 'allow',
             downloadPath: downloadFolder
         });
 
+        // @ts-ignore
         browser.manage().window().setSize(width, height);
 
         jasmine.getEnv().addReporter(
@@ -191,33 +222,41 @@ exports.config = {
             })
         );
 
+        // @ts-ignore
         await browser.driver.executeScript(disableCSSAnimation);
 
+        // @ts-ignore
         await browser.get(`${HOST}/settings`);
         await LocalStorageUtil.clearStorage();
-
+        // @ts-ignore
         await LocalStorageUtil.setStorageItem('ecmHost', browser.params.testConfig.appConfig.ecmHost);
+        // @ts-ignore
         await LocalStorageUtil.setStorageItem('bpmHost', browser.params.testConfig.appConfig.bpmHost);
+        // @ts-ignore
         await LocalStorageUtil.setStorageItem('providers', browser.params.testConfig.appConfig.provider);
         await LocalStorageUtil.setStorageItem('baseShareUrl', HOST);
 
+        // @ts-ignore
         if (browser.params.testConfig.appConfig.authType === 'OAUTH') {
+            // @ts-ignore
             await LocalStorageUtil.setStorageItem('authType', browser.params.testConfig.appConfig.authType);
+            // @ts-ignore
             await LocalStorageUtil.setStorageItem('identityHost', browser.params.testConfig.appConfig.identityHost);
+            // @ts-ignore
             await LocalStorageUtil.setStorageItem('oauth2', JSON.stringify(browser.params.testConfig.appConfig.oauth2));
         }
 
         await LocalStorageUtil.apiReset();
 
         function disableCSSAnimation() {
-            let css = '* {' +
+            const css = '* {' +
                 '-webkit-transition-duration: 0s !important;' +
                 'transition-duration: 0s !important;' +
                 '-webkit-animation-duration: 0s !important;' +
                 'animation-duration: 0s !important;' +
-                '}',
+                '}';
-                head = document.head || document.getElementsByTagName('head')[0],
+            const head = document.head || document.getElementsByTagName('head')[0];
-                style = document.createElement('style');
+            const style = document.createElement('style');
 
             style.type = 'text/css';
             style.appendChild(document.createTextNode(css));
@@ -246,7 +285,7 @@ exports.config = {
             }
         }
 
-        return retry.afterLaunch(4);
+        return retry.afterLaunch(MAX_RETRIES);
     }
 
 };

e2e/protractor.excludes.json

@@ -1,4 +1,5 @@
 {
-  "C290180": "https://issues.alfresco.com/jira/browse/ACS-364"
+  "C290180": "https://issues.alfresco.com/jira/browse/ACS-364",
+  "C277201": "Investigate after NG10"
 }
 

e2e/protractor/save-remote.js

@@ -1,7 +1,6 @@
 const fs = require('fs');
 const rimraf = require('rimraf');
 const path = require('path');
-const projectRoot = path.resolve(__dirname, '../../');
 const TestConfig = require('../test.config');
 const AlfrescoApi = require('@alfresco/js-api').AlfrescoApiCompatibility;
 
@@ -15,7 +14,7 @@ function buildNumber() {
 }
 
 async function uploadScreenshot(retryCount) {
-    let files = fs.readdirSync(path.join(__dirname, '../../e2e-output/screenshots'));
+    let files = fs.readdirSync(path.join(__dirname, '../e2e-output/screenshots'));
 
     if (files && files.length > 0) {
 
@@ -46,7 +45,7 @@ async function uploadScreenshot(retryCount) {
         }
 
         for (const fileName of files) {
-            let pathFile = path.join(__dirname, '../../e2e-output/screenshots', fileName);
+            let pathFile = path.join(__dirname, '../e2e-output/screenshots', fileName);
             let file = fs.createReadStream(pathFile);
 
             let safeFileName = fileName.match(/\[(.*?)\]/);
@@ -74,7 +73,7 @@ async function uploadScreenshot(retryCount) {
 }
 
 async function cleanReportFolder() {
-    let reportsFolder = `${projectRoot}/e2e-output/junit-report/`;
+    const reportsFolder = path.resolve(__dirname, '../e2e-output/junit-report/');
 
     fs.exists(reportsFolder, function (exists, error) {
         if (exists) {

e2e/search/components/search-number-range.e2e.ts

@@ -175,18 +175,16 @@ describe('Search Number Range Filter', () => {
 
         const results = await dataTable.geCellElementDetail('Size') as ElementFinder[];
         for (const currentResult of results) {
-            try {
             const currentSize = await currentResult.getAttribute('title');
+
             if (currentSize && currentSize.trim() !== '') {
                 await expect(parseInt(currentSize, 10) <= toSize).toBe(true);
             }
-            } catch (e) {
-            }
         }
     });
 
     it('[C276944] Should be able to filter by name when size range filter is applied', async () => {
-        const nameFilter = await searchFilters.textFiltersPage();
+        const nameFilter = searchFilters.textFiltersPage();
         const toSize = 40;
         const fromSize = 0;
         await searchFilters.checkNameFilterIsDisplayed();
@@ -204,13 +202,10 @@ describe('Search Number Range Filter', () => {
 
         const results = await dataTable.geCellElementDetail('Size') as ElementFinder[];
         for (const currentResult of results) {
-            try {
             const currentSize = await currentResult.getAttribute('title');
             if (currentSize && currentSize.trim() !== '') {
                 await expect(parseInt(currentSize, 10) <= toSize).toBe(true);
             }
-            } catch (e) {
-            }
         }
 
         await searchFilters.checkNameFilterIsDisplayed();
@@ -220,24 +215,18 @@ describe('Search Number Range Filter', () => {
 
         const resultsSize = await dataTable.geCellElementDetail('Size') as ElementFinder[];
         for (const currentResult of resultsSize) {
-            try {
             const currentSize = await currentResult.getAttribute('title');
             if (currentSize && currentSize.trim() !== '') {
                 await expect(parseInt(currentSize, 10) <= toSize).toBe(true);
             }
-            } catch (e) {
-            }
         }
 
         const resultsDisplay = await dataTable.geCellElementDetail('Display name') as ElementFinder[];
         for (const currentResult of resultsDisplay) {
-            try {
             const name = await currentResult.getAttribute('title');
             if (name && name.trim() !== '') {
                 await expect(/z*/i.test(name)).toBe(true);
             }
-            } catch (e) {
-            }
         }
     });
 
@@ -271,13 +260,10 @@ describe('Search Number Range Filter', () => {
 
         const results = await dataTable.geCellElementDetail('Size') as ElementFinder[];
         for (const currentResult of results) {
-            try {
             const currentSize = await currentResult.getAttribute('title');
             if (currentSize && currentSize.trim() !== '') {
                 await expect(currentSize === '0').toBe(true);
             }
-            } catch (e) {
-            }
         }
     });
 
@@ -313,13 +299,10 @@ describe('Search Number Range Filter', () => {
 
         const results = await dataTable.geCellElementDetail('Size') as ElementFinder[];
         for (const currentResult of results) {
-            try {
             const currentSize = await currentResult.getAttribute('title');
             if (currentSize && currentSize.trim() !== '') {
                 await expect(parseInt(currentSize, 10) <= 1000).toBe(true);
             }
-            } catch (e) {
-            }
         }
 
         await sizeRangeFilter.clickClearButton();
@@ -329,13 +312,10 @@ describe('Search Number Range Filter', () => {
 
         const resultsSize = await dataTable.geCellElementDetail('Size') as ElementFinder[];
         for (const currentResult of resultsSize) {
-            try {
             const currentSize = await currentResult.getAttribute('title');
             if (currentSize && currentSize.trim() !== '') {
                 await expect(parseInt(currentSize, 10) >= 1000).toBe(true);
             }
-            } catch (e) {
-            }
         }
     });
 

e2e/search/components/search-slider.e2e.ts

@@ -126,13 +126,11 @@ describe('Search Slider Filter', () => {
 
         const results = await dataTable.geCellElementDetail('Size') as ElementFinder[];
         for (const currentResult of results) {
-            try {
             const currentSize = await currentResult.getAttribute('title');
+
             if (currentSize && currentSize.trim() !== '') {
                 await expect(parseInt(currentSize, 10) <= 5000).toBe(true);
             }
-            } catch (e) {
-            }
         }
 
         await sizeSliderFilter.checkSliderIsDisplayed();
@@ -143,13 +141,11 @@ describe('Search Slider Filter', () => {
 
         const resultsSize = await dataTable.geCellElementDetail('Size') as ElementFinder[];
         for (const currentResult of resultsSize) {
-            try {
             const currentSize = await currentResult.getAttribute('title');
+
             if (currentSize && currentSize.trim() !== '') {
                 await expect(parseInt(currentSize, 10) >= 5000).toBe(true);
             }
-            } catch (e) {
-            }
         }
     });
 

lib/cli/package.json

@@ -23,8 +23,8 @@
     "commander": "^4.0.0",
     "license-checker": "^25.0.1",
     "npm-registry-fetch": "^3.9.0",
-    "@angular-devkit/core": "^7.2.15",
+    "@angular-devkit/core": "^9.1.7",
-    "rxjs": ">=6.2.2",
+    "rxjs": "^6.5.5",
     "shelljs": "^0.8.3",
     "spdx-license-list": "^5.0.0",
     "ejs": "^2.6.1"
@@ -35,6 +35,6 @@
   "license": "Apache-2.0",
   "devDependencies": {
     "@types/shelljs": "^0.8.7",
-    "typescript": "3.1.6"
+    "typescript": "3.9.3"
   }
 }

lib/cli/tsconfig.lib.prod.json

@@ -0,0 +1,6 @@
+{
+  "extends": "./tsconfig.lib.json",
+  "angularCompilerOptions": {
+    "enableIvy": false
+  }
+}

lib/config/bundle-content-services-scss.js

@@ -1,5 +1,5 @@
 var Bundler = require('scss-bundle').Bundler;
-var writeFileSync = require('fs-extra').writeFileSync;
+var writeFileSync = require('fs').writeFileSync;
 
 new Bundler().Bundle('./lib/content-services/src/lib/styles/_index.scss', '**/*.scss').then(result => {
     writeFileSync('./lib/dist/content-services/_theming.scss', result.bundledContent);

lib/config/bundle-core-scss.js

@@ -1,5 +1,5 @@
 var Bundler = require('scss-bundle').Bundler;
-var writeFileSync = require('fs-extra').writeFileSync;
+var writeFileSync = require('fs').writeFileSync;
 
 new Bundler().Bundle('./lib/core/styles/_index.scss', '**/*.scss').then(result => {
     writeFileSync('./lib/dist/core/_theming.scss', result.bundledContent);

lib/config/bundle-insights-scss.js

@@ -1,5 +1,5 @@
 var Bundler = require('scss-bundle').Bundler;
-var writeFileSync = require('fs-extra').writeFileSync;
+var writeFileSync = require('fs').writeFileSync;
 
 new Bundler().Bundle('./lib/insights/src/lib/styles/_index.scss', '**/*.scss').then(result => {
     writeFileSync('./lib/dist/insights/_theming.scss', result.bundledContent);

lib/config/bundle-process-services-cloud-scss.js

@@ -1,5 +1,5 @@
 var Bundler = require('scss-bundle').Bundler;
-var writeFileSync = require('fs-extra').writeFileSync;
+var writeFileSync = require('fs').writeFileSync;
 
 new Bundler().Bundle('./lib/process-services-cloud/src/lib/styles/_index.scss', '**/*.scss').then(result => {
     writeFileSync('./lib/dist/process-services-cloud/_theming.scss', result.bundledContent);

lib/config/bundle-process-services-scss.js

@@ -1,5 +1,5 @@
 var Bundler = require('scss-bundle').Bundler;
-var writeFileSync = require('fs-extra').writeFileSync;
+var writeFileSync = require('fs').writeFileSync;
 
 new Bundler().Bundle('./lib/process-services/src/lib/styles/_index.scss', '**/*.scss').then(result => {
     writeFileSync('./lib/dist/process-services/_theming.scss', result.bundledContent);

lib/content-services/karma.conf.js

@@ -1,7 +1,5 @@
 // Karma configuration file, see link for more information
 // https://karma-runner.github.io/1.0/config/configuration-file.html
-process.env.CHROME_BIN = require('puppeteer').executablePath();
-
 module.exports = function (config) {
     config.set({
         basePath: '../../',
@@ -9,8 +7,6 @@ module.exports = function (config) {
         files: [
             {pattern: 'node_modules/core-js/client/core.js', included: true, watched: false},
             {pattern: 'node_modules/tslib/tslib.js', included: true, watched: false},
-            {pattern: 'node_modules/hammerjs/hammer.min.js', included: true, watched: false},
-            {pattern: 'node_modules/hammerjs/hammer.min.js.map', included: false, watched: false},
 
             // pdf-js
             {pattern: 'node_modules/pdfjs-dist/build/pdf.js', included: true, watched: false},

lib/content-services/ng-package.json

@@ -6,14 +6,12 @@
     "flatModuleFile": "adf-content-services",
     "umdModuleIds": {
       "@alfresco/js-api": "@alfresco/js-api",
-      "minimatch": "minimatch",
       "@angular/platform-browser/animations": "@angular/platform-browser/animations",
       "@angular/material": "@angular/material",
       "@mat-datetimepicker/core": "@mat-datetimepicker/core",
       "@mat-datetimepicker/moment": "@mat-datetimepicker/moment",
       "@angular/flex-layout": "@angular/flex-layout",
       "@alfresco/adf-core": "@alfresco/adf-core",
-      "@angular/material-moment-adapter": "@angular/material-moment-adapter",
       "@angular/animations": "@angular/animations",
       "@angular/cdk/platform": "@angular/cdk/platform",
       "@angular/material/core": "@angular/material/core",

lib/content-services/package.json

@@ -12,26 +12,18 @@
     "url": "https://github.com/Alfresco/alfresco-ng2-components/issues"
   },
   "peerDependencies": {
-    "@angular/animations": ">=7.0.3",
+    "@angular/animations": ">=9.1.9",
-    "@angular/cdk": ">=7.0.3",
+    "@angular/cdk": ">=9.2.4",
-    "@angular/common": ">=7.0.3",
+    "@angular/common": ">=9.1.9",
-    "@angular/compiler": ">=7.0.3",
+    "@angular/core": ">=9.1.9",
-    "@angular/core": ">=7.0.3",
+    "@angular/flex-layout": ">=9.0.0-beta.31",
-    "@angular/flex-layout": ">=7.0.0-beta.19",
+    "@angular/forms": ">=9.1.9",
-    "@angular/forms": ">=7.0.3",
+    "@angular/material": ">=9.2.4",
-    "@angular/material": ">=7.0.3",
+    "@angular/router": ">=9.1.9",
-    "@angular/material-moment-adapter": ">=7.0.3",
+    "@alfresco/js-api": ">=3.8.0",
-    "@angular/platform-browser": ">=7.0.3",
+    "@alfresco/adf-core": ">=3.8.0",
-    "@angular/platform-browser-dynamic": ">=7.0.3",
+    "@ngx-translate/core": ">=12.1.2",
-    "@angular/router": ">=7.0.3",
+    "moment": ">=2.22.2"
-    "@alfresco/js-api": "3.9.0",
-    "rxjs": ">=6.2.2",
-    "@alfresco/adf-core": "3.9.0",
-    "@ngx-translate/core": ">=11.0.0",
-    "hammerjs": ">=2.0.8",
-    "moment": ">=2.22.2",
-    "reflect-metadata": ">=0.1.10",
-    "zone.js": ">=0.8.26"
   },
   "keywords": [
     "content-services",

lib/content-services/src/lib/breadcrumb/breadcrumb.component.spec.ts

@@ -49,7 +49,7 @@ describe('Breadcrumb', () => {
         fixture = TestBed.createComponent(BreadcrumbComponent);
         component = fixture.componentInstance;
         documentListComponent = TestBed.createComponent<DocumentListComponent>(DocumentListComponent).componentInstance;
-        documentListService = TestBed.get(DocumentListService);
+        documentListService = TestBed.inject(DocumentListService);
     });
 
     afterEach(() => {

lib/content-services/src/lib/breadcrumb/breadcrumb.component.ts

@@ -26,7 +26,7 @@ import {
     ViewEncapsulation,
     OnDestroy
 } from '@angular/core';
-import { MatSelect } from '@angular/material';
+import { MatSelect } from '@angular/material/select';
 import { Node, PathElementEntity } from '@alfresco/js-api';
 import { DocumentListComponent } from '../document-list';
 import { Subject } from 'rxjs';

lib/content-services/src/lib/breadcrumb/dropdown-breadcrumb.component.spec.ts

@@ -46,7 +46,7 @@ describe('DropdownBreadcrumb', () => {
         fixture = TestBed.createComponent(DropdownBreadcrumbComponent);
         component = fixture.componentInstance;
         documentList = TestBed.createComponent<DocumentListComponent>(DocumentListComponent).componentInstance;
-        documentListService = TestBed.get(DocumentListService);
+        documentListService = TestBed.inject(DocumentListService);
     }));
 
     afterEach(async(() => {

lib/content-services/src/lib/breadcrumb/dropdown-breadcrumb.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, OnChanges, ViewChild, ViewEncapsulation } from '@angular/core';
-import { MatSelect } from '@angular/material';
+import { MatSelect } from '@angular/material/select';
 import { PathElementEntity, Node } from '@alfresco/js-api';
 import { BreadcrumbComponent } from './breadcrumb.component';
 

lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts

@@ -51,9 +51,9 @@ describe('ContentMetadataComponent', () => {
     beforeEach(() => {
         fixture = TestBed.createComponent(ContentMetadataComponent);
         component = fixture.componentInstance;
-        contentMetadataService = TestBed.get(ContentMetadataService);
+        contentMetadataService = TestBed.inject(ContentMetadataService);
-        updateService = TestBed.get(CardViewUpdateService);
+        updateService = TestBed.inject(CardViewUpdateService);
-        nodesApiService = TestBed.get(NodesApiService);
+        nodesApiService = TestBed.inject(NodesApiService);
 
         node = <Node> {
             id: 'node-id',
@@ -145,7 +145,7 @@ describe('ContentMetadataComponent', () => {
         }));
 
         it('should throw error on unsuccessful save', fakeAsync(async (done) => {
-            const logService: LogService = TestBed.get(LogService);
+            const logService: LogService = TestBed.inject(LogService);
             component.editable = true;
             const property = <CardViewBaseItemModel> { key: 'properties.property-key', value: 'original-value' };
             updateService.update(property, 'updated-value');

lib/content-services/src/lib/content-metadata/services/config/content-metadata-config.factory.spec.ts

@@ -44,8 +44,8 @@ describe('ContentMetadataConfigFactory', () => {
     });
 
     beforeEach(async(() => {
-        factory = TestBed.get(ContentMetadataConfigFactory);
+        factory = TestBed.inject(ContentMetadataConfigFactory);
-        appConfig = TestBed.get(AppConfigService);
+        appConfig = TestBed.inject(AppConfigService);
     }));
 
     describe('get', () => {
@@ -53,7 +53,7 @@ describe('ContentMetadataConfigFactory', () => {
         let logService: LogService;
 
         beforeEach(async(() => {
-            logService = TestBed.get(LogService);
+            logService = TestBed.inject(LogService);
             spyOn(logService, 'error').and.stub();
         }));
 

lib/content-services/src/lib/content-metadata/services/content-metadata.service.spec.ts

@@ -63,10 +63,10 @@ describe('ContentMetaDataService', () => {
     }
 
     beforeEach(() => {
-        service = TestBed.get(ContentMetadataService);
+        service = TestBed.inject(ContentMetadataService);
-        const alfrescoApiService = TestBed.get(AlfrescoApiService);
+        const alfrescoApiService = TestBed.inject(AlfrescoApiService);
         classesApi = alfrescoApiService.classesApi;
-        appConfig = TestBed.get(AppConfigService);
+        appConfig = TestBed.inject(AppConfigService);
     });
 
     it('should return all the properties of the node', () => {