Preserve previous error messages

Reviewed By: passy

Differential Revision: D51197113

fbshipit-source-id: 237c6f1f894cb4d758150ff2bddf14c104d3b381
This commit is contained in:
Andrey Goncharov
2023-11-10 03:39:32 -08:00
committed by Facebook GitHub Bot
parent 8348d617d0
commit 4b3f572205
6 changed files with 53 additions and 13 deletions

View File

@@ -30,11 +30,11 @@ export type {FlipperServer, FlipperServerCommands, FlipperServerExecOptions};
export function createFlipperServer( export function createFlipperServer(
host: string, host: string,
port: number, port: number,
tokenProvider: () => Promise<string | null | undefined>, tokenProvider: () => string | null | undefined,
onStateChange: (state: FlipperServerState) => void, onStateChange: (state: FlipperServerState) => void,
): Promise<FlipperServer> { ): Promise<FlipperServer> {
const URLProvider = async () => { const URLProvider = () => {
const token = await tokenProvider(); const token = tokenProvider();
return `ws://${host}:${port}?token=${token}`; return `ws://${host}:${port}?token=${token}`;
}; };

View File

@@ -270,7 +270,7 @@ function showCompileError() {
// Symbolicating compile errors is wasted effort // Symbolicating compile errors is wasted effort
// because the stack trace is meaningless: // because the stack trace is meaningless:
(error as any).preventSymbolication = true; (error as any).preventSymbolication = true;
window.flipperShowMessage?.(message); window.flipperShowMessage?.({detail: message});
throw error; throw error;
} }

View File

@@ -24,7 +24,7 @@ declare global {
FLIPPER_UNIXNAME: string; FLIPPER_UNIXNAME: string;
FLIPPER_AUTH_TOKEN: string; FLIPPER_AUTH_TOKEN: string;
flipperShowMessage?(message: string): void; flipperShowMessage?(message: {title?: string; detail?: string}): void;
flipperHideMessage?(): void; flipperHideMessage?(): void;
} }
} }

View File

