diff --git a/angular.json b/angular.json index 4b4e0ec..7fb9ad3 100644 --- a/angular.json +++ b/angular.json @@ -139,6 +139,120 @@ } } } + }, + "global-form": { + "projectType": "application", + "schematics": {}, + "root": "apps/global-form", + "sourceRoot": "apps/global-form/src", + "prefix": "nested-forms", + "architect": { + "build": { + "builder": "@angular-devkit/build-angular:browser", + "options": { + "outputPath": "dist/apps/global-form", + "index": "apps/global-form/src/index.html", + "main": "apps/global-form/src/main.ts", + "polyfills": "apps/global-form/src/polyfills.ts", + "tsConfig": "apps/global-form/tsconfig.app.json", + "aot": false, + "assets": [ + "apps/global-form/src/favicon.ico", + "apps/global-form/src/assets" + ], + "styles": ["apps/global-form/src/styles.css"], + "scripts": [] + }, + "configurations": { + "production": { + "fileReplacements": [ + { + "replace": "apps/global-form/src/environments/environment.ts", + "with": "apps/global-form/src/environments/environment.prod.ts" + } + ], + "optimization": true, + "outputHashing": "all", + "sourceMap": false, + "extractCss": true, + "namedChunks": false, + "aot": true, + "extractLicenses": true, + "vendorChunk": false, + "buildOptimizer": true, + "budgets": [ + { + "type": "initial", + "maximumWarning": "2mb", + "maximumError": "5mb" + } + ] + } + } + }, + "serve": { + "builder": "@angular-devkit/build-angular:dev-server", + "options": { + "browserTarget": "global-form:build" + }, + "configurations": { + "production": { + "browserTarget": "global-form:build:production" + } + } + }, + "extract-i18n": { + "builder": "@angular-devkit/build-angular:extract-i18n", + "options": { + "browserTarget": "global-form:build" + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": [ + "apps/global-form/tsconfig.app.json", + "apps/global-form/tsconfig.spec.json" + ], + "exclude": ["**/node_modules/**", "!apps/global-form/**"] + } + }, + "test": { + "builder": "@nrwl/jest:jest", + "options": { + "jestConfig": "apps/global-form/jest.config.js", + "tsConfig": "apps/global-form/tsconfig.spec.json", + "setupFile": "apps/global-form/src/test-setup.ts" + } + } + } + }, + "global-form-e2e": { + "root": "apps/global-form-e2e", + "sourceRoot": "apps/global-form-e2e/src", + "projectType": "application", + "architect": { + "e2e": { + "builder": "@nrwl/cypress:cypress", + "options": { + "cypressConfig": "apps/global-form-e2e/cypress.json", + "tsConfig": "apps/global-form-e2e/tsconfig.e2e.json", + "devServerTarget": "global-form:serve" + }, + "configurations": { + "production": { + "devServerTarget": "global-form:serve:production" + } + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": ["apps/global-form-e2e/tsconfig.e2e.json"], + "exclude": ["**/node_modules/**", "!apps/global-form-e2e/**"] + } + } + } } }, "cli": { diff --git a/apps/global-form-e2e/cypress.json b/apps/global-form-e2e/cypress.json new file mode 100644 index 0000000..a8d8695 --- /dev/null +++ b/apps/global-form-e2e/cypress.json @@ -0,0 +1,11 @@ +{ + "fileServerFolder": ".", + "fixturesFolder": "./src/fixtures", + "integrationFolder": "./src/integration", + "pluginsFile": "./src/plugins/index", + "supportFile": false, + "video": true, + "videosFolder": "../../dist/cypress/apps/global-form-e2e/videos", + "screenshotsFolder": "../../dist/cypress/apps/global-form-e2e/screenshots", + "chromeWebSecurity": false +} diff --git a/apps/global-form-e2e/src/fixtures/example.json b/apps/global-form-e2e/src/fixtures/example.json new file mode 100644 index 0000000..294cbed --- /dev/null +++ b/apps/global-form-e2e/src/fixtures/example.json @@ -0,0 +1,4 @@ +{ + "name": "Using fixtures to represent data", + "email": "hello@cypress.io" +} diff --git a/apps/global-form-e2e/src/integration/app.spec.ts b/apps/global-form-e2e/src/integration/app.spec.ts new file mode 100644 index 0000000..130e297 --- /dev/null +++ b/apps/global-form-e2e/src/integration/app.spec.ts @@ -0,0 +1,9 @@ +import { getGreeting } from '../support/app.po'; + +describe('global-form', () => { + beforeEach(() => cy.visit('/')); + + it('should display welcome message', () => { + getGreeting().contains('Welcome to global-form!'); + }); +}); diff --git a/apps/global-form-e2e/src/plugins/index.js b/apps/global-form-e2e/src/plugins/index.js new file mode 100644 index 0000000..bc34d63 --- /dev/null +++ b/apps/global-form-e2e/src/plugins/index.js @@ -0,0 +1,22 @@ +// *********************************************************** +// This example plugins/index.js can be used to load plugins +// +// You can change the location of this file or turn off loading +// the plugins file with the 'pluginsFile' configuration option. +// +// You can read more here: +// https://on.cypress.io/plugins-guide +// *********************************************************** + +// This function is called when a project is opened or re-opened (e.g. due to +// the project's config changing) + +const { preprocessTypescript } = require('@nrwl/cypress/plugins/preprocessor'); + +module.exports = (on, config) => { + // `on` is used to hook into various events Cypress emits + // `config` is the resolved Cypress config + + // Preprocess Typescript + on('file:preprocessor', preprocessTypescript(config)); +}; diff --git a/apps/global-form-e2e/src/support/app.po.ts b/apps/global-form-e2e/src/support/app.po.ts new file mode 100644 index 0000000..3293424 --- /dev/null +++ b/apps/global-form-e2e/src/support/app.po.ts @@ -0,0 +1 @@ +export const getGreeting = () => cy.get('h1'); diff --git a/apps/global-form-e2e/src/support/commands.ts b/apps/global-form-e2e/src/support/commands.ts new file mode 100644 index 0000000..ca4d256 --- /dev/null +++ b/apps/global-form-e2e/src/support/commands.ts @@ -0,0 +1,25 @@ +// *********************************************** +// This example commands.js shows you how to +// create various custom commands and overwrite +// existing commands. +// +// For more comprehensive examples of custom +// commands please read more here: +// https://on.cypress.io/custom-commands +// *********************************************** +// +// +// -- This is a parent command -- +// Cypress.Commands.add("login", (email, password) => { ... }) +// +// +// -- This is a child command -- +// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... }) +// +// +// -- This is a dual command -- +// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... }) +// +// +// -- This will overwrite an existing command -- +// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... }) diff --git a/apps/global-form-e2e/src/support/index.ts b/apps/global-form-e2e/src/support/index.ts new file mode 100644 index 0000000..3d469a6 --- /dev/null +++ b/apps/global-form-e2e/src/support/index.ts @@ -0,0 +1,17 @@ +// *********************************************************** +// This example support/index.js is processed and +// loaded automatically before your test files. +// +// This is a great place to put global configuration and +// behavior that modifies Cypress. +// +// You can change the location of this file or turn off +// automatically serving support files with the +// 'supportFile' configuration option. +// +// You can read more here: +// https://on.cypress.io/configuration +// *********************************************************** + +// Import commands.js using ES2015 syntax: +import './commands'; diff --git a/apps/global-form-e2e/tsconfig.e2e.json b/apps/global-form-e2e/tsconfig.e2e.json new file mode 100644 index 0000000..629b4c1 --- /dev/null +++ b/apps/global-form-e2e/tsconfig.e2e.json @@ -0,0 +1,8 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "sourceMap": false, + "outDir": "../../dist/out-tsc" + }, + "include": ["src/**/*.ts"] +} diff --git a/apps/global-form-e2e/tsconfig.json b/apps/global-form-e2e/tsconfig.json new file mode 100644 index 0000000..ee6531b --- /dev/null +++ b/apps/global-form-e2e/tsconfig.json @@ -0,0 +1,7 @@ +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "types": ["cypress", "node"] + }, + "include": ["**/*.ts"] +} diff --git a/apps/global-form-e2e/tslint.json b/apps/global-form-e2e/tslint.json new file mode 100644 index 0000000..04809f8 --- /dev/null +++ b/apps/global-form-e2e/tslint.json @@ -0,0 +1 @@ +{ "extends": "../../tslint.json", "rules": [] } diff --git a/apps/global-form/browserslist b/apps/global-form/browserslist new file mode 100644 index 0000000..8084853 --- /dev/null +++ b/apps/global-form/browserslist @@ -0,0 +1,12 @@ +# 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 + +# You can see what browsers were selected by your queries by running: +# npx browserslist + +> 0.5% +last 2 versions +Firefox ESR +not dead +not IE 9-11 # For IE 9-11 support, remove 'not'. \ No newline at end of file diff --git a/apps/global-form/jest.config.js b/apps/global-form/jest.config.js new file mode 100644 index 0000000..1522103 --- /dev/null +++ b/apps/global-form/jest.config.js @@ -0,0 +1,9 @@ +module.exports = { + name: 'global-form', + preset: '../../jest.config.js', + coverageDirectory: '../../coverage/apps/global-form', + snapshotSerializers: [ + 'jest-preset-angular/AngularSnapshotSerializer.js', + 'jest-preset-angular/HTMLCommentSerializer.js' + ] +}; diff --git a/apps/global-form/src/app/app.component.css b/apps/global-form/src/app/app.component.css new file mode 100644 index 0000000..e69de29 diff --git a/apps/global-form/src/app/app.component.html b/apps/global-form/src/app/app.component.html new file mode 100644 index 0000000..803c853 --- /dev/null +++ b/apps/global-form/src/app/app.component.html @@ -0,0 +1,27 @@ +
+

Welcome to {{ title }}!

+ +
+ +

+ This is an Angular app built with Nx. +

+

🔎 **Nx is a set of Extensible Dev Tools for Monorepos.**

+ +

Quick Start & Documentation

+ + diff --git a/apps/global-form/src/app/app.component.spec.ts b/apps/global-form/src/app/app.component.spec.ts new file mode 100644 index 0000000..1d28edf --- /dev/null +++ b/apps/global-form/src/app/app.component.spec.ts @@ -0,0 +1,31 @@ +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', () => { + const fixture = TestBed.createComponent(AppComponent); + const app = fixture.debugElement.componentInstance; + expect(app).toBeTruthy(); + }); + + it(`should have as title 'global-form'`, () => { + const fixture = TestBed.createComponent(AppComponent); + const app = fixture.debugElement.componentInstance; + expect(app.title).toEqual('global-form'); + }); + + it('should render title in a h1 tag', () => { + const fixture = TestBed.createComponent(AppComponent); + fixture.detectChanges(); + const compiled = fixture.debugElement.nativeElement; + expect(compiled.querySelector('h1').textContent).toContain( + 'Welcome to global-form!' + ); + }); +}); diff --git a/apps/global-form/src/app/app.component.ts b/apps/global-form/src/app/app.component.ts new file mode 100644 index 0000000..5363a14 --- /dev/null +++ b/apps/global-form/src/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'nested-forms-root', + templateUrl: './app.component.html', + styleUrls: ['./app.component.css'] +}) +export class AppComponent { + title = 'global-form'; +} diff --git a/apps/global-form/src/app/app.module.ts b/apps/global-form/src/app/app.module.ts new file mode 100644 index 0000000..784cbd0 --- /dev/null +++ b/apps/global-form/src/app/app.module.ts @@ -0,0 +1,12 @@ +import { BrowserModule } from '@angular/platform-browser'; +import { NgModule } from '@angular/core'; + +import { AppComponent } from './app.component'; + +@NgModule({ + declarations: [AppComponent], + imports: [BrowserModule], + providers: [], + bootstrap: [AppComponent] +}) +export class AppModule {} diff --git a/apps/global-form/src/assets/.gitkeep b/apps/global-form/src/assets/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/apps/global-form/src/environments/environment.prod.ts b/apps/global-form/src/environments/environment.prod.ts new file mode 100644 index 0000000..3612073 --- /dev/null +++ b/apps/global-form/src/environments/environment.prod.ts @@ -0,0 +1,3 @@ +export const environment = { + production: true +}; diff --git a/apps/global-form/src/environments/environment.ts b/apps/global-form/src/environments/environment.ts new file mode 100644 index 0000000..7b4f817 --- /dev/null +++ b/apps/global-form/src/environments/environment.ts @@ -0,0 +1,16 @@ +// This file can be replaced during build by using the `fileReplacements` array. +// `ng build --prod` replaces `environment.ts` with `environment.prod.ts`. +// The list of file replacements can be found in `angular.json`. + +export const environment = { + production: false +}; + +/* + * For easier debugging in development mode, you can import the following file + * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. + * + * This import should be commented out in production mode because it will have a negative impact + * on performance if an error is thrown. + */ +// import 'zone.js/dist/zone-error'; // Included with Angular CLI. diff --git a/apps/global-form/src/favicon.ico b/apps/global-form/src/favicon.ico new file mode 100644 index 0000000..8081c7c Binary files /dev/null and b/apps/global-form/src/favicon.ico differ diff --git a/apps/global-form/src/index.html b/apps/global-form/src/index.html new file mode 100644 index 0000000..6d86d80 --- /dev/null +++ b/apps/global-form/src/index.html @@ -0,0 +1,14 @@ + + + + + GlobalForm + + + + + + + + + diff --git a/apps/global-form/src/main.ts b/apps/global-form/src/main.ts new file mode 100644 index 0000000..fa4e0ae --- /dev/null +++ b/apps/global-form/src/main.ts @@ -0,0 +1,13 @@ +import { enableProdMode } from '@angular/core'; +import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; + +import { AppModule } from './app/app.module'; +import { environment } from './environments/environment'; + +if (environment.production) { + enableProdMode(); +} + +platformBrowserDynamic() + .bootstrapModule(AppModule) + .catch(err => console.error(err)); diff --git a/apps/global-form/src/polyfills.ts b/apps/global-form/src/polyfills.ts new file mode 100644 index 0000000..2f258e5 --- /dev/null +++ b/apps/global-form/src/polyfills.ts @@ -0,0 +1,62 @@ +/** + * 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/guide/browser-support + */ + +/*************************************************************************************************** + * BROWSER POLYFILLS + */ + +/** IE10 and IE11 requires the following for NgClass support on SVG elements */ +// import 'classlist.js'; // Run `npm install --save classlist.js`. + +/** + * Web Animations `@angular/platform-browser/animations` + * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari. + * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0). + */ +// import 'web-animations-js'; // Run `npm install --save web-animations-js`. + +/** + * By default, zone.js will patch all possible macroTask and DomEvents + * user can disable parts of macroTask/DomEvents patch by setting following flags + * because those flags need to be set before `zone.js` being loaded, and webpack + * will put import in the top of bundle, so user need to create a separate file + * in this directory (for example: zone-flags.ts), and put the following flags + * into that file, and then add the following code before importing zone.js. + * import './zone-flags.ts'; + * + * The flags allowed in zone-flags.ts are listed here. + * + * The following flags will work for all browsers. + * + * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame + * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick + * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames + * + * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js + * with the following flag, it will bypass `zone.js` patch for IE/Edge + * + * (window as any).__Zone_enable_cross_context_check = true; + * + */ + +/*************************************************************************************************** + * Zone JS is required by default for Angular itself. + */ +import 'zone.js/dist/zone'; // Included with Angular CLI. + +/*************************************************************************************************** + * APPLICATION IMPORTS + */ diff --git a/apps/global-form/src/styles.css b/apps/global-form/src/styles.css new file mode 100644 index 0000000..90d4ee0 --- /dev/null +++ b/apps/global-form/src/styles.css @@ -0,0 +1 @@ +/* You can add global styles to this file, and also import other style files */ diff --git a/apps/global-form/src/test-setup.ts b/apps/global-form/src/test-setup.ts new file mode 100644 index 0000000..8d88704 --- /dev/null +++ b/apps/global-form/src/test-setup.ts @@ -0,0 +1 @@ +import 'jest-preset-angular'; diff --git a/apps/global-form/tsconfig.app.json b/apps/global-form/tsconfig.app.json new file mode 100644 index 0000000..827b630 --- /dev/null +++ b/apps/global-form/tsconfig.app.json @@ -0,0 +1,9 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "../../dist/out-tsc", + "types": [] + }, + "include": ["**/*.ts"], + "exclude": ["src/test-setup.ts", "**/*.spec.ts"] +} diff --git a/apps/global-form/tsconfig.json b/apps/global-form/tsconfig.json new file mode 100644 index 0000000..e5decd5 --- /dev/null +++ b/apps/global-form/tsconfig.json @@ -0,0 +1,7 @@ +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "types": ["node", "jest"] + }, + "include": ["**/*.ts"] +} diff --git a/apps/global-form/tsconfig.spec.json b/apps/global-form/tsconfig.spec.json new file mode 100644 index 0000000..cfff29a --- /dev/null +++ b/apps/global-form/tsconfig.spec.json @@ -0,0 +1,10 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "../../dist/out-tsc", + "module": "commonjs", + "types": ["jest", "node"] + }, + "files": ["src/test-setup.ts"], + "include": ["**/*.spec.ts", "**/*.d.ts"] +} diff --git a/apps/global-form/tslint.json b/apps/global-form/tslint.json new file mode 100644 index 0000000..b179968 --- /dev/null +++ b/apps/global-form/tslint.json @@ -0,0 +1,7 @@ +{ + "extends": "../../tslint.json", + "rules": { + "directive-selector": [true, "attribute", "nestedForms", "camelCase"], + "component-selector": [true, "element", "nested-forms", "kebab-case"] + } +} diff --git a/nx.json b/nx.json index 970e668..92e985e 100644 --- a/nx.json +++ b/nx.json @@ -16,6 +16,12 @@ }, "parent-form": { "tags": [] + }, + "global-form-e2e": { + "tags": [] + }, + "global-form": { + "tags": [] } } }