From 47cde5b7782651d59c4bade816ae05a0e2dc0738 Mon Sep 17 00:00:00 2001 From: Aivan Monceller Date: Sat, 21 Jul 2018 08:20:05 +0800 Subject: [PATCH 1/8] #1 modify webpack config to include angular-template-loader --- cypress/plugins/cy-ts-preprocessor.js | 15 ++++++++++----- package.json | 2 ++ 2 files changed, 12 insertions(+), 5 deletions(-) diff --git a/cypress/plugins/cy-ts-preprocessor.js b/cypress/plugins/cy-ts-preprocessor.js index 7f0bba98..da07a051 100644 --- a/cypress/plugins/cy-ts-preprocessor.js +++ b/cypress/plugins/cy-ts-preprocessor.js @@ -8,12 +8,17 @@ const webpackOptions = { rules: [ { test: /\.ts$/, + loaders: ['ts-loader', 'angular2-template-loader'], exclude: [/node_modules/], - use: [ - { - loader: 'ts-loader' - } - ] + }, + { + test: /\.(html|css)$/, + loader: 'raw-loader', + exclude: /\.async\.(html|css)$/ + }, + { + test: /\.async\.(html|css)$/, + loaders: ['file?name=[name].[hash].[ext]', 'extract'] } ] } diff --git a/package.json b/package.json index acc248a4..71b6b230 100644 --- a/package.json +++ b/package.json @@ -33,6 +33,7 @@ "@types/jasmine": "~2.8.3", "@types/jasminewd2": "~2.0.2", "@types/node": "~6.0.60", + "angular2-template-loader": "^0.6.2", "codelyzer": "^4.0.1", "cypress": "^1.4.1", "jasmine-core": "~2.8.0", @@ -44,6 +45,7 @@ "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~5.1.2", + "raw-loader": "^0.5.1", "ts-node": "~4.1.0", "tslint": "~5.9.1", "typescript": "~2.5.3" From 0b9f8338427da05539ef174e54963d6f799982d5 Mon Sep 17 00:00:00 2001 From: Gleb Bahmutov Date: Mon, 23 Jul 2018 14:56:09 +0200 Subject: [PATCH 2/8] bump cypress to 3.0.2 --- package.json | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index acc248a4..3a299ddb 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,9 @@ "build": "ng build --prod", "test": "ng test", "lint": "ng lint", - "e2e": "ng e2e" + "e2e": "ng e2e", + "cy:open": "cypress open", + "cy:run": "cypress run" }, "private": true, "dependencies": { @@ -34,7 +36,7 @@ "@types/jasminewd2": "~2.0.2", "@types/node": "~6.0.60", "codelyzer": "^4.0.1", - "cypress": "^1.4.1", + "cypress": "3.0.2", "jasmine-core": "~2.8.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~2.0.0", From 2063622a682a8457a1614d942edd4bb323ef7a73 Mon Sep 17 00:00:00 2001 From: Gleb Bahmutov Date: Mon, 23 Jul 2018 15:07:16 +0200 Subject: [PATCH 3/8] add Travis CI and semantic release --- .gitignore | 1 + .travis.yml | 16 ++++++++++++++++ package.json | 14 +++++++++++--- 3 files changed, 28 insertions(+), 3 deletions(-) create mode 100644 .travis.yml diff --git a/.gitignore b/.gitignore index 4ae2c379..00c0d198 100644 --- a/.gitignore +++ b/.gitignore @@ -41,3 +41,4 @@ testem.log # System Files .DS_Store Thumbs.db +cypress/videos diff --git a/.travis.yml b/.travis.yml new file mode 100644 index 00000000..d03ece65 --- /dev/null +++ b/.travis.yml @@ -0,0 +1,16 @@ +language: node_js +cache: + directories: + - ~/.npm + - ~/.cache +notifications: + email: true +node_js: + - '10' +script: + - npm run cy:run +after_success: + - npm run travis-deploy-once "npm run semantic-release" +branches: + except: + - /^v\d+\.\d+\.\d+$/ diff --git a/package.json b/package.json index 3a299ddb..8b616fc2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ng-mount", - "version": "0.0.0", + "version": "0.0.0-development", "license": "MIT", "scripts": { "ng": "ng", @@ -10,7 +10,9 @@ "lint": "ng lint", "e2e": "ng e2e", "cy:open": "cypress open", - "cy:run": "cypress run" + "cy:run": "cypress run", + "travis-deploy-once": "travis-deploy-once", + "semantic-release": "semantic-release" }, "private": true, "dependencies": { @@ -48,6 +50,12 @@ "protractor": "~5.1.2", "ts-node": "~4.1.0", "tslint": "~5.9.1", - "typescript": "~2.5.3" + "typescript": "~2.5.3", + "travis-deploy-once": "^5.0.1", + "semantic-release": "^15.8.1" + }, + "repository": { + "type": "git", + "url": "https://github.com/bahmutov/cypress-angular-unit-test.git" } } From 2644e3183f384fc9b23fd01a3f5f514d78ff7b59 Mon Sep 17 00:00:00 2001 From: Gleb Bahmutov Date: Mon, 23 Jul 2018 15:07:59 +0200 Subject: [PATCH 4/8] set package name cypress-angular-unit-test --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 8b616fc2..f50adbd2 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "ng-mount", + "name": "cypress-angular-unit-test", "version": "0.0.0-development", "license": "MIT", "scripts": { From c48936fffd480f94b45745a33f6e71f56791ac9a Mon Sep 17 00:00:00 2001 From: Gleb Bahmutov Date: Mon, 23 Jul 2018 15:12:19 +0200 Subject: [PATCH 5/8] add failing test --- cypress/integration/spec.ts | 32 +++++++++++++++++--------------- package.json | 12 ++++++++++++ 2 files changed, 29 insertions(+), 15 deletions(-) diff --git a/cypress/integration/spec.ts b/cypress/integration/spec.ts index 176ae76e..1c5e08e1 100644 --- a/cypress/integration/spec.ts +++ b/cypress/integration/spec.ts @@ -1,8 +1,8 @@ -import { AppComponent } from '../../src/app/app.component' -import 'zone.js'; +import { ApplicationRef, NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; -import { Component, NgModule, ViewContainerRef, ApplicationRef } from '@angular/core'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; +import 'zone.js'; +import { AppComponent } from '../../src/app/app.component'; // dynamic loading based on blog post // https://blog.angularindepth.com/how-to-manually-bootstrap-an-angular-application-9a36ccf86429 @@ -18,9 +18,9 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; entryComponents: [AppComponent] }) class AppModule { - app: ApplicationRef + app: ApplicationRef; ngDoBootstrap(app: ApplicationRef) { - this.app = app + this.app = app; } } @@ -35,19 +35,21 @@ describe('AppComponent', () => { - ` - const document = (cy as any).state('document') - document.write(html) - document.close() + `; + const document = (cy as any).state('document'); + document.write(html); + document.close(); cy.get('app-root').then(el$ => { platformBrowserDynamic() .bootstrapModule(AppModule) .then(function (moduleRef) { - moduleRef.instance.app.bootstrap(AppComponent, el$.get(0)) - }) - }) - }) + moduleRef.instance.app.bootstrap(AppComponent, el$.get(0)); + }); + }); + }); - it('works', () => {}) -}) + it('works', () => { + cy.contains('Welcome to app').should('be.visible'); + }); +}); diff --git a/package.json b/package.json index f50adbd2..94a1aab3 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ "semantic-release": "semantic-release" }, "private": true, + "homepage": "https://github.com/bahmutov/cypress-angular-unit-test#readme", "dependencies": { "@angular/animations": "^5.2.0", "@angular/common": "^5.2.0", @@ -57,5 +58,16 @@ "repository": { "type": "git", "url": "https://github.com/bahmutov/cypress-angular-unit-test.git" + }, + "release": { + "analyzeCommits": { + "preset": "angular", + "releaseRules": [ + { + "type": "break", + "release": "major" + } + ] + } } } From cfd12a4ce90b163b26132a3775750165de51bdec Mon Sep 17 00:00:00 2001 From: Gleb Bahmutov Date: Mon, 23 Jul 2018 15:14:26 +0200 Subject: [PATCH 6/8] add Travis badge --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index b779794a..0a14fed1 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -## NOT WORKING YET +## NOT WORKING YET [![Build Status](https://travis-ci.org/bahmutov/cypress-angular-unit-test.svg?branch=master)](https://travis-ci.org/bahmutov/cypress-angular-unit-test) If you run `$(npm bin)/cypress open` and click on "spec.ts" it does not show any errors, meaning a component has been bootstrapped. Not the HTML looks very weird and nothing is running. I assume the Angular code is running in the spec iframe and cannot cross into the app iframe where the component has been mounted. From 0f50fe579dea388e397ad0f3962e250623a09c11 Mon Sep 17 00:00:00 2001 From: Gleb Bahmutov Date: Mon, 23 Jul 2018 15:14:43 +0200 Subject: [PATCH 7/8] disable release for now --- .travis.yml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.travis.yml b/.travis.yml index d03ece65..6c757f57 100644 --- a/.travis.yml +++ b/.travis.yml @@ -9,8 +9,8 @@ node_js: - '10' script: - npm run cy:run -after_success: - - npm run travis-deploy-once "npm run semantic-release" +# after_success: +# - npm run travis-deploy-once "npm run semantic-release" branches: except: - /^v\d+\.\d+\.\d+$/ From f9ab9295576ac586431442c51689e2aaf95cea05 Mon Sep 17 00:00:00 2001 From: Gleb Bahmutov Date: Mon, 6 Aug 2018 10:18:24 -0400 Subject: [PATCH 8/8] chore: have at least 2 tests --- cypress/integration/spec.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/cypress/integration/spec.ts b/cypress/integration/spec.ts index 1c5e08e1..7bb991eb 100644 --- a/cypress/integration/spec.ts +++ b/cypress/integration/spec.ts @@ -1,3 +1,5 @@ +/// + import { ApplicationRef, NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; @@ -52,4 +54,8 @@ describe('AppComponent', () => { it('works', () => { cy.contains('Welcome to app').should('be.visible'); }); + + it('works again', () => { + cy.contains('Welcome to app').should('be.visible'); + }); });