spectator

spectator copied to clipboard

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request
[ ] Other... Please describe:

Current behavior

Spectator explicitly references "jasmine" types breaking Jest tests.

Expected behavior

Spectator should not reference "jasmine" types.

Minimal reproduction of the problem with instructions

1. Create a new folder with two files.

package.json

{
  "name": "spectator",
  "version": "1.0.0",
  "dependencies": {
    "@ngneat/spectator": "5.2.1",
    "@types/jasmine": "3.5.7",
    "@types/jest": "25.1.3",
    "jest": "25.1.0"
  }
}

and test.spec.ts

import { Spectator } from "@ngneat/spectator/jest";

describe("test", () => {
  it("should pass", () => {
    expect(() => {}).toHaveBeenCalledWith(expect.any(Function));
  });
});

2. Install dependencies with yarn install or npm install.

3. In VS Code open test.spec.ts and you will see the red line under expect.any:

any
Expected 0 arguments, but got 1.ts(2554)
Property 'any' does not exist on type '{ <T extends Func>(spy: T | Spy<T>): FunctionMatchers<T>; <T>(actual: ArrayLike<T>): ArrayLikeMatchers<T>; <T>(actual: T): Matchers<...>; (): NothingMatcher; }'.ts(2339)

4. Open node_modules/@ngneat/spectator/lib/mock.d.ts and remove the line

/// <reference types="jasmine" />

5. Get back to the test.spec.ts and now the error is gone (might require a restart of VS Code).

What is the motivation / use case for changing the behavior?

We have an Angular project with both Spectator/Jest for unit tests and Protractor for e2e. Protractor uses jasmine2 and this is why we need both @types/jest and @types/jasmine.

A possible suggestion to remove @types/jasmine is not a solution as we need it.

In unit tests we only use Jest and import from @ngneat/spectator/jest. Still the line in lib.mock.d.ts forces TS to load jasmine types that clash with ones from Jest.

Spectator should not prefer one types over another given that it provides /jest secondary entry point.

Environment

Angular version: 9.0.0
 
For Tooling issues:
- Node version: v12.16.1
- Platform:  Mac
- VS Code 1.42.1
- TS 3.8.3

What is your suggestion?

As an intermediate solution we postinstall-patch lib.mock.d.ts to remove /// <reference types="jasmine" /> and it seems to be working fine, but I don't know all possible outcomes.

I see there is a reference to this file in public_api.d.ts so there is probably no way to ignore it for now. But ideally if we only import from @ngneat/spectator/jest we should only load spectator/jest/lib/mock.d.ts and ignore the one in spectator/lib.

It may be possible to replace in @ngneat/spectator/jest all import from @ngneat/spectator by specific relative imports. this way typescript will never import @ngneat/spectator/ngneat-spectator.d.ts and so it will ignore the lib.mock.d.ts with the jasmine inclusion. This will make importing from @ngneat/spectator/jest and @ngneat/spectator in the same project incompatible but I think there no use case for that (you either import from one or the other, without mixing)

Hi there, in #321 I removed references from matchers.d.ts. ~To solve this issues I think we can create _jest.ts file under @ngneat/spectator which will not export mock.ts from @ngneat/spectator and use it in @ngneat/spectator/jest~ just checked it won't be so easy to stop using mock.d.ts

Any feedback about this bugfix? I want to type-check spec files with tsc --noEmit but I'm having this issue.

Hi I also stumbled on to this issue... My setup is a little bit different, as I do not use jasmine at all in my project. So when running angular or e2e tests I get a runtime error telling me:

node_modules/@ngneat/spectator/lib/mock.d.ts:1:23 - error TS2688: Cannot find type definition file for 'jasmine'.

I have seen other issues here, which are closed, but none of these solutions worked out for me. It would be nice to have a solution which works without using any package manipulation or change imports.

A simpler solution is just to put /// <reference types="jest" /> In the top of your project eg. your jasmine setup file or typing file.

@markusmo I have exact same issue, did you found a solution?

I left e2e tests alone.

Issue was my tsconfig. We did not migrate these testcases. Problem is simply that jasmine-types will not disappear, when using spectator, as they are a peer-dependency.

I changed my jest-config and how tests are run and moved everything in seperate folders. That way there where no accidental inclusion of Jasmine and if it is, I want to have an error now.

I'm not having any problem building jest tests with this jasmine reference (we use both karma and jest in this project), but I'm having the same problem with VS Code syntax highlighting. We get red squigglies on all jest-specific expect methods, and VS Code code completion uses Jasmine types. Eg

The tsconfig used by VS Code does include:

  "compilerOptions": {
    "types": [
      "jest",
      "tslib"
    ],

But the jasmine types seem to take precedence over the jest types (again, only for VS Code - this is not affecting compiling). Currently the fix is to add:

/// <reference types="jest" />

to the top of any test file using Jest specific expect code. Unfortunately adding /// <reference types="jest" /> to the jest entrypoint file doesn't seem to do the trick.

This is particularly frustrating in that it affects tests that don't use Spectator.

Any Progress here? I have the same problem:

My test setup for this lib of my nx monorep is using jest. But there are also jasmine tests running in different libs. The tests green, only the IDE complains.

Error message from IDE: `TS2339: Property 'any' does not exist on type '{ (spy: T | Spy ): FunctionMatchers ; (actual: ArrayLike ): ArrayLikeMatchers ; (actual: T): Matchers...>; (): NothingMatcher; }'.`

@johncrim Adding /// <reference types="jest"/> to my test-setup.ts does the job, but it's only a workaround.

We also running into this issue in our NX monorepo with Jest and Spectator. The workaround /// <reference types="jest"/> works, but i would love to see this solved in Spectator itself.

Also seem to be running into this when converting a codebase from Jasmine to Jest. Added the /// <reference types="jest"/> didn't actually seem to resolve the issue (tests would run fine with or without that line, but the editor, IntelliJ, continually reports the TS error). Ended up having to just @ts-ignore the line in question for now.

I haven't verified this, but looking through the jest lib folder, only the /jest/lib/mock.d.ts file seems to reference a file (via an import of SpyObject from /lib/mock.d.ts) which has the hard-coded reference to jasmine (/// <reference types="jasmine" />) at the top. Would the fix be to provide a SpyObject crafted for jest then so it doesn't need to import it from the base lib anymore?