Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: Declaration of TestComponent with signal input breaks jest.mock #2530

Open
MillerSvt opened this issue Jun 18, 2024 · 5 comments
Open

Comments

@MillerSvt
Copy link

Version

14.1.0

Steps to reproduce

  1. clone https://github.com/MillerSvt/jest-preset-angular-bug-repro
  2. run npm i
  3. run nx test app

Expected behavior

Test pass, jest.mock works in test-with-input.spec.ts

Actual behavior

jest.mock not works in test-with-input.spec.ts. Test fails.

Additional context

Temporary workaround

Declare TestComponent in separate file.

Environment

Need to install the following packages:
[email protected]
Ok to proceed? (y) y

  System:
    OS: macOS 14.5
    CPU: (10) arm64 Apple M1 Pro
  Binaries:
    Node: 20.12.2 - ~/.nvm/versions/node/v20.12.2/bin/node
    Yarn: 1.22.22 - ~/.nvm/versions/node/v20.12.2/bin/yarn
    npm: 10.5.0 - ~/.nvm/versions/node/v20.12.2/bin/npm
  npmPackages:
    jest: ^29.4.1 => 29.7.0
@ahnpnl
Copy link
Collaborator

ahnpnl commented Jun 19, 2024

Seems like the issue is related to hoisting with jest.mock. The hoisting is done via ts-jest

@MillerSvt
Copy link
Author

MillerSvt commented Jun 19, 2024

Is there a link to the issue in ts-jest?

And I can't understand why it works without signal input if the problem is ts-jest...

@ahnpnl
Copy link
Collaborator

ahnpnl commented Jun 19, 2024

No there are any issues opened yet in ts-jest.

We transform codes using ts-jest behind the scene, which also includes hoisting for jest object. I think this hoisting doesn't work anymore when the component with input signal is in the same file with jest object. Possibly that input signal introduces something which affects hoisting logic

@MillerSvt
Copy link
Author

No there are any issues opened yet in ts-jest.

Should I open an issue?

@ahnpnl
Copy link
Collaborator

ahnpnl commented Jul 4, 2024

I digged a bit more. So the transformed code looks a bit like this

const some_utility_fn_1 = tslib_1.__importDefault(require("./some-utility-fn"));
const i0 = tslib_1.__importStar(require("@angular/core"));
jest.mock('./some-utility-fn');

Here we can see clearly that because of tslib_1.__importDefault helper which prevents jest.mock to be hoisted.

Setting importHelper: false in tsconfig.spec.json won't help either because there will be always an import helper created

const some_utility_fn_1 = __importDefault(require("./some-utility-fn"));
const i0 = __importStar(require("@angular/core"));
jest.mock('./some-utility-fn');

With this information, I think it's sufficient enough to create an issue for ts-jest

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants