Yarn 2 with Plug'n'Play refuses to resolve react-aria due to the wrong peerDependencies

[neet]

🐛 Bug Report

Yarn v2 (a.k.a Berry) has a new way to resolve Node.js modules called Plug'n'Play, which is faster but forces packages to declare the exact peer dependencies they need. I tried react-aria on the Yarn v2 and I got the following errors caused by the wrong peer dependencies.

🤔 Expected Behavior

I got the following errors

➤ YN0002: │ @react-aria/menu@npm:3.2.0 [7650f] doesn't provide react-dom (pc165d), requested by @react-aria/overlays
➤ YN0002: │ @react-aria/tooltip@npm:3.1.1 [7650f] doesn't provide react-dom (pddff8), requested by @react-aria/overlays
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (pe9066), requested by @react-aria/i18n
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (pad3cf), requested by @react-aria/interactions
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p6d62f), requested by @react-aria/link
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p594c6), requested by @react-aria/utils
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (pc948d), requested by @react-aria/focus
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p056e6), requested by @react-aria/label
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p40c97), requested by @react-aria/ssr
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (pb6c69), requested by @react-aria/overlays
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p76c3b), requested by @react-aria/progress
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (pc5ca8), requested by @react-aria/visually-hidden
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p262cf), requested by @react-aria/textfield
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p0ed85), requested by @react-aria/menu
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p18df0), requested by @react-aria/breadcrumbs
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p140ee), requested by @react-aria/button
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p0c112), requested by @react-aria/checkbox
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (pf92dc), requested by @react-aria/dialog
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (pf4fe5), requested by @react-aria/listbox
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (pab203), requested by @react-aria/meter
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p7d07d), requested by @react-aria/radio
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p9004d), requested by @react-aria/searchfield
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p8c200), requested by @react-aria/select
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (pff1e4), requested by @react-aria/separator
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p6d5fb), requested by @react-aria/slider
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (p2cf1f), requested by @react-aria/switch
➤ YN0002: │ react-aria@npm:3.5.0 doesn't provide react (pb7be5), requested by @react-aria/tooltip
➤ YN0002: │ react-stately@npm:3.4.0 doesn't provide react (p28f66), requested by @react-stately/data

😯 Current Behavior

As I mentioned above, react-aria and other sub-packages do not specify their peer dependencies properly. I haven't checked other packages in this repository like react-spectrum or react-stately so it's worth ensuring.

💁 Possible Solution

The errors above can be summarized into:

• react-aria's package.json needs to have react and react-dom as its peer dependency because other @react-aria/* packages have them as peerDependency
• @react-aria/menu needs to have react-dom as a peer dependency since its dependency @react-aria/overlays also depends on react-dom
• @react-aria/tooltip needs to have react-dom as peer dependency since its dependency @react-aria/overlays also depends on react-dom

This error occurs in Yarn v2, but it's not yarn's specific problem since this is how peer dependencies should originally be treated like.

As a workaround, you can add the following configurations to .yarnrc.yml to suppress the error:

packageExtensions:
  react-aria@*:
    peerDependencies:
      react: "*"
      react-dom: "*"
  react-stately@*:
    peerDependencies:
      react: "*"
      react-dom: "*"
  "@react-aria/menu@*":
    peerDependencies:
      react-dom: "*"
  "@react-aria/tooltip@*":
    peerDependencies:
      react-dom: "*"
  "@react-aria/select@*":
    peerDependencies:
      react-dom: "*

ref: https://yarnpkg.com/configuration/yarnrc/#packageExtensions

🔦 Context

💻 Code Sample

https://github.com/neetbox/react-aria-yarn-v2

You can clone the repository and run yarn to reproduce the errors above.

🌍 Your Environment

Software	Version(s)
react-spectrum react-aria	3.5.0
Browser	N/A
Operating System	macOS Big Sur 11.3 Beta (20E5196f)

🧢 Your Company/Team

N/A

🕷 Tracking Issue (optional)

[snowystinger]

seems reasonable, I've put together a PR for it. would you mind taking a look to make sure it's what you meant?

[neet]

@snowystinger thank you for the quick response! I locally built react-aria of #1780 branch and verified that I could install without any warnings

[neet]

@snowystinger This would be off-topic for #1780 because of the title, but I later realized that react-stately is also missing react as its peer deps. Fortunately, regarding stately it doesn't have any nested errors in its sub-packages so it's a bit simpler:

It would be even better if you can also fix it in other PR or so 🙏