test: angular, react, and vue apps are tested on CI (#1795)

ionic-team · Aug 14, 2023 · a68dd52 · a68dd52
1 parent 7a81488
commit a68dd52
Show file tree

Hide file tree

Showing 35 changed files with 87 additions and 79 deletions.
diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
@@ -37,12 +37,10 @@ jobs:
   test:
     strategy:
       matrix:
-        # We do not need to explicitly test vue-vite and react-vite
-        # because the test command finds apps that start with
-        # the framework string. As a result "vue" will map
-        # to both "vue" and "vue-vite" apps. Similarly,
-        # "react" will map to both "react" and "react-vite" apps.
-        framework: ['vue', 'react']
+        # We explicitly list each test app so they can
+        # be built in parallel rather than only specifying
+        # "vue" which would cause several projects to be built sequentially.
+        framework: ['vue-vite-official-blank', 'vue-vite-official-list', 'vue-vite-official-tabs', 'vue-vite-official-sidemenu', 'vue-official-blank', 'vue-official-list', 'vue-official-tabs', 'vue-official-sidemenu', 'react-vite-official-blank', 'react-vite-official-list', 'react-vite-official-tabs', 'react-vite-official-sidemenu', 'react-official-blank', 'react-official-list', 'react-official-tabs', 'react-official-sidemenu', 'angular-standalone-official-blank', 'angular-standalone-official-list', 'angular-standalone-official-tabs', 'angular-standalone-official-sidemenu', 'angular-official-blank', 'angular-official-list', 'angular-official-tabs', 'angular-official-sidemenu']
 
     runs-on: ubuntu-latest
     needs: build
@@ -61,15 +59,28 @@ jobs:
           node-version: 16
           cache: npm
           cache-dependency-path: |
-            build/${{ matrix.framework }}-*/ionic.starter.json
-            build/${{ matrix.framework }}-*/package.json
+            build/${{ matrix.framework }}/ionic.starter.json
+            build/${{ matrix.framework }}/package.json
 
       - name: Test ${{ matrix.framework }}
         run: |
           npm install
           rm -rf node_modules/@types
           npm run starters:test -- --type=${{ matrix.framework }}
-          
+        
+  # This step allows us to have a required
+  # status check for each matrix job without having
+  # to manually add each matrix run in the branch protection rules.
+  # Source: https://github.community/t/status-check-for-a-matrix-jobs/127354  
+  verify-test:
+    if: ${{ always() }}
+    needs: test
+    runs-on: ubuntu-latest
+    steps:
+      - name: Check build matrix status
+        if: ${{ needs.test.result != 'success' }}
+        run: exit 1
+
   test-legacy:
     strategy:
       matrix:
@@ -102,6 +113,19 @@ jobs:
           npm install
           rm -rf node_modules/@types
           npm run starters:test -- --type=${{ matrix.framework }}
+  
+  # This step allows us to have a required
+  # status check for each matrix job without having
+  # to manually add each matrix run in the branch protection rules.
+  # Source: https://github.community/t/status-check-for-a-matrix-jobs/127354  
+  verify-test-legacy:
+    if: ${{ always() }}
+    needs: test-legacy
+    runs-on: ubuntu-latest
+    steps:
+      - name: Check build matrix status
+        if: ${{ needs.test-legacy.result != 'success' }}
+        run: exit 1
 
   deploy:
     runs-on: ubuntu-latest

diff --git a/angular-standalone/base/src/app/app.component.spec.ts b/angular-standalone/base/src/app/app.component.spec.ts
@@ -1,16 +1,14 @@
 import { TestBed } from '@angular/core/testing';
-import { provideRouter } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
 import { AppComponent } from './app.component';
 
 describe('AppComponent', () => {
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [AppComponent],
-      providers: [provideRouter([])],
-    }).compileComponents();
-  });
-
   it('should create the app', () => {
+    TestBed.overrideComponent(AppComponent, {
+      add: {
+        imports: [RouterTestingModule]
+      }
+    });
     const fixture = TestBed.createComponent(AppComponent);
     const app = fixture.componentInstance;
     expect(app).toBeTruthy();

diff --git a/angular-standalone/official/blank/ionic.starter.json b/angular-standalone/official/blank/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run lint && npm run ng -- build --configuration=ci && npm run ng -- build --configuration=production --progress=false && npm run ng -- test --configuration=ci && npm run ng -- e2e --configuration=ci && npm run ng -- g pg my-page --dry-run && npm run ng -- g c my-component --dry-run"
+    "test": "npm run lint && npm run build && npm run test -- --configuration=ci --browsers=ChromeHeadless"
   }
 }
