styled-components / jest-styled-components

🔧 💅 Jest utilities for Styled Components
MIT License
1.58k stars 145 forks source link

JavascriptHeap out of memory error #45

Closed codeflyer closed 7 years ago

codeflyer commented 7 years ago

I've added the jest styled component 4.0.0-8 in a project an works with some test but if I run the full suite I receive this error:

<--- Last few GCs --->

[51821:0x105000000]     9070 ms: Mark-sweep 779.9 (790.3) -> 775.7 (790.3) MB, 179.7 / 0.0 ms  allocation failure GC in old space requested
[51821:0x105000000]     9516 ms: Mark-sweep 775.7 (790.3) -> 775.5 (783.3) MB, 446.3 / 0.0 ms  last resort 
[51821:0x105000000]     9767 ms: Mark-sweep 775.5 (783.3) -> 775.2 (783.3) MB, 250.6 / 0.0 ms  last resort 

<--- JS stacktrace --->

==== JS stack trace =========================================

Security context: 0x1293e2e266a1 <JS Object>
    1: RegExpReplace [native regexp.js:~356] [pc=0x179e8c420ef7](this=0x28ffb9fd3b29 <JS RegExp>,z=0x12cd89302201 <Very long string[42284031]>,ak=0x28ffb9fd3b09 <String[3]: c21>)
    2: 0x2cfeccec9c11 <Symbol: Symbol.replace>(aka [Symbol.replace]) [native regexp.js:1] [pc=0x179e8c37d789](this=0x28ffb9fd3b29 <JS RegExp>,z=0x12cd89302201 <Very long string[42284031]>,ak=0x28ffb9fd3b09 <String[3]: ...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory

I'll try to isolate the error and reproduce it in an open source environment.

MicheleBertoli commented 7 years ago

Interesting, thanks @codeflyer. This doesn't sound right and having a minimal example to repro the issue would help a lot.

MicheleBertoli commented 7 years ago

I'm closing this due to inactivity, please re-open it as soon as you can provide a non-working example. Also, I was able to test the components of the website without any memory issue. Thank you very much @codeflyer.

joshjg commented 7 years ago

@codeflyer Were you able to find a solution? We are running into the same issue.

MicheleBertoli commented 7 years ago

@joshjg can you please provide a non-working example? I'll be happy to help. Thanks!

codeflyer commented 7 years ago

I tried again in my codebase today but the error is disappeared. I though was done an update to the lib. But now that you're telling me this probably the component that was creating the issues was removed from the package (I've used it in a Lerna project and a lot of components are not there anymore)

My component used some external library and wasn't a pure react module. Do you have the same situation?

Unfortnately I can't provide the code and I had no time to prepare a fake version that reproduced the issue.

greypants commented 7 years ago

I believe the issue is happening for us (@joshjg) when adding

  "snapshotSerializers": [
    "enzyme-to-json/serializer"
  ],

to jest.json. Which is the only way I can seem to get jest-styled-components to work. Importing it directly to my test file seems to have no effect. My classes still look like: class="sc-dxgOiQ fmXHim".

MicheleBertoli commented 7 years ago

@greypants would you mind trying with the test renderer (without enzyme) so that we can isolate the cause of the issue? Please let me know if you need more info/help. Thanks!

greypants commented 7 years ago

@MicheleBertoli Our issue ended up being a memory leak caused by something in our Jest setup.js file. We were doing the following:

// in setup.js
process.on('unhandledRejection', (reason, failedPromise) => { 
 // handle rejections
}

The problem was that setup runs before every test, and a new unhandleRejection listener would get added every time. So our issue was not directly related, though switching to the enzyme-to-json serializer may have increased the memory for each test just enough to make the memory leak more noticeable.

We're all good now. Thanks for your work on this project!

MicheleBertoli commented 7 years ago

This is interesting, thank you very much for letting me know @greypants.

sublimeye commented 6 years ago

I'm experiencing the same issue. SSR + styledComponents When I run jMeter (load testing utility) with hundreds of requests eventually server dies with the same error (It is only 700 requests over 50 seconds). jest is not involved in this case.

<--- Last few GCs --->

[53718:0x103000000]  1258601 ms: Mark-sweep 1400.0 (1482.2) -> 1400.0 (1482.7) MB, 1593.1 / 0.1 ms  allocation failure GC in old space requested
[53718:0x103000000]  1260342 ms: Mark-sweep 1400.0 (1482.7) -> 1399.9 (1446.2) MB, 1740.5 / 0.0 ms  last resort
[53718:0x103000000]  1261988 ms: Mark-sweep 1399.9 (1446.2) -> 1399.9 (1446.2) MB, 1645.9 / 0.0 ms  last resort

<--- JS stacktrace --->

==== JS stack trace =========================================

Security context: 0x162fde7a8799 <JSObject>
    0: builtin exit frame: assign(aka assign)(this=0x35fd05982311 <undefined>,0x2fad729d7c79 <Object map = 0x7ee443c4d59>,0x1864cbf2c2d9 <Object map = 0xc0765d023b9>)

    2: clone [/Users/morozor/projects/work/solace/webapp-solace/node_modules/styled-components/lib/models/StyleSheet.js:180] [bytecode=0xd134a619081 offset=115](this=0x3e7434646899 <JSFunction StyleSheet (sfi = 0xa4eada8d749)>,old...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
 1: node::Abort()