test(slow-information-renderer): add flakey e2e test

robt1019 · Apr 23, 2019 · 549b051 · 549b051
1 parent c6df727
commit 549b051
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 14 deletions.
diff --git a/angular.json b/angular.json
@@ -61,6 +61,10 @@
           "configurations": {
             "production": {
               "browserTarget": "slow-information-renderer:build:production"
+            },
+            "e2e": {
+              "browserTarget": "slow-information-renderer:build:production",
+              "port": 4201
             }
           }
         },
@@ -100,7 +104,7 @@
           "options": {
             "cypressConfig": "apps/slow-information-renderer-e2e/cypress.json",
             "tsConfig": "apps/slow-information-renderer-e2e/tsconfig.e2e.json",
-            "devServerTarget": "slow-information-renderer:serve"
+            "devServerTarget": "slow-information-renderer:serve:e2e"
           },
           "configurations": {
             "production": {

diff --git a/apps/slow-information-renderer-e2e/src/fixtures/example.json b/apps/slow-information-renderer-e2e/src/fixtures/example.json
diff --git a/apps/slow-information-renderer-e2e/src/integration/app.spec.ts b/apps/slow-information-renderer-e2e/src/integration/app.spec.ts
@@ -1,9 +1,8 @@
-import { getGreeting } from '../support/app.po';
-
-describe('Hello Nx', () => {
+describe('slow-information-renderer', () => {
   beforeEach(() => cy.visit('/'));
 
-  it('should display welcome message', () => {
-    getGreeting().contains('Welcome to slow-information-renderer!');
+  it('should display an interesting fact when the button is clicked', () => {
+    cy.get('#interestingFactButton').click();
+    cy.get('#interestingFact');
   });
 });
diff --git a/apps/slow-information-renderer/src/app/slow-information/slow-information.component.html b/apps/slow-information-renderer/src/app/slow-information/slow-information.component.html
@@ -1,8 +1,11 @@
 <h1>You want facts!?!</h1>
 <h2>Because we got em</h2>
 <h3>Seriously</h3>
-<button (click)="getSlowInformation()">Click le button</button>
+<button (click)="getSlowInformation()" id="interestingFactButton">
+  Click le button
+</button>
 <p
+  id="interestingFact"
   *ngIf="(slowInformation | async)"
   [ngClass]="{
     wow: (slowInformation | async)?.fact.interestLevel === 'interesting',

diff --git a/apps/slow-information-renderer/src/app/slow-information/slow-information.component.ts b/apps/slow-information-renderer/src/app/slow-information/slow-information.component.ts
@@ -1,7 +1,7 @@
-import { Component, OnInit } from '@angular/core';
-import { SlowInformationService } from '../slow-information.service';
-import { Observable, BehaviorSubject } from 'rxjs';
+import { Component } from '@angular/core';
 import { SlowInformation } from '@wtfisanapi/slow-ass-api';
+import { BehaviorSubject } from 'rxjs';
+import { SlowInformationService } from '../slow-information.service';
 
 @Component({
   selector: 'wtfisanapi-slow-information',