diff --git a/angular-standalone/official/blank/src/app/home/home.page.spec.ts b/angular-standalone/official/blank/src/app/home/home.page.spec.ts
@@ -7,10 +7,6 @@ describe('HomePage', () => {
   let fixture: ComponentFixture<HomePage>;
 
   beforeEach(async () => {
-    await TestBed
-      .configureTestingModule()
-      .compileComponents();
-
     fixture = TestBed.createComponent(HomePage);
     component = fixture.componentInstance;
     fixture.detectChanges();

diff --git a/angular-standalone/official/list/ionic.starter.json b/angular-standalone/official/list/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run lint && npm run ng -- build --configuration=ci && npm run ng -- build --configuration=production --progress=false && npm run ng -- test --configuration=ci && npm run ng -- e2e --configuration=ci && npm run ng -- g pg my-page --dry-run && npm run ng -- g c my-component --dry-run"
+    "test": "npm run lint && npm run build && npm run test -- --configuration=ci --browsers=ChromeHeadless"
   }
 }
diff --git a/angular-standalone/official/list/src/app/app.component.spec.ts b/angular-standalone/official/list/src/app/app.component.spec.ts
@@ -1,16 +1,17 @@
 import { TestBed } from '@angular/core/testing';
-import { provideRouter } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
 import { IonicModule } from '@ionic/angular';
 
 import { AppComponent } from './app.component';
 
 describe('AppComponent', () => {
 
   beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [AppComponent, IonicModule],
-      providers: [provideRouter([])]
-    }).compileComponents();
+    TestBed.overrideComponent(AppComponent, {
+      add: {
+        imports: [RouterTestingModule]
+      }
+    });
   });
 
   it('should create the app', () => {

diff --git a/angular-standalone/official/sidemenu/ionic.starter.json b/angular-standalone/official/sidemenu/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run lint && npm run ng -- build --configuration=ci && npm run ng -- build --configuration=production --progress=false && npm run ng -- test --configuration=ci && npm run ng -- e2e --configuration=ci && npm run ng -- g pg my-page --dry-run && npm run ng -- g c my-component --dry-run"
+    "test": "npm run lint && npm run build && npm run test -- --configuration=ci --browsers=ChromeHeadless"
   }
 }
diff --git a/angular-standalone/official/sidemenu/src/app/app.component.spec.ts b/angular-standalone/official/sidemenu/src/app/app.component.spec.ts
@@ -1,14 +1,15 @@
 import { TestBed } from '@angular/core/testing';
-import { provideRouter } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
 
 import { AppComponent } from './app.component';
 
 describe('AppComponent', () => {
   beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [AppComponent],
-      providers: [provideRouter([])],
-    }).compileComponents();
+    TestBed.overrideComponent(AppComponent, {
+      add: {
+        imports: [RouterTestingModule]
+      }
+    });
   });
 
   it('should create the app', () => {

diff --git a/angular-standalone/official/sidemenu/src/app/folder/folder.page.spec.ts b/angular-standalone/official/sidemenu/src/app/folder/folder.page.spec.ts
@@ -1,5 +1,5 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { provideRouter } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
 import { IonicModule } from '@ionic/angular';
 
 import { FolderPage } from './folder.page';
@@ -9,10 +9,11 @@ describe('FolderPage', () => {
   let fixture: ComponentFixture<FolderPage>;
 
   beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [FolderPage, IonicModule],
-      providers: [provideRouter([])],
-    }).compileComponents();
+    TestBed.overrideComponent(FolderPage, {
+      add: {
+        imports: [RouterTestingModule]
+      }
+    });
 
     fixture = TestBed.createComponent(FolderPage);
     component = fixture.componentInstance;

diff --git a/angular-standalone/official/tabs/ionic.starter.json b/angular-standalone/official/tabs/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run lint && npm run ng -- build --configuration=ci && npm run ng -- build --configuration=production --progress=false && npm run ng -- test --configuration=ci && npm run ng -- e2e --configuration=ci && npm run ng -- g pg my-page --dry-run && npm run ng -- g c my-component --dry-run"
+    "test": "npm run lint && npm run build && npm run test -- --configuration=ci --browsers=ChromeHeadless"
   }
 }
