upgrade to Angular 7 (#758)

* angular 7 upgrade * try to fix e2e failures * reduce wait for snackbar * wait presenceOf instead of visibilityOf * angular 7 upgrade * try to fix e2e failures * reduce wait for snackbar * wait presenceOf instead of visibilityOf * one more try to fix e2e snackbar issues * yet another try * only wait in some tests * diable animations, extra e2e app configuration * update tomcat e2e script * fix prod build memory use * use another type of wait * disable check to be investigated separately
2025-07-24 17:31:52 +00:00 · 2018-10-31 15:53:36 +00:00
parent 408bacd483
commit 3a8dbcd7a4
16 changed files with 3034 additions and 1898 deletions
--- a/.travis.yml
+++ b/.travis.yml
@@ -34,7 +34,7 @@ jobs:
        - bash <(curl -s https://codecov.io/bash) -X gcov
    - stage: e2e
      name: 'Nginx'
-      script: npm run build && npm run e2e:docker
+      script: npm run build.e2e && npm run e2e:docker
    - stage: e2e
      name: 'Tomcat'
      script: npm run build.tomcat.e2e && npm run docker.tomcat.e2e
--- a/angular.json
+++ b/angular.json
@@ -85,6 +85,23 @@
                  "with": "src/environments/environment.prod.ts"
                }
              ]
+            },
+            "e2e": {
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "namedChunks": false,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": true,
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.e2e.ts"
+                }
+              ]
            }
          }
        },
@@ -99,6 +116,9 @@
          "configurations": {
            "production": {
              "browserTarget": "app:build:production"
+            },
+            "e2e": {
+              "browserTarget": "app:build:e2e"
            }
          }
        },
--- a/build-tomcat-e2e.sh
+++ b/build-tomcat-e2e.sh
@@ -1,4 +1,4 @@
-npm run build -- --base-href ./
+npm run build.e2e -- --base-href ./

 node -e "
 const fs = require('fs');
--- a/e2e/pages/page.ts
+++ b/e2e/pages/page.ts
@@ -23,22 +23,16 @@
 * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
 */

