I got and error: TypeError: this.todos$.pipe is not a function when create an jasmine.SpyObj as a fack service

huangapple
go评论88阅读模式
英文:

I got and error: TypeError: this.todos$.pipe is not a function when create an jasmine.SpyObj as a fack service

问题

这是一个简单的待办事项列表组件：
I got and error: TypeError: this.todos$.pipe is not a function when create an jasmine.SpyObj as a fack service

这是我的测试用例：

  1. fdescribe('TodoListComponent With FackService', () => {
  2.   let fixture: ComponentFixture<TodolistComponent>;
  3.   let component: TodolistComponent;
  4.   let fackTodoService: jasmine.SpyObj<TodoService>;
  6.   beforeEach(async () => {
  7.     fackTodoService = jasmine.createSpyObj<TodoService>('TodoService', {
  8.       todolist$: of(mocktodos),
  9.       currentTodoList: [],
  10.       getTodos: of(mocktodos),
  11.       deleteTodo: undefined,
  12.       addTodo: of(mocktodos[0]),
  13.     });
  15.     await TestBed.configureTestingModule({
  16.       declarations: [TodolistComponent],
  17.       providers: [
  18.         {
  19.           provide: TodoService,
  20.           useValue: fackTodoService,
  21.         },
  22.       ],
  23.     }).compileComponents();
  25.     fixture = TestBed.createComponent(TodolistComponent);
  26.     component = fixture.componentInstance;
  27.     fixture.detectChanges();
  28.   });
  30.   it('should do something', () => {});
  31. });

触发这个测试后，它报告了以下错误：
I got and error: TypeError: this.todos$.pipe is not a function when create an jasmine.SpyObj as a fack service

似乎模拟的服务在创建 fixture 时无法初始化这些数据...
我能得到一些帮助吗？我找不到解决办法... 谢谢大家~！

英文:

Here is a simple todo list component:
I got and error: TypeError: this.todos$.pipe is not a function when create an jasmine.SpyObj as a fack service
Here is my test case:

  1. fdescribe(&#39;TodoListComponent With FackService&#39;, () =&gt; {
  2.   let fixture: ComponentFixture&lt;TodolistComponent&gt;;
  3.   let component: TodolistComponent;
  4.   let fackTodoService: jasmine.SpyObj&lt;TodoService&gt;;
  6.   beforeEach(async () =&gt; {
  7.     fackTodoService = jasmine.createSpyObj&lt;TodoService&gt;(&#39;TodoService&#39;, {
  8.       todolist$: of(mocktodos),
  9.       currentTodoList: [],
  10.       getTodos: of(mocktodos),
  11.       deleteTodo: undefined,
  12.       addTodo: of(mocktodos[0]),
  13.     });
  15.     await TestBed.configureTestingModule({
  16.       declarations: [TodolistComponent],
  17.       providers: [
  18.         {
  19.           provide: TodoService,
  20.           useValue: fackTodoService,
  21.         },
  22.       ],
  23.     }).compileComponents();
  25.     fixture = TestBed.createComponent(TodolistComponent);
  26.     component = fixture.componentInstance;
  27.     fixture.detectChanges();
  28.   });
  30.   it(&#39;should do something&#39;, () =&gt; {});
  31. });

after I trigger this test, it report an error as follow:
I got and error: TypeError: this.todos$.pipe is not a function when create an jasmine.SpyObj as a fack service

It seems the mocked service cannot init these data when creating the fixture...
Can I get some help for it, I cannot find effect solution for it... Thank you gays~!

答案1

得分: 1

第二个参数在jasmine.createSpyObj中用于方法，第三个参数用于实例变量。

所以想象一下，这是您想要模拟的内容：

  1. export class AnyThing {
  2.   instanceVariable = 2;
  3.   
  4.   method() {
  5.     return 3;
  6.   }
  7. }

它将是：

  1. let mockAnything: jasmine.SpyObj<Anything>;
  2. ...
  3. mockAnything = jasmine.createSpyObj<Anything>('Anything', { method: jasmine.createSpy() }, { instanceVariable: 2 });

也可以缩写为：

  1. mockAnything = jasmine.createSpyObj<Anything>('Anything', ['method'], { instanceVariable: 2 });

所有这些都是为了说，将这一行更改为：

  1. fackTodoService = jasmine.createSpyObj<TodoService>('TodoService', {
  2.       todolist$: of(mocktodos),
  3.       currentTodoList: [],
  4.       getTodos: of(mocktodos),
  5.       deleteTodo: undefined,
  6.       addTodo: of(mocktodos[0]),
  7.     });

变成这样：

  1. // 在&#39;TodoService&#39;后面添加一个额外的对象来模拟方法
  2. fackTodoService = jasmine.createSpyObj<TodoService>('TodoService', {}, {
  3.       todolist$: of(mocktodos),
  4.       currentTodoList: [],
  5.       getTodos: of(mocktodos),
  6.       deleteTodo: undefined,
  7.       addTodo: of(mocktodos[0]),
  8.     });

todolist$是一个实例变量而不是方法，这就是为什么我们需要使用第三个参数。

这是一些关于您想要的文档：https://stackoverflow.com/q/64560390/7365461

英文:

The 2nd argument here in jasmine.createSpyObj is for methods, the third argument is for instance variables.

So imagine this is what you want to mock:

  1. export class AnyThing {
  2.   instanceVariable = 2;
  3.   
  4.   method() {
  5.     return 3;
  6.   }
  7. }

It would be:

  1. let mockAnything: jasmine.SpyObj&lt;Anything&gt;;
  2. ...
  3. mockAnything = jasmine.createSpyObj&lt;Anything&gt;(&#39;Anything&#39;, { method: jasmine.createSpy() }, { instanceVariable: 2 });

It can be shortened to:

  1. mockAnything = jasmine.createSpyObj&lt;Anything&gt;(&#39;Anything&#39;, [&#39;method&#39;], { instanceVariable: 2 });

All that to say, change this line:

  1. fackTodoService = jasmine.createSpyObj&lt;TodoService&gt;(&#39;TodoService&#39;, {
  2.       todolist$: of(mocktodos),
  3.       currentTodoList: [],
  4.       getTodos: of(mocktodos),
  5.       deleteTodo: undefined,
  6.       addTodo: of(mocktodos[0]),
  7.     });

To this:

  1. // Add an extra object here for the mock methods after &#39;TodoService&#39;
  2. fackTodoService = jasmine.createSpyObj&lt;TodoService&gt;(&#39;TodoService&#39;, {}, {
  3.       todolist$: of(mocktodos),
  4.       currentTodoList: [],
  5.       getTodos: of(mocktodos),
  6.       deleteTodo: undefined,
  7.       addTodo: of(mocktodos[0]),
  8.     });

todolist$ is an instance variable and not a method and that's why we need to use the 3rd argument.

Here is some documentation on what you would like: https://stackoverflow.com/q/64560390/7365461

huangapple
  • 本文由 发表于 2023年5月25日 07:50:22
  • 转载请务必保留本文链接：https://go.coder-hub.com/76328051.html
  • angular
  • jasmine
  • mocking
  • unit-testing
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定