Avoid HTML injection in standalone errors (#36839)

## Summary
- Render standalone DevTools server errors with DOM nodes instead of
HTML strings.
- Preserve the existing error box classes and copy while inserting error
text with `textContent`.

## How did you test this?
- `corepack yarn prettier`
- `corepack yarn lint packages/react-devtools-core/src/standalone.js`
This commit is contained in:
Minh Vu
2026-06-23 11:28:42 +01:00
committed by GitHub
parent 3c9fcfe660
commit 45b8774c8e
+23 -20
View File
@@ -176,31 +176,34 @@ function onDisconnected() {
disconnectedCallback();
}
function showErrorMessage(headerText: string, contentText: string) {
const box = document.createElement('div');
box.className = 'box';
const header = document.createElement('div');
header.className = 'box-header';
header.textContent = headerText;
box.appendChild(header);
const content = document.createElement('div');
content.className = 'box-content';
content.textContent = contentText;
box.appendChild(content);
node.textContent = '';
node.appendChild(box);
}
function onError({code, message}: $FlowFixMe) {
safeUnmount();
if (code === 'EADDRINUSE') {
node.innerHTML = `
<div class="box">
<div class="box-header">
Another instance of DevTools is running.
</div>
<div class="box-content">
Only one copy of DevTools can be used at a time.
</div>
</div>
`;
showErrorMessage(
'Another instance of DevTools is running.',
'Only one copy of DevTools can be used at a time.',
);
} else {
node.innerHTML = `
<div class="box">
<div class="box-header">
Unknown error
</div>
<div class="box-content">
${message}
</div>
</div>
`;
showErrorMessage('Unknown error', String(message));
}
}