How to resolve aliases defined for paths when unit testing reactjs components

See more:

testing

Karma

ReactJS

Dear Community

I have a React JS application with a set of components. Some are simple components which render HTML whereas others are nested components which use other components in it.

Here is the example - Header.jsx component uses the HtmlRow component referenced by a alias.

<pre lang="Javascript">
import React from 'react';
import HtmlRow from '@repo/libraryv3/HtmlRow';
.
.
render() {   

    return (
      <div className="someclasss">
        <HtmlRow>
          <HtmlCol xs={12} >
//.......
//....

The path

'@repo/libraryV3/

is defined as a alias in package.json which actually maps to the physical path of the repository.

"devDependencies": {    
    "@repo/libraryv3": "git+https://git.mycompany.com/repositories/libraryV3.git#branch1",

Now here is the details of the issue -

1. I am using jest & enzyme for writing unit tests for these components which works perfectly if it is a simple component which does not refer any other component in it.
2. However when I use a component like the Header.jsx for unit testing which in turn refers HtmlRow component , and render it using 'shallow' or 'mount',the underlying test framework is unable to resolve the alias and it throws error -

Cannot find module './HtmlRow/HtmlRow' from 'header.spec.js'

I am open to use any packages that solves the issue.

What I have tried:

1. What I was able to understand is that the test framework is unable to resolve the alias defined in package.json.

2. I tried using the jest-resolver mentioned here. However it gives me the same 'Module not found error'

[^NPM jest resolver]
3. Also tried various solutions using nock, redux-store etc.

Any suggestions, solutions are appreciated