GraphQL deploy error: Failed to load configuration file "..sanity.config.ts": matchMedia not present, legacy browsers require a polyfill

[shubhamdhingra007]

Describe the bug

We are migrating from Sanity v2 to v3 and when this has started happening. Everything is successfully migrated, the project runs locally, on the hosted environment, and also builds successfully. However, when we are trying to deploy GraphQL APIs, we get the below error:

Error: Failed to load configuration file "/Users/shubhamdhingra/Desktop/Workspace/vds/authoring/vds-studio/sanity.config.ts":
matchMedia not present, legacy browsers require a polyfill
    at getStudioConfig (~/Desktop/Workspace/vds/authoring/vds-studio/node_modules/sanity/lib/_internal/cli/threads/getGraphQLAPIs.js:49:13)
    at resolveGraphQLApis (~/Desktop/Workspace/vds/authoring/vds-studio/node_modules/sanity/lib/_internal/cli/threads/getGraphQLAPIs.js:90:28)
    at getGraphQLAPIsForked (~/Desktop/Workspace/vds/authoring/vds-studio/node_modules/sanity/lib/_internal/cli/threads/getGraphQLAPIs.js:77:26)
    at Object.<anonymous> (~/Desktop/Workspace/vds/authoring/vds-studio/node_modules/sanity/lib/_internal/cli/threads/getGraphQLAPIs.js:70:1)

To Reproduce

Steps to reproduce the behavior:

1. Go to the project root
2. Execute npm run deploy:graphql

Expected behavior

Graphql schema deploys to the studio without error

Screenshots

Error:

Failing Sanity code: (Added logs in the Sanity's bundle)

sanity.cli.ts

Scripts:

Which versions of Sanity are you using?

What operating system are you using? MacOS Ventura 13.4 (22F66)

Which versions of Node.js / npm are you running? npm: 9.5.1 node: 18.16.0

Additional context

1. apiVersion using '2023-06-17'

[shubhamdhingra007]

A little more to add. I observed this when we are importing from a 3rd party library. In context, this 3rd party library is our ui-components library and works completely fine with all the famous frameworks(Gatsby, Next, CRA based) and bundlers(webpack, Vite, etc.)

[ashleyryan]

Some more details - the issue is coming from a dependency of one of our dependencies, react-slick. This error is most commonly seen in Jest because jsdom doesn't implement matchMedia.

I was trying to figure out why this isn't a problem in Vite in other apps when the library is imported in Node, and the issue seems to be that in the context this graphql job runs, window is defined, so the code thinks it's a browser context. Why is window defined here?