@@ -51,7 +51,7 @@ async function start() {
const params = new URL(location.href).searchParams; const params = new URL(location.href).searchParams;
const tokenProvider = async () => { const tokenProvider = () => {
const providerParams = new URL(location.href).searchParams; const providerParams = new URL(location.href).searchParams;
let token = providerParams.get('token'); let token = providerParams.get('token');
if (!token) { if (!token) {
@@ -62,6 +62,11 @@ async function start() {
'[flipper-client][ui-browser] Failed to get token from HTML', '[flipper-client][ui-browser] Failed to get token from HTML',
token, token,
); );
window.flipperShowMessage?.({
detail:
'[flipper-client][ui-browser] Failed to get token from HTML: ' +
token,
});
} }
} }
@@ -108,7 +113,7 @@ async function start() {
switch (state) { switch (state) {
case FlipperServerState.CONNECTING: case FlipperServerState.CONNECTING:
getLogger().info('[flipper-client] Connecting to server'); getLogger().info('[flipper-client] Connecting to server');
window.flipperShowMessage?.('Connecting to server...'); window.flipperShowMessage?.({title: 'Connecting to server...'});
break; break;
case FlipperServerState.CONNECTED: case FlipperServerState.CONNECTED:
getLogger().info( getLogger().info(
@@ -118,7 +123,7 @@ async function start() {
break; break;
case FlipperServerState.DISCONNECTED: case FlipperServerState.DISCONNECTED:
getLogger().info('[flipper-client] Disconnected from server'); getLogger().info('[flipper-client] Disconnected from server');
window.flipperShowMessage?.('Waiting for server...'); window.flipperShowMessage?.({title: 'Waiting for server...'});
break; break;
} }
}, },
@@ -172,7 +177,7 @@ start().catch((e) => {
error: getStringFromErrorLike(e), error: getStringFromErrorLike(e),
pwa: window.matchMedia('(display-mode: standalone)').matches, pwa: window.matchMedia('(display-mode: standalone)').matches,
}); });
window.flipperShowMessage?.('Failed to start UI with error: ' + e); window.flipperShowMessage?.({detail: 'Failed to start UI with error: ' + e});
}); });
async function initializePWA() { async function initializePWA() {

View File

@@ -32,6 +32,7 @@
padding: 50px; padding: 50px;
overflow: auto; overflow: auto;
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 20px; font-size: 20px;
@@ -39,6 +40,10 @@
text-align: center; text-align: center;
} }
.message p {
font-size: 12px;
}
.console { .console {
font-family: 'Fira Mono'; font-family: 'Fira Mono';
width: 600px; width: 600px;
@@ -98,6 +103,8 @@
<body> <body>
<div id="troubleshoot" class="message"> <div id="troubleshoot" class="message">
<h1 id="tourbleshoot_title"></h1>
<p id="tourbleshoot_details"></p>
</div> </div>
<div id="root"> <div id="root">
@@ -121,9 +128,18 @@
const root = document.getElementById('root'); const root = document.getElementById('root');
const troubleshootBox = document.getElementById('troubleshoot'); const troubleshootBox = document.getElementById('troubleshoot');
const troubleshootBoxTitle = document.getElementById('tourbleshoot_title');
const troubleshootBoxDetails = document.getElementById('tourbleshoot_details');
function showMessage(text, centered) { function showMessage({ title, detail }) {
troubleshootBox.innerText = text; if (title) {
troubleshootBoxTitle.innerText = title
}
if (detail) {
const newMessage = document.createElement('p')
newMessage.innerText = detail;
troubleshootBoxDetails.appendChild(newMessage)
}
root.style.display = 'none'; root.style.display = 'none';
troubleshootBox.style.display = 'flex'; troubleshootBox.style.display = 'flex';
@@ -132,6 +148,8 @@
function hideMessage() { function hideMessage() {
root.style.display = 'block'; root.style.display = 'block';
troubleshootBox.style.display = 'none'; troubleshootBox.style.display = 'none';
troubleshootBoxTitle.innerHTML = ''
troubleshootBoxDetails.innerHTML = ''
} }
window.flipperShowMessage = showMessage; window.flipperShowMessage = showMessage;

View File

@@ -32,12 +32,16 @@
padding: 50px; padding: 50px;
overflow: auto; overflow: auto;
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 20px; font-size: 20px;
color: #525252; color: #525252;
text-align: center; text-align: center;
} }
.message p {
font-size: 12px;
}
#troubleshoot { #troubleshoot {
display: none; display: none;
@@ -48,6 +52,8 @@
<body> <body>
<div id="troubleshoot" class="message"> <div id="troubleshoot" class="message">
<h1 id="tourbleshoot_title"></h1>
<p id="tourbleshoot_details"></p>
</div> </div>
<div id="root"> <div id="root">
@@ -70,9 +76,18 @@
const root = document.getElementById('root'); const root = document.getElementById('root');
const troubleshootBox = document.getElementById('troubleshoot'); const troubleshootBox = document.getElementById('troubleshoot');
const troubleshootBoxTitle = document.getElementById('tourbleshoot_title');
const troubleshootBoxDetails = document.getElementById('tourbleshoot_details');
function showMessage(text) { function showMessage({ title, detail }) {
troubleshootBox.innerText = text; if (title) {
troubleshootBoxTitle.innerText = title
}
if (detail) {
const newMessage = document.createElement('p')
newMessage.innerText = detail;
troubleshootBoxDetails.appendChild(newMessage)
}
root.style.display = 'none'; root.style.display = 'none';
troubleshootBox.style.display = 'flex'; troubleshootBox.style.display = 'flex';
@@ -81,6 +96,8 @@
function hideMessage() { function hideMessage() {
root.style.display = 'block'; root.style.display = 'block';
troubleshootBox.style.display = 'none'; troubleshootBox.style.display = 'none';
troubleshootBoxTitle.innerHTML = ''
troubleshootBoxDetails.innerHTML = ''
} }
window.flipperShowMessage = showMessage; window.flipperShowMessage = showMessage;