Skip to content
GitLab
Projects Groups Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in / Register
  • C create-react-app
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 1,547
    • Issues 1,547
    • List
    • Boards
    • Service Desk
    • Milestones
  • Merge requests 417
    • Merge requests 417
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Packages and registries
    • Packages and registries
    • Package Registry
    • Infrastructure Registry
  • Monitor
    • Monitor
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • Meta
  • create-react-app
  • Issues
  • #5662
Closed
Open
Issue created Nov 01, 2018 by Administrator@rootContributor

Jest "not allowed to reference out of scope variables" for typescript types

Created by: sampsonjoliver

Is this a bug report?

Yes

Did you try recovering your dependencies?

Yes

Environment

Yarn 1.10.1 on Windows 10 CRA 2.1 Node 8.10.0

Steps to Reproduce

  1. Init a CRA using typescript yarn create-react-app <name> --typescript
  2. In App.test.tsx, mock a package, specifying a type argument in the mock value

type MyType = {};

jest.mock('./index', () => {
  return {
    index: (foo: MyType ) => foo
  };
});

it('renders without crashing', () => {
  ...
});
  1. Run tests yarn test

Expected Behavior

Typescript and all type information to be removed/ignored during runtime by the test runner.

Actual Behavior

It seems like the babel-plugin-jest-hoist doesn't play with babel's typescript compiler, and is being fed sources that still have type information attached while it's running. Which would be a-okay, except that Jest gets angry any time something is referenced inside a mock function that doesn't start with mock<TheThing>.

This might be a babel issue rather than a CRA issue - but raising it here as this is behaviour that works in react-scripts-ts - probably thanks to the way ts-jest loads the tests - but doesn't work with CRA 2.1.

Here's the output from jest

babel-plugin-jest-hoist: The module factory of `jest.mock()` is not allowed to reference any out-of-scope variables.
    Invalid variable access: MyType

    Whitelisted objects: Array, ArrayBuffer, Boolean, DataView, Date, Error, EvalError, Float32Array, Float64Array, Function, Generator, GeneratorFunction, Infinity, Int16Array, Int32Array, Int8Array, InternalError, Intl, JSON, Map, Math, NaN, Number, Object, Promise, Proxy, RangeError, ReferenceError, Reflect, RegExp, Set, String, Symbol, SyntaxError, TypeError, URIError, Uint16Array, Uint32Array, Uint8Array, Uint8ClampedArray, WeakMap, WeakSet, arguments, console, expect, isNaN,
jest, parseFloat, parseInt, require, undefined, DTRACE_NET_SERVER_CONNECTION, DTRACE_NET_STREAM_END, DTRACE_HTTP_SERVER_REQUEST, DTRACE_HTTP_SERVER_RESPONSE, DTRACE_HTTP_CLIENT_REQUEST, DTRACE_HTTP_CLIENT_RESPONSE, COUNTER_NET_SERVER_CONNECTION, COUNTER_NET_SERVER_CONNECTION_CLOSE, COUNTER_HTTP_SERVER_REQUEST, COUNTER_HTTP_SERVER_RESPONSE, COUNTER_HTTP_CLIENT_REQUEST, COUNTER_HTTP_CLIENT_RESPONSE, global, process, Buffer, clearImmediate, clearInterval, clearTimeout, setImmediate, setInterval, setTimeout.
    Note: This is a precaution to guard against uninitialized mock variables. If it is ensured that the mock is required lazily, variable names prefixed with `mock` (case insensitive) are permitted.

Solution currently is to either not include type information inside of the jest.mock(...) call, or to rename the type


type mockMyType = {};

jest.mock('./index', () => {
  return {
    index: (foo: mockMyType ) => foo
  };
});

it('renders without crashing', () => {
  ...
});
Assignee
Assign to
Time tracking