我的問題是,如何將 InAppBrowser 添加到規范檔案中,以便在測驗運行時定義它?我正在將 InAppBrowser 用于 Angular Ionic 應用程式,但是當我運行 npm test 時,我收到了這個錯誤
error properties: Object({ ngTempTokenPath: null, ngTokenPath: [ 'InAppBrowser', 'InAppBrowser' ] })
NullInjectorError: R3InjectorError(DynamicTestModule)[InAppBrowser -> InAppBrowser]:
NullInjectorError: No provider for InAppBrowser!
at NullInjector.get (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.js:11100:1)
at R3Injector.get (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.js:11267:1)
at R3Injector.get (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.js:11267:1)
at NgModuleRef$1.get (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.js:25365:1)
at Object.get (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.js:25079:1)
at lookupTokenUsingModuleInjector (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.js:3342:1)
at getOrCreateInjectable (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.js:3454:1)
at ??directiveInject (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.js:14736:1)
at NodeInjectorFactory.TrainingComponent_Factory [as factory] (ng:///TrainingComponent/?fac.js:5:7)
at getNodeInjectable (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.js:3549:1)
我已經嘗試將它添加到 Spec 檔案中 TestBed 的匯入中,但最終我得到了一個不同的錯誤
error TS2749: 'InAppBrowser' refers to a value, but is being used as a type here. Did you mean 'typeof InAppBrowser'?
16 private browser: InAppBrowser
編輯:供參考,這里是 AppModule 的規范和示例。我已經在提供程式中有 InAppBrowser,所以這不一定是問題。
規格檔案
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { IonicModule } from '@ionic/angular';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { InAppBrowser } from '@awesome-cordova-plugins/in-app-browser';
import { TrainingComponent } from './training.component';
describe('TrainingComponent', () => {
let component: TrainingComponent;
let fixture: ComponentFixture<TrainingComponent>;
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
declarations: [ TrainingComponent ],
imports: [
IonicModule.forRoot(),
HttpClientTestingModule,
InAppBrowser
]
}).compileComponents();
fixture = TestBed.createComponent(TrainingComponent);
component = fixture.componentInstance;
fixture.detectChanges();
}));
it('should create', () => {
expect(component).toBeTruthy();
});
});
應用模塊
import { ErrorHandler, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import { HttpClientModule } from '@angular/common/http';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { Deploy } from 'cordova-plugin-ionic/dist/ngx';
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { PreparePage } from './login/prepare/prepare.page';
import { ReferPage } from './referrals/refer/refer.page';
import { SafetyWarningPage } from './login/safety-warning/safety-warning.page';
import { AckTipsPage } from './earnings/ack-tips/ack-tips.page';
import { AppAvailability } from '@ionic-native/app-availability/ngx';
import { SentryIonicErrorHandler } from './shared/sentry-ionic-error-handler.service';
import { httpInterceptorProviders } from './http-interceptors';
import { OrderDeliveredPage } from './orders/order-delivered/order-delivered.page';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { InAppBrowser } from '@awesome-cordova-plugins/in-app-browser/ngx';
@NgModule({
declarations: [AppComponent, PreparePage, ReferPage, SafetyWarningPage, AckTipsPage, OrderDeliveredPage],
imports: [
BrowserModule,
IonicModule.forRoot(),
AppRoutingModule,
HttpClientModule,
FormsModule,
ReactiveFormsModule,
],
providers: [
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
{ provide: ErrorHandler, useClass: SentryIonicErrorHandler },
httpInterceptorProviders,
AppAvailability,
Deploy,
InAppBrowser,
],
bootstrap: [AppComponent]
})
export class AppModule { }
有關如何解決此問題的任何想法都會非常有幫助!
uj5u.com熱心網友回復:
我通過使用間諜模擬 InAppBrowser 解決了這個問題。像這樣
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { IonicModule } from '@ionic/angular';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { InAppBrowser } from '@awesome-cordova-plugins/in-app-browser/ngx';
import { TrainingComponent } from './training.component';
describe('TrainingComponent', () => {
let component: TrainingComponent;
let fixture: ComponentFixture<TrainingComponent>;
let browserSpy: jasmine.SpyObj<InAppBrowser>;
beforeEach(waitForAsync(() => {
let browserSpy = jasmine.createSpyObj<InAppBrowser>(['create'])
TestBed.configureTestingModule({
declarations: [ TrainingComponent ],
imports: [
IonicModule.forRoot(),
HttpClientTestingModule
],
providers: [
{ provide: InAppBrowser, useValue: browserSpy}
]
}).compileComponents();
fixture = TestBed.createComponent(TrainingComponent);
component = fixture.componentInstance;
fixture.detectChanges();
}));
it('should create', () => {
expect(component).toBeTruthy();
});
});
然而,這導致我犯了另一個類似于這篇文章的錯誤。我按照那里的答案解決了這個問題。
uj5u.com熱心網友回復:
您需要將其添加到您的提供商,就像這里所說的那樣:https ://stackoverflow.com/a/55619166/15947768
根據 Angular 的版本,您需要小心匯入,請參見:https ://stackoverflow.com/a/69295268/15947768
編輯:感謝您的澄清。您可以在規格檔案中檢查您的匯入嗎?應該是這樣的:import { InAppBrowser } from '@awesome-cordova-plugins/in-app-browser/ngx';
塊參考
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/460326.html
上一篇:使用訂閱的值會弄亂UI
