fix: unit tests part 1

Author: NathanWalker

apps/nativescript-demo-ng/project.json

@@ -38,8 +38,7 @@
         "uglify": false,
         "release": false,
         "forDevice": false,
-        "prepare": false,
-        "flags": "--env.commonjs"
+        "prepare": false
       },
       "dependsOn": [
         "^build"
@@ -58,8 +57,7 @@
         "{workspaceRoot}/coverage/apps/nativescript-demo-ng"
       ],
       "options": {
-        "coverage": false,
-        "flags": "--env.commonjs"
+        "coverage": false
       },
       "dependsOn": [
         "^build"

apps/nativescript-demo-ng/src/tests/detached-loader-tests.spec.ts

@@ -1,13 +1,14 @@
 // make sure you import mocha-config before @angular/core
 import { ChangeDetectionStrategy, Component, Directive, NgModule, NO_ERRORS_SCHEMA, ViewChild } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
-import { DetachedLoader, NativeScriptModule } from '@nativescript/angular';
+import { DetachedLoader, NativeScriptCommonModule, NativeScriptModule } from '@nativescript/angular';
 import { NativeScriptTestingModule } from '@nativescript/angular/testing';
 // import { NS_COMPILER_PROVIDERS } from "@nativescript/angular/platform";
 import { CommonModule } from '@angular/common';
 
 @Component({
   template: `<StackLayout><Label text="COMPONENT"></Label></StackLayout>`,
+  imports: [NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class TestComponent {}
@@ -24,7 +25,7 @@ class LoaderComponentBase {
       <DetachedContainer #loader></DetachedContainer>
     </StackLayout>
   `,
-  imports: [DetachedLoader],
+  imports: [DetachedLoader, NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class LoaderComponent extends LoaderComponentBase {}
@@ -37,14 +38,14 @@ export class LoaderComponent extends LoaderComponentBase {}
       <DetachedContainer #loader></DetachedContainer>
     </StackLayout>
   `,
-  imports: [DetachedLoader],
+  imports: [DetachedLoader, NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 // eslint-disable-next-line @angular-eslint/component-class-suffix
 export class LoaderComponentOnPush extends LoaderComponentBase {}
 
 @NgModule({
-  imports: [LoaderComponent, LoaderComponentOnPush, TestComponent],
+  imports: [LoaderComponent, LoaderComponentOnPush, TestComponent, NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class EntryComponentsTestModule {}

apps/nativescript-demo-ng/src/tests/detached-utils-tests.spec.ts

@@ -13,11 +13,12 @@ import {
   ViewContainerRef,
 } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { generateDetachedLoader, generateNativeScriptView, NgViewRef } from '@nativescript/angular';
+import { generateDetachedLoader, generateNativeScriptView, NativeScriptCommonModule, NgViewRef } from '@nativescript/angular';
 import { GridLayout, ProxyViewContainer } from '@nativescript/core';
 
 @Component({
   template: `<ng-container #vc></ng-container><ng-template #template><GridLayout></GridLayout></ng-template>`,
+  imports: [NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class GenerateViewComponent {
@@ -28,12 +29,13 @@ export class GenerateViewComponent {
 
 @Component({
   template: `<GridLayout></GridLayout>`,
+  imports: [NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class GeneratedComponent {}
 
 @NgModule({
-  imports: [GeneratedComponent, GenerateViewComponent],
+  imports: [GeneratedComponent, GenerateViewComponent, NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class GeneratedModule {}

apps/nativescript-demo-ng/src/tests/http-client-ns-backend.spec.ts

@@ -2,9 +2,10 @@
 import { NSFileSystem } from '@nativescript/angular';
 import { NsHttpBackEnd } from '@nativescript/angular';
 
+import { EnvironmentInjector, createEnvironmentInjector, runInInjectionContext } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
 import { HttpRequest, HttpResponse, HttpErrorResponse } from '@angular/common/http';
 import { XhrFactory } from '@angular/common';
-import { File } from '@nativescript/core/file-system';
 
 class NSFileSystemMock implements NSFileSystem {
   public currentApp(): any {
@@ -36,7 +37,10 @@ describe('NsHttpBackEnd ', () => {
   let backend: NsHttpBackEnd;
 
   beforeEach(() => {
-    backend = new NsHttpBackEnd(new XhrFactoryMock(), new NSFileSystemMock());
+    TestBed.configureTestingModule({});
+    const parentInjector = TestBed.inject(EnvironmentInjector);
+    const injector = createEnvironmentInjector([], parentInjector);
+    backend = runInInjectionContext(injector, () => new NsHttpBackEnd(new XhrFactoryMock(), new NSFileSystemMock()));
   });
 
   it("should work with local files prefixed with '~'", (done) => {

apps/nativescript-demo-ng/src/tests/list-view-tests.spec.ts

@@ -1,6 +1,6 @@
 import { Component, Input, NO_ERRORS_SCHEMA, ViewChild } from '@angular/core';
 import { TestBed, waitForAsync } from '@angular/core/testing';
-import { ListViewComponent, TemplateKeyDirective } from '@nativescript/angular';
+import { ListViewComponent, NativeScriptCommonModule, TemplateKeyDirective } from '@nativescript/angular';
 // import trace = require("trace");
 // trace.setCategories("ns-list-view, " + trace.categories.Navigation);
 // trace.enable();
@@ -27,7 +27,7 @@ let testTemplates: { first: number; second: number };
       </ListView>
     </GridLayout>
   `,
-  imports: [ListViewComponent],
+  imports: [ListViewComponent, NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class TestListViewComponent {
@@ -41,6 +41,8 @@ export class TestListViewComponent {
 @Component({
   selector: 'item-component',
   template: `<Label text="template"></Label>`,
+  imports: [NativeScriptCommonModule],
+  schemas: [NO_ERRORS_SCHEMA],
 })
 export class ItemTemplateComponent {
   @Input() set templateName(value: any) {
@@ -68,7 +70,7 @@ export class ItemTemplateComponent {
       </ListView>
     </GridLayout>
   `,
-  imports: [ListViewComponent, TemplateKeyDirective, ItemTemplateComponent],
+  imports: [ListViewComponent, TemplateKeyDirective, ItemTemplateComponent, NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class TestListViewSelectorComponent {
@@ -101,7 +103,7 @@ export class TestListViewSelectorComponent {
       </ListView>
     </GridLayout>
   `,
-  imports: [ListViewComponent, TemplateKeyDirective, ItemTemplateComponent],
+  imports: [ListViewComponent, TemplateKeyDirective, ItemTemplateComponent, NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class TestListViewSelectorWithEventsComponent {

apps/nativescript-demo-ng/src/tests/modal-dialog.spec.ts

@@ -1,7 +1,7 @@
 // make sure you import mocha-config before @angular/core
 import { Component, inject, NgModule, NO_ERRORS_SCHEMA, ViewContainerRef } from '@angular/core';
 import { TestBed, waitForAsync } from '@angular/core/testing';
-import { FrameService, ModalDialogParams, ModalDialogService, NSLocationStrategy, Outlet } from '@nativescript/angular';
+import { FrameService, ModalDialogParams, ModalDialogService, NativeScriptCommonModule, NSLocationStrategy, Outlet } from '@nativescript/angular';
 import { Frame, isIOS } from '@nativescript/core';
 
 import { FakeFrameService } from './ns-location-strategy.spec';
@@ -10,6 +10,7 @@ const CLOSE_WAIT = isIOS ? 1000 : 0;
 @Component({
   selector: 'modal-comp',
   template: `<Label text="this is modal component" (shownModally)="onShownModally()"></Label>`,
+  imports: [NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class ModalComponent {
@@ -25,6 +26,7 @@ export class ModalComponent {
   selector: 'fail-comp',
   providers: [ModalDialogService],
   template: `<Label text="This app is doomed"></Label>`,
+  imports: [NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class FailComponent {
@@ -37,6 +39,7 @@ export class FailComponent {
   template: ` <GridLayout margin="20">
     <Label text="Modal dialogs"></Label>
   </GridLayout>`,
+  imports: [NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class SuccessComponent {
@@ -47,9 +50,8 @@ export class SuccessComponent {
 }
 
 @NgModule({
-  imports: [FailComponent, SuccessComponent, ModalComponent],
+  imports: [FailComponent, SuccessComponent, ModalComponent, NativeScriptCommonModule],
   exports: [FailComponent, SuccessComponent, ModalComponent],
-  // entryComponents: [ModalComponent],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class EntryComponentsTestModule {}
@@ -62,7 +64,7 @@ describe('modal-dialog', () => {
   //     [ModalComponent]));
   beforeEach(() => {
     return TestBed.configureTestingModule({
-      imports: [FailComponent, SuccessComponent, ModalComponent],
+      imports: [FailComponent, SuccessComponent, ModalComponent, NativeScriptCommonModule],
       providers: [{ provide: FrameService, useValue: new FakeFrameService() }, NSLocationStrategy],
     }).compileComponents();
   });

apps/nativescript-demo-ng/src/tests/platform-filter-components.spec.ts

@@ -1,14 +1,14 @@
 // make sure you import mocha-config before @angular/core
 import { Component, ElementRef, inject, NO_ERRORS_SCHEMA } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
-import { AndroidFilterComponent, DEVICE, IOSFilterComponent, AppleFilterComponent } from '@nativescript/angular';
+import { AndroidFilterComponent, DEVICE, IOSFilterComponent, AppleFilterComponent, NativeScriptCommonModule } from '@nativescript/angular';
 import { platformNames } from '@nativescript/core/platform';
 import { createDevice, dumpView } from './test-utils.spec';
 @Component({
   template: ` <StackLayout>
     <ios><Label text="IOS"></Label></ios>
   </StackLayout>`,
-  imports: [IOSFilterComponent],
+  imports: [IOSFilterComponent, NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class IosSpecificComponent {
@@ -19,7 +19,7 @@ export class IosSpecificComponent {
   template: ` <StackLayout>
     <apple><Label text="Apple"></Label></apple>
   </StackLayout>`,
-  imports: [AppleFilterComponent],
+  imports: [AppleFilterComponent, NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class AppleSpecificComponent {
@@ -30,7 +30,7 @@ export class AppleSpecificComponent {
   template: ` <StackLayout>
     <android><Label text="ANDROID"></Label></android>
   </StackLayout>`,
-  imports: [AndroidFilterComponent],
+  imports: [AndroidFilterComponent, NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class AndroidSpecificComponent {
@@ -41,6 +41,7 @@ export class AndroidSpecificComponent {
   template: ` <StackLayout>
     <Label android:text="ANDROID" ios:text="IOS"></Label>
   </StackLayout>`,
+  imports: [NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 export class PlatformSpecificAttributeComponent {

apps/nativescript-demo-ng/src/tests/spans.spec.ts

@@ -4,7 +4,7 @@
  */
 import { Component, ElementRef, NO_ERRORS_SCHEMA, ViewChild } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
-import { NativeScriptModule } from '@nativescript/angular';
+import { NativeScriptCommonModule, NativeScriptModule } from '@nativescript/angular';
 import { TextBase } from '@nativescript/core';
 
 const configureComponents = (textBaseElementName: string) => {
@@ -21,6 +21,8 @@ const configureComponents = (textBaseElementName: string) => {
     </${textBaseElementName}>`;
   @Component({
     template,
+    imports: [NativeScriptCommonModule],
+    schemas: [NO_ERRORS_SCHEMA],
   })
   class SpansComponent extends BaseComponent {}
 
@@ -45,6 +47,8 @@ const configureComponents = (textBaseElementName: string) => {
     </${textBaseElementName}>`;
   @Component({
     template,
+    imports: [NativeScriptCommonModule],
+    schemas: [NO_ERRORS_SCHEMA],
   })
   class DynamicSpansComponent extends BaseComponent {
     show = true;
@@ -61,6 +65,8 @@ const configureComponents = (textBaseElementName: string) => {
     </${textBaseElementName}>`;
   @Component({
     template,
+    imports: [NativeScriptCommonModule],
+    schemas: [NO_ERRORS_SCHEMA],
   })
   class DynamicFormattedStringComponent extends BaseComponent {
     show = true;

apps/nativescript-demo-ng/src/tests/textnode.spec.ts

@@ -1,10 +1,11 @@
 import { Component, ElementRef, NO_ERRORS_SCHEMA, ViewChild } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
-import { TextNode } from '@nativescript/angular';
+import { NativeScriptCommonModule, TextNode } from '@nativescript/angular';
 import { TextBase } from '@nativescript/core';
 
 @Component({
   template: `<Label #textElement>{{ text }}</Label>`,
+  imports: [NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 class TextNodeComponent {
@@ -16,6 +17,7 @@ class TextNodeComponent {
   template: `<Label #textElement
     ><Span>{{ text }}</Span></Label
   >`,
+  imports: [NativeScriptCommonModule],
   schemas: [NO_ERRORS_SCHEMA],
 })
 class TextNodeSpansComponent {

package.json

@@ -11,7 +11,7 @@
     "start": "nx serve",
     "build": "npx nx run-many --target=build --exclude=nativescript-demo-ng",
     "test.android": "nx test nativescript-demo-ng android",
-    "test.ios": "nx test nativescript-demo-ng ios",
+    "test.ios": "npx rimraf apps/nativescript-demo-ng/platforms && nx test nativescript-demo-ng ios",
     "lint": "nx workspace-lint && nx lint",
     "e2e": "nx e2e",
     "affected:apps": "nx affected:apps",