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

Option to disable global-mocks on jest builder #696

Closed
tonivj5 opened this issue Mar 15, 2020 · 15 comments · Fixed by #965
Closed

Option to disable global-mocks on jest builder #696

tonivj5 opened this issue Mar 15, 2020 · 15 comments · Fixed by #965
Labels
builders:jest enhancement New feature or request

Comments

@tonivj5
Copy link

tonivj5 commented Mar 15, 2020

Describe the Bug

I'm having problems with the global mocks configured, I would like to disable them. Could be posible to provide an option in angular.json to disable it?

Minimal Reproduction

I think it isn't needed

Expected Behavior

And option to disable the mocks applied

Screenshots

If applicable, add screenshots to help explain your problem.

Environment


Libs
- @angular/core version: latest
- @angular-devkit/build-angular version: latest
- @angular-builders/jest version: latest

For Tooling issues:
I think it isn't needed

Others:
None

## Additional Context

Add any other context about the problem here.
@just-jeb
Copy link
Owner

You don't need a special option for this. The global mocks can be easily overwritten if you add your own setup file to setupFilesAfterEnv and in this file redefine the window props.

@just-jeb just-jeb added builders:jest enhancement New feature or request labels Mar 15, 2020
@tonivj5
Copy link
Author

tonivj5 commented Mar 15, 2020

I have my own setup file with setupFilesAfterEnv, but they are not being overwritten, I think they are concatenated.

And how global-mocks override global properties before my setup runs, I can not do anything to avoid it

@just-jeb
Copy link
Owner

The setup files array is concatenated, you're right, but that only means that the setup files run in order one after another. Which means if you redefine window properties in your setup file they should get overwritten even if the default setup file defined them before.

@tonivj5
Copy link
Author

tonivj5 commented Mar 15, 2020

The setup files array is concatenated, you're right, but that only means that the setup files run in order one after another. Which means if you redefine window properties in your setup file they should get overwritten even if the default setup file defined them before.

That's exactly what I want to do, but I want to avoid the redefinetion of window's properties. I don't want to patch window and leave it as it's (prev to global-mocks.ts applied). I want this behavior because actually some patches are not necessary anymore...

@just-jeb
Copy link
Owner

Well if some of the patches are not necessary anymore we probably should change it in the builder. Let's discuss.

@tonivj5
Copy link
Author

tonivj5 commented Mar 16, 2020

Ok, here you have a list of patches that I think don't be necessary anymore:

  • this patch ==> *storage are full implemented
  • this patch ==> I don't know why this patch is currently necessary, I think js-dom has doctype full implemented
  • this patch ==> getComputedStyle and why I opened this issue (because its value breaks me some tests that use it) is mostly well-supported

Those are the patches I think could be removed, what do you think?

@LeVraiSylvain
Copy link

LeVraiSylvain commented Mar 20, 2020

The storage included in JsDom >= 11.12.0 works perfectly. The mock just broke the readonly property "length" (always undefined).

@just-jeb
Copy link
Owner

Jest 24 (which is the minimal version to use with this builder) uses jsdom@^11.5.1.

Thus:

  • localStorage - implemented since 11.12.0 - mock removal might break some builds that explicitly depend on [email protected] but shouldn't break builds that just depend on Jest 24.
  • sessionStorage - same as localStorage.
  • document.doctype - couldn't find any mention of that in JSDOM. The only thing I found is that doctype is serializable but I'm not sure whether it works or not as a document property.
  • getComputedStyle - started being relatively similar to the native implementation since 15.2.0 - the mock cannot be removed before we move to Jest 25 as a minimal required version (Jest 25 uses jsdom@^15.1.1).
  • transform property - has been implemented in [email protected] which is being used by jsdom. However [email protected] explicitly requires cssstyle < 0.3.0. [email protected] uses cssstyle@^1.0.0. Therefore again, mock removal might break some builds that explicitly depend on [email protected] but shouldn't break builds that just depend on Jest 24.
  • matchMedia - not implemented in jsdom, official Jest documentation suggests to mock it.

Conclusions:
I don't think we can remove the mocks as part of a minor release, IMHO they should be all removed as part of version 10 which should require Jest 25.
What we can do until then in order to address your specific issues is:

  1. Fix the mock where applicable (like length undefined in storage)
  2. You can redefine the global mock to fit your specific test case like in case of getComputedStyles.

What do you think?

@tonivj5
Copy link
Author

tonivj5 commented Mar 23, 2020

Thanks for the extensive well-documented response @just-jeb!! 👏

I understand that mocks can't be removed yet, I'm ok with that.

However, my main problem persists because I can't simply redefine the mock (I don't want to mock it, just leave it as it is, without mock), I need the original behavior of getComputedStyles implmeneted injsdom, before it has been mocked.

As my setup-file always runs after your global-mocks I can't avoid the mock to happens or restore the original getComputedStyles.

For that reason,

Could be posible to provide an option in angular.json to disable it?

Then, I could disable your global-mocks and applied the mocks that I really need.

@tonivj5
Copy link
Author

tonivj5 commented Apr 6, 2020

As a workaround (if anyone want to be able of disable the global-mocks) I'm using this script in my package.json to remove the mocks:

"scripts": {
  "postinstall": "echo > node_modules/@angular-builders/jest/dist/jest-config/global-mocks.js"
}

I would prefer to have an option, but this works meanwhile 👍

@just-jeb
Copy link
Owner

just-jeb commented Apr 7, 2020

Thanks @tonivj5 . Just FYI you're not forgotten, I have a proper solution in mind just need to find time to implement it.

@tonivj5
Copy link
Author

tonivj5 commented Apr 7, 2020

Thanks for the feedback 🚀

@klinem
Copy link

klinem commented Feb 1, 2021

Just to add to this, I was running into some trouble using @testing-library/angular and its accessibility selectors. The getComputedStyle mock seems to to interfere with discoverability of accessible elements.

@just-jeb
Copy link
Owner

Hey, @klinem thanks for the report and sorry for the late response.
Seems like we still need the option to disable the global mocks.

@just-jeb
Copy link
Owner

The new globalMocks option is available in v11.2.0-beta.0, please confirm it works for you.
For more details refer to documentation.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
builders:jest enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants