diff --git a/integration/README.md b/integration/README.md index 3b7b5bc976..a95ef0eef2 100644 --- a/integration/README.md +++ b/integration/README.md @@ -20,6 +20,15 @@ $ ng new cli-hello-world # typescript version ``` +## Render3 tests + +The directory `hello_world_cli` contains a test for render3 used with the angular cli. + +If the Angular CLI is modified to generate a render3 application this should be replaced with that project. + +If the render3 is updated to support the Angular 5 bootstrap a version of this project should be created that +uses the Angular 5 bootstrap. + ## Writing an integration test The API for each test is: diff --git a/integration/_payload-limits.json b/integration/_payload-limits.json index b5fc10800d..8383e911f0 100644 --- a/integration/_payload-limits.json +++ b/integration/_payload-limits.json @@ -28,5 +28,14 @@ "bundle": 34694 } } + }, + "hello_world__render3__cli": { + "master": { + "uncompressed": { + "inline": 1447, + "main": 40513, + "polyfills": 61085 + } + } } -} +} \ No newline at end of file diff --git a/integration/hello_world__render3__cli/.angular-cli.json b/integration/hello_world__render3__cli/.angular-cli.json new file mode 100644 index 0000000000..3bd3aba034 --- /dev/null +++ b/integration/hello_world__render3__cli/.angular-cli.json @@ -0,0 +1,60 @@ +{ + "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "project": { + "name": "hw2" + }, + "apps": [ + { + "root": "src", + "outDir": "dist", + "assets": [ + "assets", + "favicon.ico" + ], + "index": "index.html", + "main": "main.ts", + "polyfills": "polyfills.ts", + "test": "test.ts", + "tsconfig": "tsconfig.app.json", + "testTsconfig": "tsconfig.spec.json", + "prefix": "app", + "styles": [ + "styles.css" + ], + "scripts": [], + "environmentSource": "environments/environment.ts", + "environments": { + "dev": "environments/environment.ts", + "prod": "environments/environment.prod.ts" + } + } + ], + "e2e": { + "protractor": { + "config": "./protractor.conf.js" + } + }, + "lint": [ + { + "project": "src/tsconfig.app.json", + "exclude": "**/node_modules/**" + }, + { + "project": "src/tsconfig.spec.json", + "exclude": "**/node_modules/**" + }, + { + "project": "e2e/tsconfig.e2e.json", + "exclude": "**/node_modules/**" + } + ], + "test": { + "karma": { + "config": "./karma.conf.js" + } + }, + "defaults": { + "styleExt": "css", + "component": {} + } +} diff --git a/integration/hello_world__render3__cli/README.md b/integration/hello_world__render3__cli/README.md new file mode 100644 index 0000000000..e6fb793a03 --- /dev/null +++ b/integration/hello_world__render3__cli/README.md @@ -0,0 +1,27 @@ +# Hw2 + +This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.7.0-beta.1. + +## Development server + +Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files. + +## Code scaffolding + +Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`. + +## Build + +Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `-prod` flag for a production build. + +## Running unit tests + +Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). + +## Running end-to-end tests + +Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/). + +## Further help + +To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md). diff --git a/integration/hello_world__render3__cli/e2e/app.e2e-spec.ts b/integration/hello_world__render3__cli/e2e/app.e2e-spec.ts new file mode 100644 index 0000000000..7a39490d7a --- /dev/null +++ b/integration/hello_world__render3__cli/e2e/app.e2e-spec.ts @@ -0,0 +1,14 @@ +import { AppPage } from './app.po'; + +describe('hw2 App', () => { + let page: AppPage; + + beforeEach(() => { + page = new AppPage(); + }); + + it('should display welcome message', () => { + page.navigateTo(); + expect(page.getParagraphText()).toEqual('Welcome to app!'); + }); +}); diff --git a/integration/hello_world__render3__cli/e2e/app.po.ts b/integration/hello_world__render3__cli/e2e/app.po.ts new file mode 100644 index 0000000000..82ea75ba50 --- /dev/null +++ b/integration/hello_world__render3__cli/e2e/app.po.ts @@ -0,0 +1,11 @@ +import { browser, by, element } from 'protractor'; + +export class AppPage { + navigateTo() { + return browser.get('/'); + } + + getParagraphText() { + return element(by.css('app-root h1')).getText(); + } +} diff --git a/integration/hello_world__render3__cli/e2e/tsconfig.e2e.json b/integration/hello_world__render3__cli/e2e/tsconfig.e2e.json new file mode 100644 index 0000000000..1d9e5edf09 --- /dev/null +++ b/integration/hello_world__render3__cli/e2e/tsconfig.e2e.json @@ -0,0 +1,14 @@ +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "outDir": "../out-tsc/e2e", + "baseUrl": "./", + "module": "commonjs", + "target": "es5", + "types": [ + "jasmine", + "jasminewd2", + "node" + ] + } +} diff --git a/integration/hello_world__render3__cli/karma.conf.js b/integration/hello_world__render3__cli/karma.conf.js new file mode 100644 index 0000000000..af139fada3 --- /dev/null +++ b/integration/hello_world__render3__cli/karma.conf.js @@ -0,0 +1,33 @@ +// Karma configuration file, see link for more information +// https://karma-runner.github.io/1.0/config/configuration-file.html + +module.exports = function (config) { + config.set({ + basePath: '', + frameworks: ['jasmine', '@angular/cli'], + plugins: [ + require('karma-jasmine'), + require('karma-chrome-launcher'), + require('karma-jasmine-html-reporter'), + require('karma-coverage-istanbul-reporter'), + require('@angular/cli/plugins/karma') + ], + client:{ + clearContext: false // leave Jasmine Spec Runner output visible in browser + }, + coverageIstanbulReporter: { + reports: [ 'html', 'lcovonly' ], + fixWebpackSourcePaths: true + }, + angularCli: { + environment: 'dev' + }, + reporters: ['progress', 'kjhtml'], + port: 9876, + colors: true, + logLevel: config.LOG_INFO, + autoWatch: true, + browsers: ['Chrome'], + singleRun: false + }); +}; diff --git a/integration/hello_world__render3__cli/package.json b/integration/hello_world__render3__cli/package.json new file mode 100644 index 0000000000..8cc62a9150 --- /dev/null +++ b/integration/hello_world__render3__cli/package.json @@ -0,0 +1,33 @@ +{ + "name": "hello_world__render3__cli", + "version": "0.0.0", + "license": "MIT", + "scripts": { + "ng": "ng", + "start": "ng serve", + "build": "ng build --prod --build-optimizer", + "test": "echo no tests", + "lint": "ng lint", + "e2e": "ng e2e" + }, + "private": true, + "dependencies": { + "@angular/animations": "file:../../dist/packages-dist/animations", + "@angular/common": "file:../../dist/packages-dist/common", + "@angular/compiler": "file:../../dist/packages-dist/compiler", + "@angular/core": "file:../../dist/packages-dist/core", + "@angular/forms": "file:../../dist/packages-dist/forms", + "@angular/http": "file:../../dist/packages-dist/http", + "@angular/platform-browser": "file:../../dist/packages-dist/platform-browser", + "@angular/platform-browser-dynamic": "file:../../dist/packages-dist/platform-browser-dynamic", + "@angular/router": "file:../../dist/packages-dist/router", + "core-js": "2.4.1", + "rxjs": "5.5.6", + "zone.js": "0.8.19" + }, + "devDependencies": { + "@angular/cli": "1.7.0-beta.2", + "@angular/compiler-cli": "file:../../dist/packages-dist/compiler-cli", + "typescript": "2.6.2" + } +} diff --git a/integration/hello_world__render3__cli/protractor.conf.js b/integration/hello_world__render3__cli/protractor.conf.js new file mode 100644 index 0000000000..7ee3b5ee86 --- /dev/null +++ b/integration/hello_world__render3__cli/protractor.conf.js @@ -0,0 +1,28 @@ +// Protractor configuration file, see link for more information +// https://github.com/angular/protractor/blob/master/lib/config.ts + +const { SpecReporter } = require('jasmine-spec-reporter'); + +exports.config = { + allScriptsTimeout: 11000, + specs: [ + './e2e/**/*.e2e-spec.ts' + ], + capabilities: { + 'browserName': 'chrome' + }, + directConnect: true, + baseUrl: 'http://localhost:4200/', + framework: 'jasmine', + jasmineNodeOpts: { + showColors: true, + defaultTimeoutInterval: 30000, + print: function() {} + }, + onPrepare() { + require('ts-node').register({ + project: 'e2e/tsconfig.e2e.json' + }); + jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); + } +}; diff --git a/integration/hello_world__render3__cli/src/app/app.component.css b/integration/hello_world__render3__cli/src/app/app.component.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/integration/hello_world__render3__cli/src/app/app.component.html b/integration/hello_world__render3__cli/src/app/app.component.html new file mode 100644 index 0000000000..fa2706a406 --- /dev/null +++ b/integration/hello_world__render3__cli/src/app/app.component.html @@ -0,0 +1,20 @@ + +
+

+ Welcome to {{ title }}! +

+ Angular Logo +
+

Here are some links to help you start:

+ + diff --git a/integration/hello_world__render3__cli/src/app/app.component.spec.ts b/integration/hello_world__render3__cli/src/app/app.component.spec.ts new file mode 100644 index 0000000000..bcbdf36b3e --- /dev/null +++ b/integration/hello_world__render3__cli/src/app/app.component.spec.ts @@ -0,0 +1,27 @@ +import { TestBed, async } from '@angular/core/testing'; +import { AppComponent } from './app.component'; +describe('AppComponent', () => { + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ + AppComponent + ], + }).compileComponents(); + })); + it('should create the app', async(() => { + const fixture = TestBed.createComponent(AppComponent); + const app = fixture.debugElement.componentInstance; + expect(app).toBeTruthy(); + })); + it(`should have as title 'app'`, async(() => { + const fixture = TestBed.createComponent(AppComponent); + const app = fixture.debugElement.componentInstance; + expect(app.title).toEqual('app'); + })); + it('should render title in a h1 tag', async(() => { + const fixture = TestBed.createComponent(AppComponent); + fixture.detectChanges(); + const compiled = fixture.debugElement.nativeElement; + expect(compiled.querySelector('h1').textContent).toContain('Welcome to app!'); + })); +}); diff --git a/integration/hello_world__render3__cli/src/app/app.component.ts b/integration/hello_world__render3__cli/src/app/app.component.ts new file mode 100644 index 0000000000..7b0f672831 --- /dev/null +++ b/integration/hello_world__render3__cli/src/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-root', + templateUrl: './app.component.html', + styleUrls: ['./app.component.css'] +}) +export class AppComponent { + title = 'app'; +} diff --git a/integration/hello_world__render3__cli/src/app/app.module.ts b/integration/hello_world__render3__cli/src/app/app.module.ts new file mode 100644 index 0000000000..5d4267b601 --- /dev/null +++ b/integration/hello_world__render3__cli/src/app/app.module.ts @@ -0,0 +1,15 @@ +import { NgModule } from '@angular/core'; + + +import { AppComponent } from './app.component'; + + +@NgModule({ + declarations: [ + AppComponent + ], + imports: [], + providers: [], + bootstrap: [AppComponent] +}) +export class AppModule { } diff --git a/integration/hello_world__render3__cli/src/assets/.gitkeep b/integration/hello_world__render3__cli/src/assets/.gitkeep new file mode 100644 index 0000000000..e69de29bb2 diff --git a/integration/hello_world__render3__cli/src/environments/environment.prod.ts b/integration/hello_world__render3__cli/src/environments/environment.prod.ts new file mode 100644 index 0000000000..3612073bc3 --- /dev/null +++ b/integration/hello_world__render3__cli/src/environments/environment.prod.ts @@ -0,0 +1,3 @@ +export const environment = { + production: true +}; diff --git a/integration/hello_world__render3__cli/src/environments/environment.ts b/integration/hello_world__render3__cli/src/environments/environment.ts new file mode 100644 index 0000000000..b7f639aeca --- /dev/null +++ b/integration/hello_world__render3__cli/src/environments/environment.ts @@ -0,0 +1,8 @@ +// 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: false +}; diff --git a/integration/hello_world__render3__cli/src/favicon.ico b/integration/hello_world__render3__cli/src/favicon.ico new file mode 100644 index 0000000000..8081c7ceaf Binary files /dev/null and b/integration/hello_world__render3__cli/src/favicon.ico differ diff --git a/integration/hello_world__render3__cli/src/index.html b/integration/hello_world__render3__cli/src/index.html new file mode 100644 index 0000000000..663629821a --- /dev/null +++ b/integration/hello_world__render3__cli/src/index.html @@ -0,0 +1,14 @@ + + + + + Hw2 + + + + + + + + + diff --git a/integration/hello_world__render3__cli/src/main.ts b/integration/hello_world__render3__cli/src/main.ts new file mode 100644 index 0000000000..2ad94f459d --- /dev/null +++ b/integration/hello_world__render3__cli/src/main.ts @@ -0,0 +1,4 @@ +import {ɵrenderComponent as renderComponent} from '@angular/core'; +import {AppComponent} from './app/app.component'; + +renderComponent(AppComponent as any); diff --git a/integration/hello_world__render3__cli/src/polyfills.ts b/integration/hello_world__render3__cli/src/polyfills.ts new file mode 100644 index 0000000000..d68672ffe4 --- /dev/null +++ b/integration/hello_world__render3__cli/src/polyfills.ts @@ -0,0 +1,66 @@ +/** + * This file includes polyfills needed by Angular and is loaded before the app. + * You can add your own extra polyfills to this file. + * + * This file is divided into 2 sections: + * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. + * 2. Application imports. Files imported after ZoneJS that should be loaded before your main + * file. + * + * The current setup is for so-called "evergreen" browsers; the last versions of browsers that + * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), + * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. + * + * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html + */ + +/*************************************************************************************************** + * BROWSER POLYFILLS + */ + +/** IE9, IE10 and IE11 requires all of the following polyfills. **/ +// import 'core-js/es6/symbol'; +// import 'core-js/es6/object'; +// import 'core-js/es6/function'; +// import 'core-js/es6/parse-int'; +// import 'core-js/es6/parse-float'; +// import 'core-js/es6/number'; +// import 'core-js/es6/math'; +// import 'core-js/es6/string'; +// import 'core-js/es6/date'; +// import 'core-js/es6/array'; +// import 'core-js/es6/regexp'; +// import 'core-js/es6/map'; +// import 'core-js/es6/weak-map'; +// import 'core-js/es6/set'; + +/** IE10 and IE11 requires the following for NgClass support on SVG elements */ +// import 'classlist.js'; // Run `npm install --save classlist.js`. + +/** IE10 and IE11 requires the following for the Reflect API. */ +// import 'core-js/es6/reflect'; + + +/** 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'; + + +/** + * Required to support Web Animations `@angular/platform-browser/animations`. + * Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation + **/ +// import 'web-animations-js'; // Run `npm install --save web-animations-js`. + + + +/*************************************************************************************************** + * Zone JS is required by default for Angular itself. + */ +import 'zone.js/dist/zone'; // Included with Angular CLI. + + + +/*************************************************************************************************** + * APPLICATION IMPORTS + */ diff --git a/integration/hello_world__render3__cli/src/styles.css b/integration/hello_world__render3__cli/src/styles.css new file mode 100644 index 0000000000..90d4ee0072 --- /dev/null +++ b/integration/hello_world__render3__cli/src/styles.css @@ -0,0 +1 @@ +/* You can add global styles to this file, and also import other style files */ diff --git a/integration/hello_world__render3__cli/src/test.ts b/integration/hello_world__render3__cli/src/test.ts new file mode 100644 index 0000000000..16317897b1 --- /dev/null +++ b/integration/hello_world__render3__cli/src/test.ts @@ -0,0 +1,20 @@ +// This file is required by karma.conf.js and loads recursively all the .spec and framework files + +import 'zone.js/dist/zone-testing'; +import { getTestBed } from '@angular/core/testing'; +import { + BrowserDynamicTestingModule, + platformBrowserDynamicTesting +} from '@angular/platform-browser-dynamic/testing'; + +declare const require: any; + +// First, initialize the Angular testing environment. +getTestBed().initTestEnvironment( + BrowserDynamicTestingModule, + platformBrowserDynamicTesting() +); +// Then we find all the tests. +const context = require.context('./', true, /\.spec\.ts$/); +// And load the modules. +context.keys().map(context); diff --git a/integration/hello_world__render3__cli/src/tsconfig.app.json b/integration/hello_world__render3__cli/src/tsconfig.app.json new file mode 100644 index 0000000000..f1aabb3617 --- /dev/null +++ b/integration/hello_world__render3__cli/src/tsconfig.app.json @@ -0,0 +1,16 @@ +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "outDir": "../out-tsc/app", + "baseUrl": "./", + "module": "es2015", + "types": [] + }, + "exclude": [ + "test.ts", + "**/*.spec.ts" + ], + "angularCompilerOptions": { + "enableIvy": true + } +} diff --git a/integration/hello_world__render3__cli/src/tsconfig.spec.json b/integration/hello_world__render3__cli/src/tsconfig.spec.json new file mode 100644 index 0000000000..ac22a298ac --- /dev/null +++ b/integration/hello_world__render3__cli/src/tsconfig.spec.json @@ -0,0 +1,19 @@ +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "outDir": "../out-tsc/spec", + "baseUrl": "./", + "module": "commonjs", + "types": [ + "jasmine", + "node" + ] + }, + "files": [ + "test.ts" + ], + "include": [ + "**/*.spec.ts", + "**/*.d.ts" + ] +} diff --git a/integration/hello_world__render3__cli/tsconfig.json b/integration/hello_world__render3__cli/tsconfig.json new file mode 100644 index 0000000000..a6c016bf38 --- /dev/null +++ b/integration/hello_world__render3__cli/tsconfig.json @@ -0,0 +1,19 @@ +{ + "compileOnSave": false, + "compilerOptions": { + "outDir": "./dist/out-tsc", + "sourceMap": true, + "declaration": false, + "moduleResolution": "node", + "emitDecoratorMetadata": true, + "experimentalDecorators": true, + "target": "es5", + "typeRoots": [ + "node_modules/@types" + ], + "lib": [ + "es2017", + "dom" + ] + } +} diff --git a/integration/hello_world__render3__cli/tslint.json b/integration/hello_world__render3__cli/tslint.json new file mode 100644 index 0000000000..9963d6c395 --- /dev/null +++ b/integration/hello_world__render3__cli/tslint.json @@ -0,0 +1,143 @@ +{ + "rulesDirectory": [ + "node_modules/codelyzer" + ], + "rules": { + "arrow-return-shorthand": true, + "callable-types": true, + "class-name": true, + "comment-format": [ + true, + "check-space" + ], + "curly": true, + "deprecation": { + "severity": "warn" + }, + "eofline": true, + "forin": true, + "import-blacklist": [ + true, + "rxjs", + "rxjs/Rx" + ], + "import-spacing": true, + "indent": [ + true, + "spaces" + ], + "interface-over-type-literal": true, + "label-position": true, + "max-line-length": [ + true, + 140 + ], + "member-access": false, + "member-ordering": [ + true, + { + "order": [ + "static-field", + "instance-field", + "static-method", + "instance-method" + ] + } + ], + "no-arg": true, + "no-bitwise": true, + "no-console": [ + true, + "debug", + "info", + "time", + "timeEnd", + "trace" + ], + "no-construct": true, + "no-debugger": true, + "no-duplicate-super": true, + "no-empty": false, + "no-empty-interface": true, + "no-eval": true, + "no-inferrable-types": [ + true, + "ignore-params" + ], + "no-misused-new": true, + "no-non-null-assertion": true, + "no-shadowed-variable": true, + "no-string-literal": false, + "no-string-throw": true, + "no-switch-case-fall-through": true, + "no-trailing-whitespace": true, + "no-unnecessary-initializer": true, + "no-unused-expression": true, + "no-use-before-declare": true, + "no-var-keyword": true, + "object-literal-sort-keys": false, + "one-line": [ + true, + "check-open-brace", + "check-catch", + "check-else", + "check-whitespace" + ], + "prefer-const": true, + "quotemark": [ + true, + "single" + ], + "radix": true, + "semicolon": [ + true, + "always" + ], + "triple-equals": [ + true, + "allow-null-check" + ], + "typedef-whitespace": [ + true, + { + "call-signature": "nospace", + "index-signature": "nospace", + "parameter": "nospace", + "property-declaration": "nospace", + "variable-declaration": "nospace" + } + ], + "unified-signatures": true, + "variable-name": false, + "whitespace": [ + true, + "check-branch", + "check-decl", + "check-operator", + "check-separator", + "check-type" + ], + "directive-selector": [ + true, + "attribute", + "app", + "camelCase" + ], + "component-selector": [ + true, + "element", + "app", + "kebab-case" + ], + "no-output-on-prefix": true, + "use-input-property-decorator": true, + "use-output-property-decorator": true, + "use-host-property-decorator": true, + "no-input-rename": true, + "no-output-rename": true, + "use-life-cycle-interface": true, + "use-pipe-transform-interface": true, + "component-class-suffix": true, + "directive-class-suffix": true + } +} diff --git a/integration/run_tests.sh b/integration/run_tests.sh index d81400930d..2d2ec6484e 100755 --- a/integration/run_tests.sh +++ b/integration/run_tests.sh @@ -29,15 +29,19 @@ for testDir in $(ls | grep -v node_modules) ; do rm -rf dist yarn install --cache-folder ../$cache yarn test || exit 1 - # Track payload size for cli-hello-world and hello_world__closure - if [[ $testDir == cli-hello-world ]] || [[ $testDir == hello_world__closure ]] || [[ $testDir == hello_world__render3__closure ]] || [[ $testDir == hello_world__render3__rollup ]]; then - if [[ $testDir == cli-hello-world ]]; then + # Track payload size for cli-hello-world and hello_world__closure and the render3 tests + if [[ $testDir == cli-hello-world ]] || [[ $testDir == hello_world__closure ]] || [[ $testDir == hello_world__render3__closure ]] || [[ $testDir == hello_world__render3__rollup ]] || [[ $testDir == hello_world__render3__cli ]]; then + if [[ $testDir == cli-hello-world ]] || [[ $testDir == hello_world__render3__cli ]]; then yarn build fi if [[ -v TRAVIS ]]; then trackPayloadSize "$testDir" "dist/*.js" true false "${thisDir}/_payload-limits.json" fi fi + if [[ -v TRAVIS ]]; then + # remove the temporary node modules directory to save space. + rm -rf node_modules + fi ) done