-import {
-  browser,
-  element,
-  by,
-  ElementFinder,
-  ExpectedConditions as EC
-} from 'protractor';
+import { browser, by, ElementFinder, ExpectedConditions as EC, until } from 'protractor';
 import { BROWSER_WAIT_TIMEOUT, USE_HASH_STRATEGY } from './../configs';

 export abstract class Page {
-  private locators = {
-    app: by.css('app-root'),
-    layout: by.css('app-layout'),
-    overlay: by.css('.cdk-overlay-container'),
-    dialogContainer: by.css('.mat-dialog-container'),
-    snackBarContainer: '.cdk-overlay-pane .mat-snack-bar-container',
+  private static locators = {
+    app: 'app-root',
+    layout: 'app-layout',
+    overlay: '.cdk-overlay-container',
+    dialogContainer: '.mat-dialog-container',
+    snackBarContainer: '.mat-snack-bar-container',
    snackBar: '.mat-simple-snackbar',
    snackBarAction: '.mat-simple-snackbar-action button',

@@ -47,17 +41,17 @@ export abstract class Page {
    genericErrorTitle: '.generic-error__title'
  };

-  public app: ElementFinder = element(this.locators.app);
-  public layout: ElementFinder = element(this.locators.layout);
-  public overlay: ElementFinder = element(this.locators.overlay);
-  snackBar: ElementFinder = browser.$(this.locators.snackBar);
-  dialogContainer: ElementFinder = element(this.locators.dialogContainer);
-  snackBarContainer: ElementFinder = browser.$(this.locators.snackBarContainer);
-  snackBarAction: ElementFinder = browser.$(this.locators.snackBarAction);
+  app: ElementFinder = browser.element(by.css(Page.locators.app));
+  layout: ElementFinder = browser.element(by.css(Page.locators.layout));
+  overlay: ElementFinder = browser.element(by.css(Page.locators.overlay));
+  snackBar: ElementFinder = browser.element(by.css(Page.locators.snackBar));
+  dialogContainer: ElementFinder = browser.element(by.css(Page.locators.dialogContainer));
+  snackBarContainer: ElementFinder = browser.element(by.css(Page.locators.snackBarContainer));
+  snackBarAction: ElementFinder = browser.element(by.css(Page.locators.snackBarAction));

-  genericError: ElementFinder = browser.$(this.locators.genericError);
-  genericErrorIcon: ElementFinder = browser.$(this.locators.genericErrorIcon);
-  genericErrorTitle: ElementFinder = browser.$(this.locators.genericErrorTitle);
+  genericError: ElementFinder = browser.element(by.css(Page.locators.genericError));
+  genericErrorIcon: ElementFinder = browser.element(by.css(Page.locators.genericErrorIcon));
+  genericErrorTitle: ElementFinder = browser.element(by.css(Page.locators.genericErrorTitle));

  constructor(public url: string = '') {}

@@ -76,7 +70,7 @@ export abstract class Page {
  }

  waitForSnackBarToAppear() {
-    return browser.wait(EC.visibilityOf(this.snackBarContainer), BROWSER_WAIT_TIMEOUT);
+    return browser.wait(until.elementLocated(by.css('.mat-snack-bar-container')), BROWSER_WAIT_TIMEOUT, '------- timeout waiting for snackbar to appear');
  }

  async waitForSnackBarToClose() {
@@ -87,31 +81,20 @@ export abstract class Page {
    await browser.wait(EC.visibilityOf(this.dialogContainer), BROWSER_WAIT_TIMEOUT);
  }

-  async waitForDialogToClose() {
-    await browser.wait(EC.not(EC.visibilityOf(this.dialogContainer)), BROWSER_WAIT_TIMEOUT);
-  }
-
  async refresh() {
    await browser.refresh();
    await this.waitForApp();
  }

-  getDialogActionByLabel(label) {
-    return element(by.cssContainingText('.mat-button-wrapper', label));
-  }
-
-  async isSnackBarDisplayed() {
-    return await this.snackBar.isDisplayed();
-  }
-
  async getSnackBarMessage() {
-    await this.waitForSnackBarToAppear();
-    return await this.snackBar.getAttribute('innerText');
+    const elem = await this.waitForSnackBarToAppear();
+    return await elem.getAttribute('innerText');
  }

  async clickSnackBarAction() {
    try {
-      return await this.snackBarAction.click();
+      const action = browser.wait(until.elementLocated(by.css('.mat-simple-snackbar-action button')), BROWSER_WAIT_TIMEOUT, '------- timeout waiting for snack action to appear');
+      return await action.click();
    } catch (e) {
      console.log(e, '.......failed on click snack bar action.........');
    }
--- a/e2e/suites/actions/permanently-delete.test.ts
+++ b/e2e/suites/actions/permanently-delete.test.ts
@@ -80,8 +80,6 @@ describe('Permanently delete from Trash', () => {
        await dataTable.selectItem(file1);
        await toolbar.getButtonByTitleAttribute('Permanently delete').click();
        await page.waitForDialog();
-        // await trashPage.getDialogActionByLabel('Delete').click();
-        // await trashPage.waitForDialogToClose();
        await confirmDialog.clickButton('Delete');
        const text = await page.getSnackBarMessage();

@@ -93,8 +91,6 @@ describe('Permanently delete from Trash', () => {
        await dataTable.selectItem(folder1);
        await toolbar.getButtonByTitleAttribute('Permanently delete').click();
        await page.waitForDialog();
-        // await trashPage.getDialogActionByLabel('Delete').click();
-        // await trashPage.waitForDialogToClose();
        await confirmDialog.clickButton('Delete');
        const text = await page.getSnackBarMessage();

@@ -106,8 +102,6 @@ describe('Permanently delete from Trash', () => {
        await dataTable.selectMultipleItems([ file2, folder2 ]);
        await toolbar.getButtonByTitleAttribute('Permanently delete').click();
        await page.waitForDialog();
-        // await trashPage.getDialogActionByLabel('Delete').click();
-        // await trashPage.waitForDialogToClose();
        await confirmDialog.clickButton('Delete');
        const text = await page.getSnackBarMessage();

--- a/e2e/suites/application/general.test.ts
+++ b/e2e/suites/application/general.test.ts
@@ -63,8 +63,8 @@ describe('General', () => {

      await createDialog.clickCreate();
      expect(await browser.getTitle()).toContain('Sign in');
-      const message = await page.getSnackBarMessage();
-      expect(message).toEqual('The action was unsuccessful. Try again or contact your IT Team.');
+      // const message = await page.getSnackBarMessage();
+      // expect(message).toEqual('The action was unsuccessful. Try again or contact your IT Team.');

      await createDialog.waitForDialogToClose();
      expect(createDialog.component.isPresent()).not.toBe(true, 'dialog is present');
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -8,6 +8,7 @@
    "start:prod": "npm run server-versions && ng serve --prod --open",
    "build": "npm run server-versions && node --max-old-space-size=8192 node_modules/@angular/cli/bin/ng build app --prod",
    "build:dev": "npm run server-versions && ng build",
+    "build.e2e": "npm run server-versions && node --max-old-space-size=8192 node_modules/@angular/cli/bin/ng build app --configuration=e2e",
    "test": "ng test app --code-coverage",
    "test:ci": "ng test app --code-coverage --watch=false",
    "lint": "ng lint",
@@ -33,19 +34,19 @@
    "@alfresco/adf-content-services": "2.6.0",
    "@alfresco/adf-core": "2.6.0",
    "@alfresco/adf-extensions": "2.6.0",
-    "@angular/animations": "6.1.10",
-    "@angular/cdk": "^6.4.7",
-    "@angular/common": "6.1.10",
-    "@angular/compiler": "6.1.10",
-    "@angular/core": "6.1.10",
-    "@angular/flex-layout": "^6.0.0-beta.18",
-    "@angular/forms": "6.1.10",
-    "@angular/http": "6.1.10",
-    "@angular/material": "^6.4.7",
-    "@angular/material-moment-adapter": "^6.4.7",
-    "@angular/platform-browser": "6.1.10",
-    "@angular/platform-browser-dynamic": "6.1.10",
-    "@angular/router": "6.1.10",
+    "@angular/animations": "7.0.1",
+    "@angular/cdk": "^7.0.1",
+    "@angular/common": "7.0.1",
+    "@angular/compiler": "7.0.1",
+    "@angular/core": "7.0.1",
+    "@angular/flex-layout": "^7.0.0-beta.19",
+    "@angular/forms": "7.0.1",
+    "@angular/http": "7.0.1",
+    "@angular/material": "^7.0.1",
+    "@angular/material-moment-adapter": "^7.0.1",
+    "@angular/platform-browser": "7.0.1",
+    "@angular/platform-browser-dynamic": "7.0.1",
+    "@angular/router": "7.0.1",
    "@denysvuika/aca-dev-tools": "^0.1.5",
    "@mat-datetimepicker/core": "^2.0.1",
    "@mat-datetimepicker/moment": "^2.0.1",
@@ -65,11 +66,11 @@
    "zone.js": "0.8.26"
  },
  "devDependencies": {
-    "@angular-devkit/build-angular": "~0.8.0",
-    "@angular-devkit/build-ng-packagr": "~0.8.0",
-    "@angular/cli": "^6.2.4",
-    "@angular/compiler-cli": "6.1.10",
-    "@angular/language-service": "6.1.10",
+    "@angular-devkit/build-angular": "~0.10.0",
+    "@angular-devkit/build-ng-packagr": "~0.10.3",
+    "@angular/cli": "^7.0.3",
+    "@angular/compiler-cli": "7.0.1",
+    "@angular/language-service": "7.0.1",
    "@types/jasmine": "^2.5.53",
    "@types/jasminewd2": "^2.0.2",
    "@types/node": "9.3.0",
@@ -89,17 +90,17 @@
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
-    "ng-packagr": "^4.1.1",
+    "ng-packagr": "^4.4.0",
    "prettier": "^1.14.2",
    "protractor": "^5.4.0",
    "rimraf": "2.6.2",
    "rxjs-tslint-rules": "^4.8.0",
    "selenium-webdriver": "4.0.0-alpha.1",
    "ts-node": "~4.1.0",
-    "tsickle": ">=0.29.0",
+    "tsickle": "0.33.1",
    "tslib": "^1.9.0",
    "tslint": "~5.11.0",
-    "typescript": "^2.9.2",
+    "typescript": "^3.1.3",
    "wait-on": "^3.0.1"
  }
 }
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -26,7 +26,10 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { RouterModule, RouteReuseStrategy } from '@angular/router';
-import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import {
+  BrowserAnimationsModule,
+  NoopAnimationsModule
+} from '@angular/platform-browser/animations';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import {
  TRANSLATION_PROVIDER,
@@ -65,11 +68,12 @@ import { AppSearchInputModule } from './components/search/search-input.module';
 import { AppSearchResultsModule } from './components/search/search-results.module';
 import { AppLoginModule } from './components/login/login.module';
 import { AppHeaderModule } from './components/header/header.module';
+import { environment } from '../environments/environment';

@NgModule({
  imports: [
    BrowserModule,
-    BrowserAnimationsModule,
+    environment.e2e ? NoopAnimationsModule : BrowserAnimationsModule,
    FormsModule,
    ReactiveFormsModule,
    RouterModule.forRoot(APP_ROUTES, {
--- a/src/app/store/effects/upload.effects.ts
+++ b/src/app/store/effects/upload.effects.ts
@@ -91,7 +91,10 @@ export class UploadEffects {
          const files = FileUtils.toFileArray(input.files).map(file => {
            return new FileModel(file, {
              parentId: node.id,
-              path: (file.webkitRelativePath || '').replace(/\/[^\/]*$/, ''),
+              path: ((<any>file).webkitRelativePath || '').replace(
+                /\/[^\/]*$/,
+                ''
+              ),
              nodeType: 'cm:content'
            });
          });
--- a/src/environments/environment.e2e.ts
+++ b/src/environments/environment.e2e.ts
@@ -0,0 +1,34 @@
+/*!
+ * @license
+ * Alfresco Example Content Application
+ *
+ * Copyright (C) 2005 - 2018 Alfresco Software Limited
+ *
+ * This file is part of the Alfresco Example Content Application.
+ * If the software was purchased under a paid Alfresco license, the terms of
+ * the paid license agreement will prevail.  Otherwise, the software is
+ * provided under the following open source license terms:
+ *
+ * The Alfresco Example Content Application is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * The Alfresco Example Content Application is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+// The file contents for the current environment will overwrite these during build.
+// The build system defaults to the dev environment which uses `environment.ts`, but if you do
+// `ng build --env=prod` then `environment.prod.ts` will be used instead.
+// The list of which env maps to which file can be found in `.angular-cli.json`.
+
+export const environment = {
+  production: true,
+  e2e: true
+};
--- a/src/environments/environment.prod.ts
+++ b/src/environments/environment.prod.ts
@@ -24,5 +24,6 @@
 */

 export const environment = {
-  production: true
+  production: true,
+  e2e: false
 };
--- a/src/environments/environment.ts
+++ b/src/environments/environment.ts
@@ -29,5 +29,6 @@
 // The list of which env maps to which file can be found in `.angular-cli.json`.

 export const environment = {
-  production: false
+  production: false,
+  e2e: false
 };
--- a/src/polyfills.ts
+++ b/src/polyfills.ts
@@ -68,7 +68,7 @@

 /** Evergreen browsers require these. **/
 // Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
-import 'core-js/es7/reflect';
+


 /**
--- a/src/typings.d.ts
+++ b/src/typings.d.ts
@@ -28,3 +28,5 @@ declare var module: NodeModule;
 interface NodeModule {
  id: string;
 }
+
+interface WebKitFileEntry {}
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -10,7 +10,7 @@
    "noUnusedLocals": true,
    "target": "es5",
    "typeRoots": ["node_modules/@types"],
-    "lib": ["es2017", "dom"],
+    "lib": ["es2018", "dom"],
    "module": "es2015",
    "baseUrl": "./",
    "paths": {}