Jest in CodeSandbox 3.0

Question

Jest in CodeSandbox 3.0

Opened this issue 7 years ago · 45 comments

gautamarora commented 7 years ago

Creating an issue to discuss future features for Jest integration in CodeSandbox...

Jest in CodeSandbox 2.5 - issue | release

Unit testing
Mock functions
Snapshot testing (read only, does not create new snapshots)
Async runner
UI - watch mode, show test fail inline in editor, run tests for single suite

Jest in CodeSandbox 3

Snapshot saving
Manual mocks
Jest config
Code Coverage

Please comment in this issue with more features that should be added to the list.

cc @CompuIves

Answer 1 · 2018-02-08T16:01:47.000Z

also cc @gillchristian - interested to help with code or ideas? :)

Answer 2 · 2018-02-08T16:28:46.000Z

Yeah, I just joined Discord, we can talk there 😄

Answer 3 · 2018-03-07T13:39:37.000Z

jest.config.js support would be really nice.

Answer 4 · 2018-03-07T14:01:59.000Z

@alexilyaev indeed, in the Discord I mentioned I'd like to work on it but haven't found the time yet 😬

Answer 5 · 2018-05-14T16:14:19.000Z

Fake timers 🙏

jest.useFakeTimers is not a function

Answer 6 · 2018-05-18T23:25:02.000Z

Just came across this ticket after commenting on another ticket #692 (comment). There may be issues utilizing enzyme as well.

To clarify, people will have issues running enzyme if they utilize setupTestFrameworkScriptFile like is suggested in the official enzyme docs https://github.com/airbnb/enzyme/blob/master/docs/guides/jest.md#configure-with-jest

Answer 7 · 2018-06-14T17:33:52.000Z

Would have been nicer when I called jest.mock(..) instead of getting TypeError: jest.mock is not a function, I would get a Error: not implemented yet in codesandbox.io, see: https://github.com/CompuIves/codesandbox-client/issues/513

Answer 8 · 2018-07-26T14:43:03.000Z

or jest.doMock ;)
I've look through half of half of the Internet to finally find this bug :D

Answer 9 · 2018-09-19T14:59:15.000Z

Would have been nicer when I called jest.mock(..) instead of getting TypeError: jest.mock is not a function, I would get a Error: not implemented yet in codesandbox.io, see: https://github.com/CompuIves/codesandbox-client/issues/513

+1 As local code works fine, the "not a function" error is a bit misleading (to me anyways), as I literally found out about CodeSandbox today (super awesome BTW!) and trying to use it to testdrive react components and jest tests. Not knowing the architecture, I just assumed that if Jest was in the dependencies correctly, I could call any of the jest.x() functions.

Answer 10 · 2019-01-17T15:42:04.000Z

So I've read this thread over 3x and still not sure if this is still an known issue or not.
I continue to get the error...
jest.mock is not a function

There seems to be codesandbox docs about using Jest... but no mention of limitations.
https://codesandbox.io/docs/tests

Answer 11 · 2019-02-14T08:56:59.000Z

@iDVB I don't think jest.mock()/"automatic mock" is supported yet. 🤔

How do we check the version of CodeSandbox from the dashboard btw?

Answer 12 · 2019-02-20T09:18:25.000Z

@dwiyatci You can check the version in any sandbox here:

Answer 13 · 2019-02-20T16:54:47.000Z

@SaraVieira Thank you. :) But what I meant was: how can we tell whether it's CodeSandbox 2.5 or 3.0? 😅

Answer 14 · 2019-02-21T16:30:47.000Z

Shhhhhit, no idea haha

Ask Ives 🤔

@CompuIves

Answer 15 · 2019-03-08T06:18:54.000Z

jest.useFakeTimers is not a function
Hi, is there any update for above fix?

Answer 16 · 2019-03-22T13:29:20.000Z

@gautamarora , @gillchristian Are you guys still interested in pursuing this?

Answer 17 · 2019-05-23T13:36:20.000Z

I'd be interested in having the Snapshot Saving feature if possible!

Or is it possible already?

For example, I was thinking about the potential of the Run any NPM Script feature CodeSandbox Containers, which seems to enable running Jest with the -u flag via an npm script...

Answer 18 · 2019-05-23T17:07:28.000Z

@SaraVieira just confirmed my suspicions that this is only possible at the moment with Containers.

Is CodeSandbox satisfied with this? Or would you also like to be able to create and update files on non-Container sandboxes? (maybe a whitelisted list of things that can be updated, at least to start with?)

Answer 19 · 2019-05-29T09:05:19.000Z

Also Manual Mocks - those would be super useful.

Workaround: At the moment, the closest thing to a workaround that I've found is to use the import * as name from '../relative/path' syntax with mock functions, but that only seems to work for local modules, not dependencies...

import { useIt } from "./use-default-export";

import * as myfunc from "./default-export-function";

test("use-default-export-function", () => {
  expect(useIt()).toEqual("real");
});

test("use-default-export-function with mock", () => {
  myfunc.default = jest.fn(() => "unreal");
  expect(useIt()).toEqual("unreal");
});

