chore(extension): do not complain about old extension version (#937)

This commit is contained in:
Yury Semikhatsky
2025-08-22 17:53:30 -07:00
committed by GitHub
parent 3d1a60b7f3
commit 0812df2f5e
3 changed files with 8 additions and 74 deletions

View File

@@ -22,8 +22,7 @@ import type { TabInfo } from './tabItem.js';
type Status =
| { type: 'connecting'; message: string }
| { type: 'connected'; message: string }
| { type: 'error'; message: string }
| { type: 'error'; versionMismatch: { pwMcpVersion: string; extensionVersion: string; downloadUrl: string } };
| { type: 'error'; message: string };
const ConnectApp: React.FC = () => {
const [tabs, setTabs] = useState<TabInfo[]>([]);
@@ -59,23 +58,6 @@ const ConnectApp: React.FC = () => {
return;
}
const pwMcpVersion = params.get('pwMcpVersion');
const extensionVersion = chrome.runtime.getManifest().version;
if (pwMcpVersion !== extensionVersion) {
const downloadUrl = params.get('downloadUrl') || `https://github.com/microsoft/playwright-mcp/releases/download/v${extensionVersion}/playwright-mcp-extension-v${extensionVersion}.zip`;
setShowButtons(false);
setShowTabList(false);
setStatus({
type: 'error',
versionMismatch: {
pwMcpVersion: pwMcpVersion || 'unknown',
extensionVersion,
downloadUrl
}
});
return;
}
void connectToMCPRelay(relayUrl);
// If this is a browser_navigate command, hide the tab list and show simple allow/reject
@@ -199,50 +181,11 @@ const ConnectApp: React.FC = () => {
);
};
const VersionMismatchError: React.FC<{ pwMcpVersion: string; extensionVersion: string; downloadUrl: string }> = ({ pwMcpVersion, extensionVersion, downloadUrl }) => {
const readmeUrl = 'https://github.com/microsoft/playwright-mcp/blob/main/extension/README.md';
const handleDownloadAndOpenExtensions = () => {
// Start download
const link = document.createElement('a');
link.href = downloadUrl;
link.download = `playwright-mcp-extension-v${extensionVersion}.zip`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
setTimeout(() => {
chrome.tabs.query({ active: true, currentWindow: true }, tabs => {
if (tabs[0]?.id)
chrome.tabs.update(tabs[0].id, { url: 'chrome://extensions/' });
});
}, 1000); // Wait 1 second for download to initiate
};
return (
<div>
Incompatible Playwright MCP version: {pwMcpVersion} (extension version: {extensionVersion}).{' '}
<button
onClick={handleDownloadAndOpenExtensions}
className='link-button'
>Click here</button> to download the matching extension, then drag and drop it into the Chrome Extensions page.{' '}
See <a href={readmeUrl} target='_blank' rel='noopener noreferrer'>installation instructions</a> for more details.
</div>
);
};
const StatusBanner: React.FC<{ status: Status }> = ({ status }) => {
return (
<div className={`status-banner ${status.type}`}>
{'versionMismatch' in status ? (
<VersionMismatchError
pwMcpVersion={status.versionMismatch.pwMcpVersion}
extensionVersion={status.versionMismatch.extensionVersion}
downloadUrl={status.versionMismatch.downloadUrl}
/>
) : (
status.message
)}
{status.message}
</div>
);
};