Jest mocking with workspaces

[wdfinch]

Hi all, I'm having some issues with mocking react components in workspaces. I would really appreciate it if someone could point me in the right direction. Here's my sample setup:

I have workspace A and workspace B. In workspace A I have a component that looks like this:

// Header.tsx

import React from 'react'
import {Icon} from '@my-company/B'

const Header = () => {
  return (
    <Icon src={'test'}/>
  )
}

export default Header 

in workspace B I export the Icon component like so

// index.ts

export {default as Icon} from './Icon.tsx

// Icon.tsx

import React from 'react'
import SVG from 'react-inlinesvg'

const Icon = ({src}) => {
  return (
    <SVG src={icon} />
  )
}

export default Icon

When it comes to using jest I want to mock the Icon. The reason being that the icon won't work properly unless it's in a browser environment and I get an error.

No matter what I try, I can't seem to mock it if it's in a workspace. The only docs I can find on this are mocking relative imports and node_modules imports. This is closer to the second case. Can anyone tell me how I could mock this Icon so that when I run a jest test on Header.tsx, I don't render the actual <Icon/> but some dummy component instead?

[goncalomarques]

hey @wdfinch did you find a solution for this?