https://codesandbox.io/s/88wlzp6q88

Answer 20 · 2019-07-08T14:35:51.000Z

People who came here because this error or similar (like me)

jest.useFakeTimers is not a function

For now you can bypass this issue and use the done() callback of jest

it("uses a timer", done => {
  console.log("start");
  let x = 0;
  setTimeout(() => {
    console.log("done!");
    expect(x === 0).toBe(true);
    done();
  }, 250);
  console.log("continue");
});

Answer 21 · 2020-04-04T14:20:59.000Z

is this still an issue? I'm getting the same error from 2018 on jest.mock

Answer 22 · 2020-04-07T21:01:04.000Z

is this fixed yet ?

Answer 23 · 2020-04-07T21:47:49.000Z

@stephanepericat i dont think so.. its since 2018

Answer 24 · 2020-06-10T13:25:38.000Z

Lol just wasted so much time trying to debug it. nvm I guess 😞

Answer 25 · 2020-07-18T18:40:29.000Z

Still is not jest.mock() available in CodeSandbox?

I just tried..., what a pity!

Answer 26 · 2020-09-12T16:01:06.000Z

september 2020, jest.mock and jest.useFakeTimers are still bugs.

Answer 27 · 2020-10-21T21:41:30.000Z

I opened a GitHub Discussions chat (#5042) on this.

Feel free to comment over there too.

Hopefully it will help further gain traction for serious consideration to add Jest mocks support, alongside this open issue.

Answer 28 · 2020-12-04T04:51:03.000Z

Hit this issue today, codesandbox: https://codesandbox.io/s/crimson-framework-jddh2?file=/src/index.test.js

There was an error while evaluating the file:

jest.useFakeTimers is not a function

Answer 29 · 2020-12-22T02:50:38.000Z

jest.useFakeTimers is not a function

Issue still persists. Just checked today.

Answer 30 · 2020-12-22T23:08:57.000Z

jest.mock is not a function still an error.

https://codesandbox.io/s/misty-wave-ecvgf?file=/src/setupTests.js

Answer 31 · 2021-02-27T06:25:26.000Z

jest.useFakeTimers is not a function still persists
https://codesandbox.io/s/fancy-morning-lmwx6?file=/src/index.test.ts

Answer 32 · 2021-03-26T09:17:39.000Z

guess this is still a problem 😔

Answer 33 · 2021-04-01T04:40:23.000Z

Still got this error when running tests.
https://codesandbox.io/s/github/kentcdodds/react-testing-library-examples/tree/main/?from-embed&initialpath=%2F__tests__%2Fasync.js

jest.useRealTimers is not a function

TypeError: jest.useRealTimers is not a function
    at runWithJestRealTimers (https://vj929.csb.app/node_modules/@testing-library/dom/dist/@testing-library/dom.esm.js:651:8)
    at runWithRealTimers (https://vj929.csb.app/node_modules/@testing-library/dom/dist/@testing-library/dom.esm.js:634:12)
    at Window.evaluate (https://vj929.csb.app/node_modules/@testing-library/dom/dist/@testing-library/dom.esm.js:682:26)
    at z (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:99284)
    at G.evaluate (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:111641)
    at be.evaluateTranspiledModule (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:121458)
    at c (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:111387)
    at Window.evaluate (https://vj929.csb.app/node_modules/@testing-library/react/dist/@testing-library/react.esm.js:44:17)
    at z (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:99284)
    at G.evaluate (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:111641)
    at be.evaluateTranspiledModule (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:121458)
    at c (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:111387)
    at Window.evaluate (https://vj929.csb.app/src/__tests__/react-lazy-and-suspense.js:13:15)
    at z (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:99284)
    at G.evaluate (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:111641)
    at be.evaluateTranspiledModule (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:121458)
    at be.evaluateModule (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:120957)
    at https://codesandbox.io/static/js/7.4b9a6a838.chunk.js:1:15776
    at l (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257422)
    at Generator._invoke (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257175)
    at Generator.forEach.e.<computed> [as next] (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257779)
    at t (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2420)
    at i (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2631)
    at https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2690
    at new Promise (<anonymous>)
    at https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2571
    at https://codesandbox.io/static/js/7.4b9a6a838.chunk.js:1:16135
    at Array.map (<anonymous>)
    at e.<anonymous> (https://codesandbox.io/static/js/7.4b9a6a838.chunk.js:1:15477)
    at l (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257422)
    at Generator._invoke (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257175)
    at Generator.forEach.e.<computed> [as next] (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257779)
    at t (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2420)
    at i (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2631)

Answer 34 · 2021-04-04T15:54:00.000Z

Still got this error when running tests.
https://codesandbox.io/s/github/kentcdodds/react-testing-library-examples/tree/main/?from-embed&initialpath=%2F__tests__%2Fasync.js

jest.useRealTimers is not a function

TypeError: jest.useRealTimers is not a function
    at runWithJestRealTimers (https://vj929.csb.app/node_modules/@testing-library/dom/dist/@testing-library/dom.esm.js:651:8)
    at runWithRealTimers (https://vj929.csb.app/node_modules/@testing-library/dom/dist/@testing-library/dom.esm.js:634:12)
    at Window.evaluate (https://vj929.csb.app/node_modules/@testing-library/dom/dist/@testing-library/dom.esm.js:682:26)
    at z (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:99284)
    at G.evaluate (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:111641)
    at be.evaluateTranspiledModule (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:121458)
    at c (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:111387)
    at Window.evaluate (https://vj929.csb.app/node_modules/@testing-library/react/dist/@testing-library/react.esm.js:44:17)
    at z (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:99284)
    at G.evaluate (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:111641)
    at be.evaluateTranspiledModule (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:121458)
    at c (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:111387)
    at Window.evaluate (https://vj929.csb.app/src/__tests__/react-lazy-and-suspense.js:13:15)
    at z (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:99284)
    at G.evaluate (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:111641)
    at be.evaluateTranspiledModule (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:121458)
    at be.evaluateModule (https://codesandbox.io/static/js/sandbox.3fb0c3bb6.js:1:120957)
    at https://codesandbox.io/static/js/7.4b9a6a838.chunk.js:1:15776
    at l (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257422)
    at Generator._invoke (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257175)
    at Generator.forEach.e.<computed> [as next] (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257779)
    at t (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2420)
    at i (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2631)
    at https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2690
    at new Promise (<anonymous>)
    at https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2571
    at https://codesandbox.io/static/js/7.4b9a6a838.chunk.js:1:16135
    at Array.map (<anonymous>)
    at e.<anonymous> (https://codesandbox.io/static/js/7.4b9a6a838.chunk.js:1:15477)
    at l (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257422)
    at Generator._invoke (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257175)
    at Generator.forEach.e.<computed> [as next] (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:257779)
    at t (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2420)
    at i (https://codesandbox.io/static/js/common-sandbox.51de09afd.chunk.js:1:2631)

Facing the same issue too

Answer 35 · 2021-04-30T10:27:54.000Z

Hi here, I get the same issue as well https://codesandbox.io/s/modern-morning-md378

Do we have any update on this?

Answer 36 · 2021-05-01T04:14:00.000Z

Apologies if cross-posting issue, but appreciate any work-around or ideas for my issue regarding Jest not working on Static templates:
#5726

Answer 37 · 2021-05-07T09:20:37.000Z

Yes, this is still something we want to do, but it's challenging. It's something that we haven't planned in the near-future, but we do want to expand the Jest functionality in the future. I can't tell when we'll have this though.

Answer 38 · 2021-08-06T00:09:50.000Z

This issue has automatically been marked stale because there has been no activity in a while. Please leave a comment if the issue has not been resolved, or if it is not stale for any other reason. After 2 weeks, this issue will automatically be closed, unless a comment is made or the stale label is removed.

Answer 39 · 2021-08-06T00:24:55.000Z

It seems like this is still being worked on.

Answer 40 · 2021-11-26T11:33:50.000Z

I'm looking into this one and I have some questions about the jest implementation.

Normally, when the Jest global is initialized its created by the jest-runtime and mock/other timer functions are added to the global Jest object. This can be seen here.

What's happening in codesandbox is that the jest-runtime is never being initialized - I presume there may be some reason for this. That can be seen here, where jest is actually initialized here with the MockModule class from jest-mock, which populates part of the jest globals into the global space but doesn't add functions like _createJestObjectFor() from jest-runtime. This is why you can use spyOn but not mock - jest-mock actually doesn't declare a mock function until you initialize it with the MockModule.generateFromMetadata<T, Y extends Array>(

@CompuIves you're getting tagged just because you seem to be the only maintainer here. There may be someone better who can answer these questions. Sorry about that!

Is there a reason that jest-runtime isn't being used to its full extent here?
Why is jest-mock being used as the jest object here?

I am trying to get a jest-runtime instance set up in the codesandbox world. I presume there might be issues with this - namely the jest-runtime needs some sort of file/module resolver, which may not play nicely with the codesandbox environment.

For everyone who hasn't looked into it - Jest has a lot going on and even I don't completely understand how the Jest runtime works (and its created differently for node/jsdom!).

Answer 41 · 2022-08-26T14:25:17.000Z

You know what... It's really annoying to spend time writing stuff cover, it with tests, and in the end, get this one 🤦🏽‍♂️🙃

Answer 42 · 2022-12-18T08:16:55.000Z

Hey guess what .. jest.mock is still NOT a function sigh

Answer 43 · 2023-02-13T07:47:52.000Z

Hey guess what .. jest.mock is still NOT a function sigh

Answer 44 · 2023-02-14T11:28:39.000Z

I'd recommend switching to cloud sandboxes as they can natively run Node tools (including Jest).

Answer 45 · 2023-03-31T17:15:44.000Z

I know cloud sandboxes are recommended, but sinon.useFakeTimers works (just in case anyone was still looking for a solution)