diff --git a/desktop/flipper-server-core/src/server/startServer.tsx b/desktop/flipper-server-core/src/server/startServer.tsx index 00db40d1e..8d89945c8 100644 --- a/desktop/flipper-server-core/src/server/startServer.tsx +++ b/desktop/flipper-server-core/src/server/startServer.tsx @@ -72,6 +72,8 @@ const verifyAuthToken = (req: http.IncomingMessage): boolean => { return true; }; +let isReady = false; + /** * Orchestrates the creation of the HTTP server, proxy, and WS server. * @param config Server configuration. @@ -108,7 +110,10 @@ async function startHTTPServer(config: Config): Promise<{ }); app.get('/', (_req, res) => { - fs.readFile(path.join(config.staticPath, config.entry), (_err, content) => { + const resource = isReady + ? path.join(config.staticPath, config.entry) + : path.join(config.staticPath, 'loading.html'); + fs.readFile(resource, (_err, content) => { res.end(content); }); }); @@ -127,6 +132,8 @@ async function startHTTPServer(config: Config): Promise<{ server.close(); }); + server.listen(config.port); + return new Promise((resolve) => { console.log(`Starting server on http://localhost:${config.port}`); const readyForIncomingConnections = ( @@ -134,13 +141,12 @@ async function startHTTPServer(config: Config): Promise<{ companionEnv: FlipperServerCompanionEnv, ): Promise => { attachSocketServer(socket, serverImpl, companionEnv); + isReady = true; return new Promise((resolve) => { - server.listen(config.port, undefined, () => { - tracker.track('server-started', { - port: config.port, - }); - resolve(); + tracker.track('server-started', { + port: config.port, }); + resolve(); }); }; resolve({app, server, socket, readyForIncomingConnections}); diff --git a/desktop/flipper-server/src/index.tsx b/desktop/flipper-server/src/index.tsx index 5a2ba8ceb..17f5935aa 100644 --- a/desktop/flipper-server/src/index.tsx +++ b/desktop/flipper-server/src/index.tsx @@ -215,6 +215,9 @@ async function start() { `[flipper-server][bootstrap] HTTP server started (${httpServerStartedMS} ms)`, ); + // At this point, the HTTP server is ready and listening. + launch(); + const flipperServer = await startFlipperServer( rootPath, staticPath, @@ -342,7 +345,7 @@ process.on('unhandledRejection', (reason, promise) => { }); start() - .then(launch) + .then(() => {}) .catch((e) => { console.error(chalk.red('Server startup error: '), e); process.exit(1); diff --git a/desktop/static/loading.html b/desktop/static/loading.html new file mode 100644 index 000000000..e16e5f652 --- /dev/null +++ b/desktop/static/loading.html @@ -0,0 +1,68 @@ + + + + + + + + + Loading... + + + + + + +
+
+ Loading... +
+ +
+ + + +