diff --git a/...ar-standalone/official/tabs/src/app/explore-container/explore-container.component.spec.ts b/...ar-standalone/official/tabs/src/app/explore-container/explore-container.component.spec.ts
@@ -7,8 +7,6 @@ describe('ExploreContainerComponent', () => {
   let fixture: ComponentFixture<ExploreContainerComponent>;
 
   beforeEach(async () => {
-    await TestBed.configureTestingModule().compileComponents();
-
     fixture = TestBed.createComponent(ExploreContainerComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();

diff --git a/angular-standalone/official/tabs/src/app/tab1/tab1.page.spec.ts b/angular-standalone/official/tabs/src/app/tab1/tab1.page.spec.ts
@@ -7,10 +7,6 @@ describe('Tab1Page', () => {
   let fixture: ComponentFixture<Tab1Page>;
 
   beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [Tab1Page],
-    }).compileComponents();
-
     fixture = TestBed.createComponent(Tab1Page);
     component = fixture.componentInstance;
     fixture.detectChanges();

diff --git a/angular-standalone/official/tabs/src/app/tab2/tab2.page.spec.ts b/angular-standalone/official/tabs/src/app/tab2/tab2.page.spec.ts
@@ -7,10 +7,6 @@ describe('Tab2Page', () => {
   let fixture: ComponentFixture<Tab2Page>;
 
   beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [Tab2Page],
-    }).compileComponents();
-
     fixture = TestBed.createComponent(Tab2Page);
     component = fixture.componentInstance;
     fixture.detectChanges();

diff --git a/angular-standalone/official/tabs/src/app/tab3/tab3.page.spec.ts b/angular-standalone/official/tabs/src/app/tab3/tab3.page.spec.ts
@@ -7,10 +7,6 @@ describe('Tab3Page', () => {
   let fixture: ComponentFixture<Tab3Page>;
 
   beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [Tab3Page],
-    }).compileComponents();
-
     fixture = TestBed.createComponent(Tab3Page);
     component = fixture.componentInstance;
     fixture.detectChanges();

diff --git a/angular-standalone/official/tabs/src/app/tabs/tabs.page.spec.ts b/angular-standalone/official/tabs/src/app/tabs/tabs.page.spec.ts
@@ -1,5 +1,5 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { provideRouter } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
 
 import { TabsPage } from './tabs.page';
 
@@ -8,10 +8,11 @@ describe('TabsPage', () => {
   let fixture: ComponentFixture<TabsPage>;
 
   beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [TabsPage],
-      providers: [provideRouter([])],
-    }).compileComponents();
+    TestBed.overrideComponent(TabsPage, {
+      add: {
+        imports: [RouterTestingModule]
+      }
+    });
   });
 
   beforeEach(() => {

diff --git a/angular/official/blank/ionic.starter.json b/angular/official/blank/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run lint && npm run ng -- build --configuration=ci && npm run ng -- build --configuration=production --progress=false && npm run ng -- test --configuration=ci && npm run ng -- e2e --configuration=ci && npm run ng -- g pg my-page --dry-run && npm run ng -- g c my-component --dry-run"
+    "test": "npm run lint && npm run build && npm run test -- --configuration=ci --browsers=ChromeHeadless"
   }
 }
diff --git a/angular/official/list/ionic.starter.json b/angular/official/list/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run lint && npm run ng -- build --configuration=ci && npm run ng -- build --configuration=production --progress=false && npm run ng -- test --configuration=ci && npm run ng -- e2e --configuration=ci && npm run ng -- g pg my-page --dry-run && npm run ng -- g c my-component --dry-run"
+    "test": "npm run lint && npm run build && npm run test -- --configuration=ci --browsers=ChromeHeadless"
   }
 }
diff --git a/angular/official/sidemenu/ionic.starter.json b/angular/official/sidemenu/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run lint && npm run ng -- build --configuration=ci && npm run ng -- build --configuration=production --progress=false && npm run ng -- test --configuration=ci && npm run ng -- e2e --configuration=ci && npm run ng -- g pg my-page --dry-run && npm run ng -- g c my-component --dry-run"
+    "test": "npm run lint && npm run build && npm run test -- --configuration=ci --browsers=ChromeHeadless"
   }
 }
