What causes "Failed to open in MUI Chat" in mui/material-ui?

Retry the click after a short wait — most failures are transient backend issues.

mui/material-ui · error · Error

Failed to open in MUI Chat

Error message

Failed to open in MUI Chat

What it means

Thrown after the POST to `${baseUrl}/v1/public/chat/open` returns a non-2xx status. The helper already validated the base URL exists; this error means the Chat backend was reachable but rejected the request (auth, payload, rate limit, or upstream failure). The outer catch logs the response detail and re-throws so the UI can surface the failure.

Source

Thrown at packages-internal/core-docs/src/Demo/sandbox/MuiChat.ts:86

        const response = await fetch(`${baseUrl}/v1/public/chat/open`, {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json',
          },
          body: JSON.stringify({
            name: demoData.title,
            description: document.title,
            files,
            type: 'mui-docs',
            package: {
              name: primaryPackage,
              version: dependencies[primaryPackage] || 'latest',
            },
          }),
        });

        if (!response.ok) {
          throw new Error('Failed to open in MUI Chat');
        }

        const data = await response.json();
        window.open(data.nextUrl, '_blank');
      } catch (error) {
        console.error('Error opening MUI Chat:', error);
        throw error;
      }
    },
  };
}

View on GitHub (pinned to bdc96df2cb)

Solutions

Retry the click after a short wait — most failures are transient backend issues.
Check browser DevTools Network tab for the actual status code on /v1/public/chat/open; 4xx points to a payload/config problem, 5xx to a backend problem.
Use the CodeSandbox or StackBlitz open button as a fallback while Chat is unavailable.
If you operate the Chat backend, inspect its logs for the correlating request and verify the route and auth.

Example fix

// before
const response = await fetch(`${baseUrl}/v1/public/chat/open`, {...});
if (!response.ok) throw new Error('Failed to open in MUI Chat');
// after — surface the status/body for diagnosis
if (!response.ok) throw new Error(`Failed to open in MUI Chat (HTTP ${response.status}): ${await response.text()}`);

Defensive patterns

Strategy: retry

Try / catch

async function openChatWithRetry(payload, { retries = 2 } = {}) {
  for (let attempt = 0; ; attempt++) {
    try {
      const res = await fetch(`${baseUrl}/v1/public/chat/open`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(payload) });
      if (res.ok) return res.json();
      if (res.status >= 500 && attempt < retries) { await new Promise(r => setTimeout(r, 1000 * (attempt + 1))); continue; }
      throw new Error(`Failed to open in MUI Chat (HTTP ${res.status})`);
    } catch (e) {
      if (attempt < retries) continue;
      throw e;
    }
  }
}

Prevention

Show a fallback (CodeSandbox/StackBlitz) in the UI when Chat returns non-2xx.
Surface the status code and response body in the re-thrown error for faster diagnosis.
Monitor the Chat endpoint uptime separately so docs editors know when to expect failures.

When it happens

Trigger: Clicking 'Open in MUI Chat' when the Chat service is down, returns 4xx for an invalid payload (e.g. missing primaryPackage), returns 401/403 due to missing auth, or 5xx during an incident; also triggered by transient network errors that produce an ok=false response.

Common situations: MUI Chat backend outage; preview/staging endpoint that requires auth headers the docs client does not send; demo with a productId that has no package mapping so the payload is malformed.

Related errors

AI-assisted analysis of mui/material-ui@bdc96df2cb (2026-08-12). Data as JSON: /api/errors/d01a864a40a307fc. Report an issue: GitHub.