angular - 类型具有私有(private)属性模拟服务单元测试 Angular 7 的单独声明

Question

我正在尝试创建一个模拟服务，但收到错误“类型具有私有(private)属性的单独声明”，对我来说，声明似乎是相等的并且没有不同，但它说不在错误中。 我正在一个已注入(inject)服务的组件中进行此测试! 是的，我想在这里用模拟测试来测试一下。

我的模拟服务代码:

class MockDataservice {   
result: any;
constructor(private http: HttpClient){
    sendCodeToServer() {
     return this.result;
     } 
}

describe('HomePage', () => 
...
{
 ...  
beforeEach(() => { 
...
    service = new MockDataservice(http);  
    component = new HomePage(platform, service, splash, statusbar, barcode, alert, http, loading, router);

原来的服务:

export class DataStorageService {
    result: any;
      constructor(private http: HttpClient) {
      }

sendToServer(data) {
const headers = new HttpHeaders().set('Content-Type', 'application/json');
   return new Promise((resolve, reject) => {
   this.http.post(endpoindURL, data, { headers: headers })
        .toPromise().then((data) => {
          resolve(data);
        }).catch((err) => {
          console.log(err);
          reject(err);
        });
    });
  }
}

组件中的服务使用:

export class HomePage {
barcodeScannerOptions: BarcodeScannerOptions;
    constructor(private platform: Platform, private **dataStorageService**: 
    DataStorageService,
    private splashScreen: SplashScreen,
    private statusBar: StatusBar, private barcodeScanner: BarcodeScanner, public 
    alertController: AlertController,
    private http: HttpClient, private loadingController: LoadingController, 
    private router: Router) {

    this.initializeApp();

    this.barcodeScannerOptions = {
          showTorchButton: true,
          showFlipCameraButton: true
        };
      }

    function doesSomething(){
    this.dataStorageService.sendToServer(data).then((res) => {
    }

我在 home.spec 文件中的“服务”一词中收到错误

组件=新主页(平台，服务，启动栏，状态栏， 条形码、警报、http、加载、路由器)；

错误是

MockDataservice is not assignable to parameter of type //DataStorageService. Types have separate declarations of a private property http.ts

Answer 1

这是正在发生的事情的详尽答案。我构建了一个重现该行为的最小示例:Broken example on TypeScript Playground 。您实际上可以看到完全相同的错误消息。

这是怎么回事？ Component 需要在其构造函数中提供实际 Service 类的实例。 MockService 不是服务。它只是巧合地具有相同的构造函数参数和相同的方法名称。编译器不知道两者实际上是兼容的(即实现相同的接口(interface))，因此会抛出错误。

我们如何解决这个问题？使用实际的面向对象抽象。由于 Service 和 MockService 实际上是可以互换的，我们需要让编译器知道这一点。我们该怎么做呢？ 让他们实现相同的接口(interface)。

我们只需定义一个Service 接口(interface)。我们将有一个ConcreteService，它包含默认行为，并实现Service。我们还将拥有 MockService，它将实现相同的 Service，但具有模拟行为:Working example on TypeScript playground .,