diff --git a/angular/official/tabs/ionic.starter.json b/angular/official/tabs/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run lint && npm run ng -- build --configuration=ci && npm run ng -- build --configuration=production --progress=false && npm run ng -- test --configuration=ci && npm run ng -- e2e --configuration=ci && npm run ng -- g pg my-page --dry-run && npm run ng -- g c my-component --dry-run"
+    "test": "npm run lint && npm run build && npm run test -- --configuration=ci --browsers=ChromeHeadless"
   }
 }
diff --git a/react-vite/official/blank/ionic.starter.json b/react-vite/official/blank/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test.unit -- --watch=false && npm i --no-save concurrently && ./node_modules/.bin/concurrently \"npm run dev\" \"npm run test.e2e\" --kill-others --success first"
   }
 }
diff --git a/react-vite/official/list/ionic.starter.json b/react-vite/official/list/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test.unit -- --watch=false && npm i --no-save concurrently && ./node_modules/.bin/concurrently \"npm run dev\" \"npm run test.e2e\" --kill-others --success first"
   }
 }
diff --git a/react-vite/official/sidemenu/ionic.starter.json b/react-vite/official/sidemenu/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test.unit -- --watch=false && npm i --no-save concurrently && ./node_modules/.bin/concurrently \"npm run dev\" \"npm run test.e2e\" --kill-others --success first"
   }
 }
diff --git a/react-vite/official/tabs/ionic.starter.json b/react-vite/official/tabs/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test.unit -- --watch=false && npm i --no-save concurrently && ./node_modules/.bin/concurrently \"npm run dev\" \"npm run test.e2e\" --kill-others --success first"
   }
 }
diff --git a/react/official/blank/ionic.starter.json b/react/official/blank/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test -- --watchAll=false"
   }
 }
diff --git a/react/official/list/ionic.starter.json b/react/official/list/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test -- --watchAll=false"
   }
 }
diff --git a/react/official/sidemenu/ionic.starter.json b/react/official/sidemenu/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test -- --watchAll=false"
   }
 }
diff --git a/react/official/tabs/ionic.starter.json b/react/official/tabs/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test -- --watchAll=false"
   }
 }
diff --git a/vue-vite/official/blank/ionic.starter.json b/vue-vite/official/blank/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test:unit -- --watch=false && npm i --no-save concurrently && ./node_modules/.bin/concurrently \"npm run dev\" \"npm run test:e2e\" --kill-others --success first"
   }
 }
diff --git a/vue-vite/official/list/ionic.starter.json b/vue-vite/official/list/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test:unit -- --watch=false && npm i --no-save concurrently && ./node_modules/.bin/concurrently \"npm run dev\" \"npm run test:e2e\" --kill-others --success first"
   }
 }
diff --git a/vue-vite/official/sidemenu/ionic.starter.json b/vue-vite/official/sidemenu/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test:unit -- --watch=false && npm i --no-save concurrently && ./node_modules/.bin/concurrently \"npm run dev\" \"npm run test:e2e\" --kill-others --success first"
   }
 }
diff --git a/vue-vite/official/tabs/ionic.starter.json b/vue-vite/official/tabs/ionic.starter.json
@@ -7,6 +7,6 @@
     "www"
   ],
   "scripts": {
-    "test": "npm run build"
+    "test": "npm run build && npm run test:unit -- --watch=false && npm i --no-save concurrently && ./node_modules/.bin/concurrently \"npm run dev\" \"npm run test:e2e\" --kill-others --success first"
   }
 }