Search code examples
angularjestjsthree.jsenoentorbitcontrols

ENOENT error while deploy JEST test with THREE JS OrbitControls


I´ve finished the implementations of a new feature that uses Orbit Controls library, they all work properly, the three Js module is imported as documentation says:

import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';

but later when I relaunch the JEST test that worked before it throws the error:

ENOENT: no such file or directory, open 'C:\Users\d.mauricio\Documents\development\cadm-ui-cad-editor\node_modules\three\examples\jsm\controls\OrbitControls'

   7 | import { Point } from 'src/app/models/GeometryObject/point';
   8 | import { Segment } from 'src/app/models/GeometryObject/segment';
>  9 | import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
     | ^

The file is at the correct route as i've checked, and also it compiles and works, so I dont understand why it throws this error while testing.


Solution

  • Without reproducible code, it's a bit difficult to find exact reason what's causing this issue. There are several ways to handle this issues:

    1. Make Jest bundler runs in same environment

    Whether the app compiles or not should not matter because Jest runs in different compilation environment. The project needs to provide a separate module bundler setting, that's synced with the project's bundler setting.

    • make sure jest.config.js has matching module resolution setting as the project's bundler setting. check this official document on jest.config.js
    • make sure OrbitControls.js is not excluded from Jest bundler setting.
    • in some cases, if the project is based on toolchains that provides automatic Jest configuration, i.g. Next.js, Nuxt.js..., it might not be necessary.

    2. Make OrbitControls run in your folder

    • the problem arises because OrbitControls.js is not a compiled source, unlike most files provided from node_modules. It's a just an example of camera implementation. Thus, it confuses compiler/bundler.
    • OrbitControls.js itself is actually quite simple, the implementation does not bring any dependencies. check OrbitControls.js source code on Github.
    • just copy OrbitControls.js from that folder, paste in your folder, and import from there. It'll probably work in most cases.