Skip to content

Commit

Permalink
chore(gatsby): upgrade socket.io (#29765) (#29769)
Browse files Browse the repository at this point in the history
* chore(gatsby): upgrade socket.io

* fix types

(cherry picked from commit 3ab492c)

Co-authored-by: Ward Peeters <ward@coding-tech.com>
  • Loading branch information
GatsbyJS Bot and wardpeet authored Feb 25, 2021
1 parent 65274d6 commit 180ebad
Show file tree
Hide file tree
Showing 5 changed files with 143 additions and 153 deletions.
7 changes: 3 additions & 4 deletions packages/gatsby/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -138,8 +138,8 @@
"shallow-compare": "^1.2.2",
"signal-exit": "^3.0.3",
"slugify": "^1.4.4",
"socket.io": "2.3.0",
"socket.io-client": "2.3.0",
"socket.io": "3.1.1",
"socket.io-client": "3.1.1",
"source-map": "^0.7.3",
"source-map-support": "^0.5.19",
"st": "^2.0.0",
Expand Down Expand Up @@ -174,7 +174,6 @@
"@types/reach__router": "^1.3.5",
"@types/semver": "^7.1.0",
"@types/signal-exit": "^3.0.0",
"@types/socket.io": "^2.1.4",
"@types/string-similarity": "^3.0.0",
"@types/tmp": "^0.2.0",
"@types/webpack-dev-middleware": "^3.7.1",
Expand Down Expand Up @@ -259,4 +258,4 @@
"yargs": {
"boolean-negation": false
}
}
}
10 changes: 8 additions & 2 deletions packages/gatsby/src/commands/develop.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import execa from "execa"
import chokidar from "chokidar"
import getRandomPort from "detect-port"
import { detectPortInUseAndPrompt } from "../utils/detect-port-in-use-and-prompt"
import socket from "socket.io"
import { Server as SocketIO } from "socket.io"
import fs from "fs-extra"
import onExit from "signal-exit"
import {
Expand Down Expand Up @@ -344,7 +344,13 @@ module.exports = async (program: IProgram): Promise<void> => {
: http.createServer()
statusServer.listen(statusServerPort)

const io = socket(statusServer)
const io = new SocketIO(statusServer, {
// whitelist all (https://github.com/expressjs/cors#configuration-options)
cors: {
origin: true,
},
cookie: true,
})

const handleChildProcessIPC = (msg): void => {
if (msg.type === `HEARTBEAT`) return
Expand Down
33 changes: 21 additions & 12 deletions packages/gatsby/src/utils/__tests__/websocket-manager.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,11 @@ jest.mock(`fs-extra`, () => {
}
})

// we mock it to make tests faster
jest.mock(`gatsby-cli/lib/reporter`, () => {
return {}
})

const INTERVAL_TIMEOUT = 500
const TEST_TIMEOUT = 30000

Expand Down Expand Up @@ -49,9 +54,13 @@ describe(`websocket-manager`, () => {
let websocketManager: WebsocketManager
let httpServerAddr

async function getClientSocket(): Promise<typeof io.Socket> {
function getClientSocket(): typeof io.Socket {
return io.default(`http://127.0.0.1:${httpServerAddr.port}`)
}

function getClientSocketAndWaitForConnect(): Promise<typeof io.Socket> {
return new Promise(resolve => {
const clientSocket = io.default(`http://127.0.0.1:${httpServerAddr.port}`)
const clientSocket = getClientSocket()
clientSocket.on(`connect`, () => {
resolve(clientSocket)
})
Expand Down Expand Up @@ -149,7 +158,7 @@ describe(`websocket-manager`, () => {
`Can connect`,
async () => {
expect.assertions(1)
const clientSocket = await getClientSocket()
const clientSocket = await getClientSocketAndWaitForConnect()
expect(clientSocket.connected).toBe(true)
clientSocket.disconnect()
},
Expand All @@ -170,7 +179,7 @@ describe(`websocket-manager`, () => {
async () => {
expect.assertions(3)

const clientSocket = await getClientSocket()
const clientSocket = await getClientSocketAndWaitForConnect()

expect(websocketManager.activePaths).toEqual(new Set())

Expand Down Expand Up @@ -202,8 +211,8 @@ describe(`websocket-manager`, () => {
`track individual clients`,
async () => {
expect.assertions(5)
const clientSocket1 = await getClientSocket()
const clientSocket2 = await getClientSocket()
const clientSocket1 = await getClientSocketAndWaitForConnect()
const clientSocket2 = await getClientSocketAndWaitForConnect()
expect(websocketManager.activePaths).toEqual(new Set())

let activePathAdjustedPromise = waitUntil(done => {
Expand Down Expand Up @@ -261,7 +270,7 @@ describe(`websocket-manager`, () => {
async function registerPathnameAndGetPath(
pathname: string
): Promise<string> {
const clientSocket = await getClientSocket()
const clientSocket = await getClientSocketAndWaitForConnect()

if (websocketManager.activePaths.size > 0) {
throw new Error(`There was client connected already`)
Expand Down Expand Up @@ -465,7 +474,7 @@ describe(`websocket-manager`, () => {
`Client can receive page query update`,
async () => {
expect.assertions(1)
const clientSocket = await getClientSocket()
const clientSocket = await getClientSocketAndWaitForConnect()

const pageQueryId = `/blog/`
const result = {
Expand Down Expand Up @@ -512,7 +521,7 @@ describe(`websocket-manager`, () => {
`Client can receive static query update`,
async () => {
expect.assertions(1)
const clientSocket = await getClientSocket()
const clientSocket = await getClientSocketAndWaitForConnect()

const staticQueryId = `12345`
const result = {
Expand Down Expand Up @@ -553,7 +562,7 @@ describe(`websocket-manager`, () => {
it(`Emits errors to display by clients`, async done => {
expect.assertions(1)

const clientSocket = await getClientSocket()
const clientSocket = await getClientSocketAndWaitForConnect()

function handler(msg): void {
if (
Expand All @@ -575,7 +584,7 @@ describe(`websocket-manager`, () => {
it(`Emits stored errors to new clients`, async done => {
expect.assertions(1)

const clientSocket = await getClientSocket()
const clientSocket = getClientSocket()

function handler(msg): void {
if (
Expand All @@ -597,7 +606,7 @@ describe(`websocket-manager`, () => {
it(`Can clear errors by emitting empty "overlayError" msg`, async done => {
expect.assertions(1)

const clientSocket = await getClientSocket()
const clientSocket = await getClientSocketAndWaitForConnect()

function handler(msg): void {
if (
Expand Down
29 changes: 16 additions & 13 deletions packages/gatsby/src/utils/websocket-manager.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import telemetry from "gatsby-telemetry"
import url from "url"
import { createHash } from "crypto"
import { findPageByPath } from "./find-page-by-path"
import socketIO from "socket.io"
import { Server as SocketIO, Socket } from "socket.io"

export interface IPageQueryResult {
id: string
Expand All @@ -31,7 +31,7 @@ function hashPaths(paths: Array<string>): Array<string> {

interface IClientInfo {
activePath: string | null
socket: socketIO.Socket
socket: Socket
}

export class WebsocketManager {
Expand All @@ -40,19 +40,22 @@ export class WebsocketManager {
errors: Map<string, string> = new Map()
pageResults: PageResultsMap = new Map()
staticQueryResults: QueryResultsMap = new Map()
websocket: socketIO.Server | undefined

init = ({
server,
}: {
server: HTTPSServer | HTTPServer
}): socketIO.Server => {
this.websocket = socketIO(server, {
websocket: SocketIO | undefined

init = ({ server }: { server: HTTPSServer | HTTPServer }): SocketIO => {
// make typescript happy, else it complained about this.websocket being undefined
const websocket = new SocketIO(server, {
// we see ping-pong timeouts on gatsby-cloud when socket.io is running for a while
// increasing it should help
// @see https://github.com/socketio/socket.io/issues/3259#issuecomment-448058937
pingTimeout: 30000,
// whitelist all (https://github.com/expressjs/cors#configuration-options)
cors: {
origin: true,
},
cookie: true,
})
this.websocket = websocket

const updateServerActivePaths = (): void => {
const serverActivePaths = new Set<string>()
Expand All @@ -64,7 +67,7 @@ export class WebsocketManager {
this.activePaths = serverActivePaths
}

this.websocket.on(`connection`, socket => {
websocket.on(`connection`, socket => {
const clientInfo: IClientInfo = {
activePath: null,
socket,
Expand Down Expand Up @@ -148,10 +151,10 @@ export class WebsocketManager {
this.emitStalePageDataPathsFromStaticQueriesAssignment.bind(this)
)

return this.websocket
return websocket
}

getSocket = (): socketIO.Server | undefined => this.websocket
getSocket = (): SocketIO | undefined => this.websocket

emitStaticQueryData = (data: IStaticQueryResult): void => {
this.staticQueryResults.set(data.id, data)
Expand Down
Loading

0 comments on commit 180ebad

Please sign in to comment.